Skip to content

covuworie/where-in-the-world

Repository files navigation

WhereInTheWorld

This project was generated with Angular CLI version 12.0.3. The project is to practice Angular development and is based on Frontend Mentor's challenge REST Countries API with color theme switcher. However, when you run the code you will see that I have extended the project with extra functionality.

There are several ways to manage data in Angular projects. This project uses an observable data services architecture to manage the data. You can see my more mature implementation using NgRx. I highly recommend using that approach instead.

Furthemore there is no database in this project and the data is actually stored in a simple db.json file at the root of the project using json-server. JSON Server creates a full fake REST API so that you can communicate with the backend via standard HTTP requests.

Prerequisites

  1. Install nodejs.
  2. Install the Angular CLI.
  3. Install Visual Studio Code (optional).

Development server

Run npm run dev. This will concurrently run the dev data server and the dev server. Navigate to http://localhost:3000 if you want to see the endpoints available and the data for the data server. Navigate to http://localhost:4200/ to see the running app. The app will automatically reload if you change any of the source files.

Code scaffolding

Run ng generate component component-name to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module.

Build

Run ng build to build the project. The build artifacts will be stored in the dist/ directory.

Running unit tests

Run ng test to execute the unit tests via Karma. No unit tests were written for this project.

Running end-to-end tests

Run ng e2e to execute the end-to-end tests via a platform of your choice. To use this command, you need to first add a package that implements end-to-end testing capabilities. No end-to-end tests were written for this project.

Further help

To get more help on the Angular CLI use ng help or go check out the Angular CLI Overview and Command Reference page.