Frontend-Framework-Challenge

Requirements

• Router : 2 pages, a home/index and a favorites page
• Conditional rendering of navigation: while on home page display home or a logo, while on favorites pages, you must display favorites
• The form must be used to trigger an api call
• Conditional rendering of loading: display a loader while waiting for images
• Conditional rendering of images: render images or "No results found"
• Conditional rendering of favorites icon: if the image is favorited display a filled star, empty otherwise.
• Add/remove favorites: ability to add/remove favorites by clicking on a star icon
• Favorites Page : display favorites or "No favorites yet"
• Favorites Page : ability to remove a favorited image

Rules

• The challenge must be completed within 24 hours
• You must use the html/css boilerplate provided
• Vanilla js is mandatory, you can use any JS framework for the rest
• You must use Skeleton and FontAwesome
• For vanilla js , you cannot use modules or npm

Usage

Install the dependencies and devDependencies and start the server.

Svelte

$ cd svelte
$ npm i
$ npm run dev

Vue

$ cd vue3-composition-api
$ npm i
$ npm run serve

React

$ cd react-js
$ yarn install
$ yarn start

Angular

$ cd angular
$ npm i
$ ng serve