This web app is a submission for the API Countries Challenge for the frontend, using NextJS, Redux and Emotion.
Link to Demo, courtesy of Vercel.
After clonning the repository, run yarn or npm i to install the necessary dependencies.
To run local development environent, run yarn dev or npm run dev.
| Command | Description |
|---|---|
build |
build the web app into the .next folder |
dev |
run local environment (port 3000) in development mode |
start |
run the built bundle locally |
lint |
run check for errors, syntax and code styling rules |
test |
run cypress frontend for e2e tests |
test-h |
run cypress tests headless |
export |
exports web app to html (for github pages deployment) |
These is the work required to consider this project "done", split into sizeable chunks.
| Description | Status |
|---|---|
| See all countries from the API on the homepage on load | ✅ |
| Search for a country using an input field | ✅ |
| Click on a country to see more detailed information on a separate page. | ✅ |
| Add end to end (E2E) tests | ✅ |
| Optimize for performance | ✅ |
| Configure your repository to publish your code to a web address. | ✅ |
| Toggle the color scheme between light and dark mode | ✅ |
| Filter countries by region | ✅ |
| Click through to the border countries on the detail page | ✅ |
- Redux search action fired on homepage landing.
Dark/Light transition animation not working accordingly on country details page.