Post
Ask Question

How To Create Simple Angular Project Using Node.js And VS Code

How to create a simple Angular project

 
Angular - Angular is an open-source JavaScript Framework. Angular is used to develop a web application.
 
Angular can be used freely, changed and shared by anyone. Angular is an excellent framework for building single-page applications and line of business applications.
 
Node.js - Node.js is  open-source, cross-platform and provides a run-time environment for developing Server-side and networking applications. Node.js application is written in JavaScript and can run within the Node.js. Node.js also provides a rich library of various javascript moduless which simplifies the development of web applications using Node.js.
 
VS Code - VS Code is a source-code editor developed by Microsoft for Wnidows, Linux, and IOS. VS Code supports many languages. VS Code has intuitive keyboard shortcuts and easy customization.
 
Step 1 - Download Node.js from the link (“https://nodejs.org/en/download/”) and then install Node.js.
 
Step 2 - Download VS Code from this link (“https://code.visualstudio.com/insiders/ ”) and install.
 
Step 3 - Check the version of Node, to run command on cmd.
  1. node -v  
Step 4 - Open VS Code in your system and run a command to install npm “install npm -2 @angular/cli” Then wait and install the complete package (Library) from the service.
 
Step 5:- After completing the installation, open VS Code in your system and select a folder to click on the Folder then open this folder in VS Code and then
 
 
 
Step 6:- Open a new terminal and run the command “ ng new projectname ( ng new demo )”
  1. ng new demo
and enter
 
 
 
Step 7- After running “ ng new demo ” it will show an option to add the routing file on your project. Give your answer  as Y/N ( Y stands for yes and N stand for no) and then enter
 
 
 
Step 8 - After selecting the routing it will show an option to select the stylesheet format.
 
 
 
Step 9 - After selecting the stylesheet format, it will take 0-10 minutes to create project.  Because it downloads the package from the server it takes more time. 
 
 
 
When it is completed it will be shown like this
 
 
 
Step 10 - Now go to the File option and select open folder then select your folder where you want to store your project and then select project and open in vs code. And open new terminal and write command 
  1. ng serve  
 
 
Step 11 - Now run your project, open Chrome browser, and type localhost:4200, and press enter key
 
 
 
Step 12- There is a second way to compile and run your project direct.  Run command in terminal 
  1. ng serve -o  
By this command you don’t need to open the browser, your project will run directly.


Similar Articles