Giter Site home page Giter Site logo

country-app-frontend-project's Introduction

Country Information App

This application allows users to search and view information about countries. Users can also add countries to their favorites list and view them separately. The app provides a world map view with interactive country borders.

Table of Contents

Features

  • Search countries by name
  • View detailed information about a country
  • Add and remove countries from favorites list
  • Interactive world map
  • Dark and light theme

Components

  • App: The main application component that wraps the entire application and sets up the theme.
  • Index: Sets up the routing for different pages in the application.
  • Home: The home page component.
  • Countries: Displays a list of countries and a search bar.
  • CountryCard: Displays a single country card with basic information.
  • CountryDetails: Displays detailed information about a selected country.
  • Favorite: Displays the list of favorite countries.
  • WorldMap: Displays the interactive world map with country borders.
  • Navbar: The navigation bar component.
  • Footer: The footer component.
  • Error: Displays an error message when fetching data fails.

Redux Store

The Redux store is responsible for managing the application's state. The following slices manage different parts of the application state:

  • countriesSlice: Manages the state related to the list of countries.
  • countryDetailsSlice: Manages the state related to the details of a specific country.
  • favoriteCountriesListSlice: Manages the state related to the user's favorite countries list.
  • themeSelectorSlice: Manages the state related to the application's theme (dark or light mode).

Services

The services folder contains functions that make API calls to fetch data. These functions are used in the async actions of the Redux slices.

  • api.ts: Provides functions for fetching countries and country details.

Installation

country-app-frontend-project's People

Contributors

yevgeniyt avatar v-limo avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.