Setting Up Your First Angular 2 Project
Setting Up Your First Angular 2 Project
In this post, we cover the basics of setting up a project in Angular, from installing the CLI to running the ng serve command.
Join the DZone community and get the full member experience.
Join For FreeLearn how Crafter’s Git-based content management system is reinventing modern digital experiences.
Prerequisites for an Angular 2 Project
1. Node 4.x.x or higher
2. Npm 3.x.x or higher
If you have already installed the above, verify that you are running at least node 4.x.x and npm 3.x.x or higher by running node -v and npm -v (check the version you are running) in a terminal/console window.
Setting Up a New Angular 2 Project
Step 1. Set Up the Development Environment.
For building an Angular 2 project, you need to have the Angular CLI (command line interface).
The Angular 2 CLI makes it easy to create an application via the terminal.
Without the Angular CLI, you cannot create any component or service via the terminal.
Install the Angular-CLI globally.
npm install -g angular-cli Step 2. Create a New Project
Open a terminal window.
Generate a new project and skeleton application by running the following commands:
ng new my_first_angular_appThis will create a skeleton Angular 2 application. You can check the default folder structure.
By default, it will have a styles.css file in which you can write your styles.
But if you want to create an Angular project using SASS, you need to run the following command:
ng new my_first_angular_app --style=scssStep 3: Serve the Application
Go to the project directory and install node modules in your project directory. Then launch the server using the ng serve command.
cd my_first_angular_app Once you are inside your project app folder, run the following code:
ng serveThe ng serve command launches the server, watches our files, and rebuilds the app as you make changes to the files.
Open a browser on http://localhost:4200/; the app greets us with a message:
Our app works!
I hope this helps!
Crafter CMS is a modern Git-based platform for building innovative websites and content-rich digital experiences. Download this white paper now.
Like This Article? Read More From DZone
Opinions expressed by DZone contributors are their own.
{{ parent.title || parent.header.title}}
{{ parent.tldr }}
{{ parent.linkDescription }}
{{ parent.urlSource.name }}