Task
Run the application
npm i --prefix client
docker compose up --build
Project overview
This is a very simple app built using SvelteKit, with a ready-to-use Go server. It uses an open API to download a list of anime and display them. You can access anime details and add them to favorites. All favorites are then displayed on the right side of the screen.
IMPORTANT
This API has a rate limiter, so sometimes there might be some errors. Just refresh and try again.
- Copy this repo (don't fork it!) into Your github account.
- Create a new branch on Your github and start working there.
- After finish, create a Pull Request from Your branch to Your Main, and send me a link (DON'T INVITE ME!).
This way i will be able to see all the changes, and my repo will be clean for the next candidate :). - Please check that Your example can be run without any additional configuration:
- delete repo
- clone it again
- switch to Your branch
- run the command
docker compose up --build
If you will have any questions, just write to me:
[email protected]
Tasks
Please, try to not spend more than 6 hours. You don't need to fully finish all of them, choose how much you want to dive into each of them.
But You must at least touch all of them. Sorry :)
The Backend part might be the hardest, so if it will start to take too much time, just show some sql knowlegde or write one simple endpoint.
Styling
Style this application a little bit using TailwindCss. Add some animation using gsap (preferably), animejs, motion or svelte animation. Add a table with pagination to the anime list.
Functionality
On the anime details page, add a button to remove the anime from favorites. For the "Add to favorites" form action, add validation on the server side using the Zod library. When user add or remove anime from favorites, show a toast notification. Make it that there is no type assertion ("as") anywhere.
Backend
Instead of using the data/favorites.ts object, use a connected Go backend to store and load favorites. Whenever a user adds more than 5 favorites, show a toast that a limit has been reached. The server is connected, with a workign SQLite database and a simple API.
A little helper:
- Add necessary columns to the favorites table (
system_migration.go) - Add INSERT and DELETE queries to the server (
favorites_db.go) - Add new service layer to the server to add / remove favorites (
favorites_http.go) - Add new endpoints to the server (
main.go)
To clean the database, just remove the db.sqlite3 files inside system folder and restart the Docker container.
Reference Links
- GSAP: https://gsap.com/
- Svelte: https://svelte.dev/
- SvelteKit: https://kit.svelte.dev/
- Svelte Form Actions: https://kit.svelte.dev/docs/form-actions
- Go By Example: https://gobyexample.com/
- Go Tour: https://go.dev/tour/welcome/1
