- Refactored initial setup to use Vite instead of Webpack in Create React App
- Moved
index.htmlintosrcfolder for Vite entry point - Initial vite config https://stackblitz.com/edit/vitejs-vite-sizsdi?file=tsconfig.json&terminal=dev
- Model types and client wrapper are taken from https://github.com/Gabb-c/pokenode-ts with refactor
- Deployed demo has hash router instead of history router because of github pages limitation
- Spinner styles taken/refactored from Ant design Spin
- use yarn
- follow code structure
- Using following API https://pokeapi.co/docs/v2#resource-listspagination-section implement:
- Avoid TypeScript, any
- Minimal style with Styled Components or EmotionJS
- Use SWR with Axios
- pokemons list, where name from API response;
- Pagination, 20 pokemons per page, calc total pages count from API.
- Add pokemon "card", except name display data, from API https://pokeapi.co/docs/v2#pokemon-section
- Add filter https://pokeapi.co/docs/v2#abilities, implement as panel or dropdown (select), could be multiple parameters.
- Create additional page-filter by https://pokeapi.co/docs/v2#pokemon-habitats with previous (Level 3) filters
No need to accomplish all levels
Main criteria Level 1, Level 2 desirable for implementation.
Good luck =)