This is the repo for the second capstone project in our Microverse journey. It is a group project created by Kingjosh007 and Fikerte-T.
A video of us presenting our project is available here
We had to combine all the knowledge we gained in the Javascript module in order to build this project in 3-4 days. The project had be API-based and some of the requirements we had to meet included:
- Building a single page app using Vanilla Javascript only;
- Handling API calls;
- Writing asynchronous code: make a good use of callbacks, promises and
async/await
; - Using Webpack to bundle the app;
- Making use of the best practices and tools regarding testing: performing unit tests, following the AAA pattern, using the Jest framework;
- Using the best practices for code versioning by following Gitflow;
- Being able to organize a group work on a Kanban board (Github Projects);
- Performing code reviews for team members;
- Solving git conflicts.
- etc.
We chose to build our project around a countries API. It's a single page app called CountriesFacts as it allows users to comment facts about countries.
As a user:
- I can see all the countries provided by the API when the app loads. I can see the flags, and number of likes of every country;
- I can click a like button for each country;
- Inside a popup, I can view all the comments posted by different users that pertain to a single country;
- I can post new comments for the country displayed in the popup;
- [BONUS] I can filter all the countries thanks to the input provided;
- [BONUS] I can sort all the countries based on the name or the number of likes;
- [BONUS] I can have the countries displayed with a pagination system for a easier navigation;
- [BONUS] I can set the number of countries I want to see at most per page;
Here is the link to the live version of this project: See it live
To get a local copy of this project running, do the following:
- In your terminal,
cd
to the folder where you want to copy this project. - Still in your terminal, type
git clone [email protected]:Fikerte-T/capstone2-countries-facts.git
- Run
cd capstone2-countries-facts
- Run
npm install
; - If necessary, run
npm audit fix
to fix any vulnerability in the packages; - Run
npm start
to launch the app; - If your browser doesn't open automatically, open it manually and type
http://localhost:8080/
in the URL bar.
To perform the tests do the following:
- Follow steps 1-5 of the getting started section;
- Type
npm test
to run the test suites;
💻 Desktop version
📱 Mobile version
👤 Fikerte T.
- GitHub: @Fikerte-T
- Twitter: @tofikertesfaye
- LinkedIn: LinkedIn
👤 King Josaphat Chewa (KJC)
- GitHub: @Kingjosh007
- Twitter: @KingJoChewa
- LinkedIn: LinkedIn
Give a ⭐️ if you like this project!
- Heartfelt thanks to Microverse
- Hat tip to Lucas George Wendt whose image was used from Unsplash.
This project is MIT licensed.