iamsomraj / countries-frontend-mentor

This is a solution to the REST Countries API with color theme switcher challenge on Frontend Mentor. I have used React and Typescript to complete this challenge. To be precise, I have used useContext and useReducer to maintain the global state of application.

Home Page:https://countries-app-frontend-mentor.vercel.app/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

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. I have used React and Typescript to complete this challenge. To be precise, I have used useContext and useReducer to maintain the global state of application.

Preview

You can preview the completed project here.

Overview

The goal of this challenge was to create a web application that allows users to search for countries using the REST Countries API and view detailed information about each country. Additionally, the application should have a color theme switcher that allows users to toggle between light and dark themes.

Features

  • Search for countries by name or region
  • View detailed information about a selected country
  • Filter countries by region
  • Toggle between light and dark themes

Tech Stack

The project uses the following technologies:

  • React
  • Typescript
  • Tailwind

Screenshots

Desktop Preview


Desktop Preview

Desktop Home Page Preview

Mobile Preview


Mobile Preview

Mobile Home Page Preview

Desktop Preview


Desktop Preview

Desktop Detail Page Preview

Mobile Preview


Mobile Preview

Mobile Detail Page Preview

Resources

License

This project is licensed under the MIT License.

Feedback

If you have any feedback or suggestions, please feel free to reach out to me at iamsomraj@gmail.com.

About

This is a solution to the REST Countries API with color theme switcher challenge on Frontend Mentor. I have used React and Typescript to complete this challenge. To be precise, I have used useContext and useReducer to maintain the global state of application.

https://countries-app-frontend-mentor.vercel.app/

License:MIT License


Languages

Language:TypeScript 89.4%Language:JavaScript 7.4%Language:CSS 1.8%Language:HTML 1.4%