AngularHow to?

How to install angular and start a new project in windows

Hello developers,Installing Angular and starting a new project on Windows is a relatively straightforward process. Here is a step-by-step guide to get you started:

Step 1(Getting things ready):

To install you need node.js got installed in your local machine if you don’t know how to do that follow the below steps:

Download and install the latest version of node.js from the official website.

Downloading node.js with picture
  • Click on the recommended version of Node.js for your project and download.
  • Run the installer file that you have downloaded.
  • After installation, follow the steps below:
  • Click next and accept the terms and conditions, then choose the destination of the folder.
  • If you need native tools you can check and click next otherwise skip to next.
  • Now node.js has successfully installed in your computer.
  • : you can check if Node.js is installed correctly, by opening a terminal or command prompt and typing the following command
node -v

it shows the version of node.js that you have installed in your computer.

Step 2 (Installing Angular):

After installing Node.js, you can install the Angular Command Line Interface (CLI) by running the following command in your terminal or command prompt:

npm install -g @angular/cli

If you need to install the specific version of an angular framework you can try

npm install -g @angular/cli@version

For example if you want angular version 12. 1.3 you can give command like this

npm install -g @angular/cli@12.1.3

Step 3 (Configuring angular framework):

After installation, you can check if Angular CLI is installed correctly or not by opening a terminal or command prompt and typing the following command.

ng v 
  • Now you can create a new folder and start your project by running the following command in your terminal or cmd.
  • To create a new app follow the below command :
ng new my-app

you can prefer what name you want to give for your app as ( ng new appname ).

  • Then choose yes for routing and choose your styling option like css , scss , sass and so.

Install nodemodules using the command “npm i”. Which have inbuilt packages for your project.If the npm package is not installed please check the node version is supported or not.

Check whether the node modules is installed or not in your project.

Bonus (Installing Bootstrap in angular):

Next ,Install Bootstrap in your Angular project to add some styles to your code.Using the command “npm i bootstrap –save” you can install bootstrap for your styling.

npm i bootstrap --save

Once you have installed bootstrap, you can check if bootstrap is correctly installed or not in your “package.json”.

You have to import some styles and script to your project. Now import the following style and script on your “angular.json” followed below:

	"styles": [
              "node_modules/bootstrap/dist/css/bootstrap.min.css",
              "src/styles.css"
            ],
            "scripts": [
              "node_modules/bootstrap/dist/js/bootstrap.min.js"

Run your app with Angular CLI “ng s”

ng s --o

Instead use “ng s –o” which directly redirects you to your browser.

Conclusion:

Thats all for today hope you guys enjoy the blog learned something new see you on another blog.

Spaceofdevops

Hello space of devops is a free devlopers platform to develop their knowledge.

Leave a Reply

Your email address will not be published. Required fields are marked *

Back to top button