Assignment should be made with React framework.
Just use this repository as a template to generate repo in your account and make an assignment in it.
Create a new branch, make the task in it, then make a Pull Request to the main branch, so we are able to review it and leave some comments if needed.
The application should fetch data from Pokemon API and render it:
- Create a view for the list of the pokemons on the main page (site.com/)
- Create a view for a single pokemon on another page (site.com/{id})
- Pokemon avatars not provided, so you can find them and add to your project or just use some placeholder api like this or this.
- Deploy it somewhere (e.g. Vercel, GitHub Pages, Netlify, Heroku, Firebase, etc.)
There are already predefined API calls (src/api/pokemon.api.ts
) to make requests to the Pokemon API.
It’s bad practice to use any or to not use types at all in typescript, so try to make typings for all your code.
Screenshots in the design
folder can be used as a reference for you, but you can make your own design if you want. Just do it with CSS (css modules, scss, tailwind, etc.), not with a predefined component library like MaterialUI or Bootstrap.
Routing in React - https://reactrouter.com/en/main
Typescript object types to make nice typings - https://www.typescriptlang.org/docs/handbook/2/objects.html
Documentation for the API:
- https://pokeapi.co/docs/v2#resource-listspagination-section - to get a list
- https://pokeapi.co/docs/v2#pokemon - to get a single
Start development server - npm run dev
.
Build project - npm run build
.