Solution for a challenge from frontendmentor.io.
Introduce your projects by taking a screenshot or a gif. Try to tell visitors a story about your project by answering:
- What was your experience?
- What have you learned/improved?
- Your wisdom? 🙂
- View the optimal layout for the app depending on their device’s screen size
- See hover states for all interactive elements on the page
- Navigate between Home, Movies, TV Series, and Bookmarked Shows pages
- Add/Remove bookmarks from all movies and TV series
- Search for relevant shows on all pages
- Bonus: Build this project as a full-stack application
- Bonus: If you’re building a full-stack app, we provide authentication screen (sign-up/login) designs if you’d like to create an auth flow
How To Use
# Clone this repository $ git clone https://github.com/HermanLD/FM-entertain-app # Install dependencies $ npm install # Compiles and hot-reloads for development $ npm run dev # Compiles and minifies for production $ npm run build # Run your unit tests [Vitest](https://vitest.dev/) $ npm run test:unit # Run your unit tests [Vitest](https://vitest.dev/) $ npm run build $ npm run test:e2e # Lint with [ESLint](https://eslint.org/) $ npm run lint
Recommended IDE Setup
- Vitest Unit Testing
- Cypress E2E Testing
- A Complete Guide to Flexbox -by CSS-Tricks
- What the Flexbox!? -Course by Wes Bos
- Frontend Mentor