- Node.js 20
- npm
npm install
npm run dev
npm run build
npm run preview
And navigate to http://localhost:4173/
Run Unit Tests with Vitest
npm run test:unit
- Vue Router is used to keep the selected genre in memory, so when the user refreshes the application, the genre is still known.
- The home view is kept as simple as possible, responsible for only knowing the shows, genres, and currently selected show.
- The other components are decoupled from the home view in a way that makes them easy to test and reuse if needed.
- To create the horizontal TV show navigation, Swiper is used. With Tailwind, it's possible to create a horizontal scroll snap navigation, but it’s way too hard to implement JS navigation (forward and backward, etc.).
- The shows summary contains HTML code, because we can't control the data, sanitizing is a must.