How to Clone and Run an Angular App on Your Machine

Introduction:

Angular is the best JavaScript framework for designing websites.The main purpose of Angular is to build single-page applications.It is suitable for developing:

• Enterprise Web Applications
• Progressive Web Applications
• Progressive Web Applications
• Interface with Animations

Cloning

To clone a GitHub project, the following requirement are needed:

• Stable version of Node.js
• Git
• GitHub account

It needs more effort and time to start a project from scratch.So we can clone one project from GitHub. Clone any open-source project and modify it based on your requirements. Angular supports cloning as the most popular framework.This framework helps to build best front-end applications.

1.Install the Node Package Manager

Node Package Manager (npm) is an online repository for JavaScript packages. It is the default project manager for Node js. npm has a CLI (Command Line Interface) to perform various tasks.

npm package is present in the Node.js. Check the Node.js and npm package versions using the following command:

• node –version
• npm –version

2.Install the Angular CLI

The Angular CLI is a command-line interface tool to perform various development tasks. It involves initializing, developing, and maintaining Angular applications.

To install the Angular CLI,

$ npm install -g @angular/cli

To check the Angular CLI version,

$ ng version

3.Find project on the GitHub

Select the project from GitHub.Navigate to the green button labeled Code in the GitHub. Click it to reveal a dropdown list. Now,copy either the HTTP or SSH link.

4.Clone the project

To clone the project, Create a folder and name it Angular-Clone.

cd Angular-Clone

To copy the project to the folder.

git clone https://github.com/Reuben-Kipkemboi/Giphy-Replica.git

Next, check the Angular-Clone folder for clone Giphy-Replica. Navigate to the folder

cd Giphy-Replica

Check the project files in a code editor and view them via the GitHub web interface.

5.Install npm Packages

To run the project, install all packages and dependencies from the cloned project. To install the packages,
run:npm install

6. Open the Project

The requirements are ready, open the project in a browser and can build it.

ng serve

Then open http://localhost:4400/ in a browser to view the project.
To open the project in a browser, use Angular CLI.

$ ng serve -o

This command is used to build the app, and look for updates.
In the browser, we can see the Giphy-Replica website.