Angular - Setup Development Environment
This is a quick post to show how to setup an Angular development machine.
Follow the below steps to setup an Angular development environment and test it by downloading and running an example Angular application.
- Install Node.js and npm
- Install the Angular CLI
- Install the Git CLI
- Install Visual Studio Code
- Run an example Angular application (optional)
1. Install Node.js and npm
Node.js and npm are the runtime and command line tools required to build and run Angular applications.
Angular is built on top of Node.js, the Angular framework itself and the Angular CLI are both packages available on npm.
Download Node.js and npm from https://nodejs.org.
Install Node.js and npm by opening the downloaded installer and following the prompts.
Test that Node.js and npm were installed successfully by running the commands
node -v and
2. Install the Angular CLI
The Angular CLI is the de facto command line tool used to develop, build and test Angular applications. For more info see https://cli.angular.io.
Install the Angular CLI globally by running the command
npm i -g @angular/cli.
Test that the Angular CLI was installed successfully by running the command
3. Install the Git CLI
The Git CLI is the command line interface used for cloning and interacting with git repositories (e.g. projects on GitHub). For more info see https://git-scm.com/book.
Download the Git CLI from https://git-scm.com/downloads.
Install the Git CLI by opening the downloaded installer and following the prompts.
Test that the Git CLI was installed successfully by running the command
4. Download and Install Visual Studio Code (VS Code)
VS Code is a free code editor that runs on Windows, Mac and Linux.
Download VS Code from https://code.visualstudio.com/.
Install Visual Studio Code by opening the downloaded setup file and following the prompts.
Launch VS Code to test that it installed correctly.
5. Run an example Angular application (optional)
Your Angular development environment is now setup and ready to go!
This is an optional step to test out your new Angular dev environment. Follow the below steps to clone and run an example Angular application that includes user registration, login and user management features. Full details about the example app are available at Angular 9 - User Registration and Login Example & Tutorial.
- Clone the Angular project from GitHub with the command
git clone https://github.com/cornflourblue/angular-9-registration-login-example.git
- Navigate into the project root folder with the command
- Install the project npm package dependencies by running
- Start the app by running
ng serve --open, this will compile the Angular app and automatically launch it in a browser on the URL
Subscribe or Follow Me For Updates
Subscribe to my YouTube channel or follow me on Twitter, Facebook or GitHub to be notified when I post new content.
- Follow me on Twitter at https://twitter.com/jason_watmore
- Subscribe on YouTube at https://www.youtube.com/JasonWatmore
- Follow me on Facebook at https://www.facebook.com/JasonWatmoreBlog
- Follow me on GitHub at https://github.com/cornflourblue
- Feed formats available: RSS, Atom, JSON
Other than coding...
I'm currently attempting to travel around Australia by motorcycle with my wife Tina on a pair of Royal Enfield Himalayans. You can follow our adventures on YouTube, Instagram and Facebook.
- Subscribe on YouTube at https://www.youtube.com/TinaAndJason
- Follow us on Instagram at https://www.instagram.com/tinaandjason
- Follow us on Facebook at https://www.facebook.com/TinaAndJasonVlog
- Visit our website at https://tinaandjason.com.au
Need Some Angular Help?
Search fiverr to find help quickly from experienced Angular developers.