Understand Angular In Easy language.

In this blog, we will Understand angular in easy language and after reading you will be able to understand the basic things about angular and you will be able to start running a default angular application on your localhost at the end.

Introduction

Angular is nothing but a Frontend MVC Framework that is used to design frontend for a web application or a desktop application for a desktop application we have to do some changes in the package.json file to build the application as a desktop application but for now, will be focusing on a web application because of testing it in a localhost environment using ng serve or ng start command.

So what knowledge do we have to understand Angular at an intermediate level or we can say that at a Professional level, to understand that lets us understand the things that Angular uses to complete its application up and running?
Angular basically comprises too many things which are not required at the start to build an application but it may be required if you want a deep understanding and one thing I need to mention here is that in the software world or in the programming world where we are building something in a team or building an application individually we may not require whole knowledge of a particular technology or a framework only fundamentals are needed.

To clear your confusion let’s take an example of building a Calculator desktop application using angular So for that our first step will be to acquire the required things like addition, multiplication, etc operation is done and after that will start implementing all the operations using function and calling this function whenever will receive a request for addition, subtraction, etc.

So like the Calculator application, the process is somewhat similar in many applications or we can follow any standard method for doing that like software development life-cycle.

So to understand Angular there is something we should know to initialize our application in angular like Nodejs and npm packages and not a complete understanding is required for these two processes, Let us understand what is nodejs and npm.
Basically, At the start, we are using Javascript only in the front end for form validation but due to its core functionality, Nodejs came in to picture for running it into the backend environment for development purposes. Hence, we can say that Nodejs is a Javascript runtime environment for Backend Development.
After understanding nodejs and installing it into our system we cannot start building applications without npm because npm is used to install the external library into our project if we want to add bootstrap for designing purposes so we need the npm install bootstrap command to add those files into our project. Hence NPM stands for node package manager and it is used to install packages into our projects just by executing the npm install package-name command and that’s it.

Getting Started With Angular Environment Setup.

1. Getting Started With Angular Environment Setup:-
   -The basic requirement for angular is to have an updated version of nodejs and npm because we will be using them for downloading predefined packages for angular.
   -To run angular we would use Virtual Studio Code which is a great IDE for development related to any application development because It’s easy to understand and also it is widely used in the IT world for the development Purposes and the virtual studio also comes with a predefined extension which gives us some features to work with it like we want to have all the braces are arranged automatically so we need to install the pretty extension for that.
2. The next comes is to open your favorite file with virtual studio and run the command prompt in it and check the version of nodejs by entering “node -v” and for the npm version enter “npm -v” and if the version is updated one then you can move forward with below steps otherwise you can download the latest one.
   
   • step1:- To install angular with the latest version we need to use the below command:-
     –npm install -g @angular/cli@latest.
     -This command will set up an angular development environment where we can write codes and run them accordingly.
   • step2: After initiating all the files we have to create a new application/project file using the below command with a no-strict keyword for our project/application which we are going to develop from the start and the no-strict keyword is optional.
     –ng new my-first-app --no-strict
     -This command will install all the important files related to the Angular app in one go from which we can start our development process.
     –note: to install the bootstrap CSS framework we need to run “npm install –save bootstrap@3” where 3 is the bootstrap version. after this we need add bootstrap CSS location (i.e”node_modules/bootstrap/dist/CSS/bootstrap.min.) in style under angular.json file
   • step3:- Go inside that my-first-app using “cd ./my-first-app” command.
   • step4:- To start your application we use the “ng serve” command which runs the default angular app at the “localhost:4200”. Note this localhost address may vary from system to system.