Skip to content

Nathan-Somto/Rest-Countries-Api

Repository files navigation

Frontend Mentor - REST Countries API with color theme switcher solution

This is a solution to the REST Countries API with color theme switcher challenge on Frontend Mentor. This is a wonderful project to get started with if you are a newbie to react like me, because you get to cover all the basics. This is my first react project and i hope to add more soon.

Table of contents

Overview

The challenge

Users should be able to:

  • See all countries from the API on the homepage
  • Search for a country using an input field
  • Filter countries by region
  • Click on a country to see more detailed information on a separate page
  • Click through to the border countries on the detail page
  • Toggle the color scheme between light and dark mode (optional)

Screenshot

Links

My process

Built with

  • Semantic HTML5 markup
  • CSS custom properties
  • Flexbox
  • CSS Grid
  • Mobile-first workflow
  • React - JS library
  • React Router - React Third party Package

Note: These are just examples. Delete this note and replace the list above with your own choices

What I learned

Use this section to recap over some of your major learnings while working through this project. Writing these out and providing code samples of areas you want to highlight is a great way to reinforce your own knowledge.

To see how you can add code snippets, see below:

<h1>Some HTML code I'm proud of</h1>
.proud-of-this-css {
  color: papayawhip;
}
const proudOfThisFunc = () => {
  console.log('🎉')
}

Continued development

After the completion of this project i want to focus more on building react applications and creating dynamic UI's.

Useful resources

  • React Beta Docs - This helped me in Understanding the basics of react concepts such as hooks, lifecycle methods and thinking in react.
  • Stack Overflow - I won't lie , i faced a lot of problems in this project thank goodness for stack overflow.

Author