https://github.com/andreynav/countries-wiki
Wiki app with data for all countries | React ★★★ API and UI tests | Cypress
https://github.com/andreynav/countries-wiki
axios countries countries-api countries-data country-flags cypress react react-icons react-router react-select styled-components
Last synced: 6 months ago
JSON representation
Wiki app with data for all countries | React ★★★ API and UI tests | Cypress
- Host: GitHub
- URL: https://github.com/andreynav/countries-wiki
- Owner: andreynav
- License: apache-2.0
- Created: 2023-02-06T14:37:49.000Z (almost 3 years ago)
- Default Branch: master
- Last Pushed: 2023-07-09T15:51:31.000Z (over 2 years ago)
- Last Synced: 2025-02-12T23:39:42.550Z (10 months ago)
- Topics: axios, countries, countries-api, countries-data, country-flags, cypress, react, react-icons, react-router, react-select, styled-components
- Language: TypeScript
- Homepage: https://countries-wiki-prod.vercel.app
- Size: 354 KB
- Stars: 0
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
# General Notes
The project is a web application with information about countries all around the world. You can select an available region of the world or search for the specific country directly. The project is made using React, React Router and Styled components.
The project use [REST Countries API](https://restcountries.com/).
The project based on [Frontend Mentor Challenge](https://www.frontendmentor.io/challenges/rest-countries-api-with-color-theme-switcher-5cacc469fec04111f7b848ca).
## Demo
You can open and use the app by [countries-wiki app link](https://countries-wiki-prod.vercel.app/).
## Project structure
The project has multilayer structure:
- `cypress` - used to keep UI and API tests
- `public` - used to keep static content for builds
- `api` - used to keep API calls functionality
- `assets` - used to keep static content
- `components` - used to keep react components
- `hooks` - used to keep hooks
- `styles` - used to keep styles
- `types` - used to keep TypeScript common types
- `utils` - used to keep utils for helping
## Dependencies
The project has the next dependencies in the [package.json](package.json) file.
## Installation
1. Clone project to your PC by the following command:
```console
git clone https://github.com/andreynav/countries-wiki.git
```
2. Open the root directory and enter the following command:
```console
yarn
```
3. In the root directory create `.env` file and add inside it a row `PORT=3002` (or any desired port).
## Running project
To run project, open the root directory and enter the following command:
```console
yarn start
```
The command runs the app in the development mode.
Open [http://localhost:3002](http://localhost:3002) to view it in your browser.
## Running Cypress tests
To run tests first you need to run the project and after that open the root directory and enter the following command:
```console
npx cypress open
```
You also can run test via command line interface:
```console
yarn cy-all-cli
```
See available running scripts in package.json script section.
## License
The project is open source software provided under the [Apache License 2.0](LICENSE.md).