Angular 7 application within 5 minutes.

Here I am showing a Angular 7 Hello World application within 2 minutes .
In this tutorial I will show you the demo application without brief descriptions . Although I am not describing about the application briefly but it is very interesting . You will just see how easily we can build the Angular 7 application just by few commands.
 
So before starting this tutorial you should have some basic things.

Your machine should have Node.Js and NPM installed .

So Lets get started .

Step-1 :
 Please open command prompt .

Step -2 :

Then please check the  node.js version by this below command

node -v
(node.js version should be 8.x or 10.x )
If this given version is not there then please update it below commands

npm install npm@latest -g

Step-3 :
Then please install Angular CLI. Please run the below commands.

npm install -g @angular/cli

 Step- 4 :
In this steps just create a work space to create a new angular project . To create the new work space please run the below commands.

ng new hello-world

Note :
Here the work space name is "hello-world" . You can give any name , it is just like a project folder or you can say the work space is a folder where the project files resides.

Step-5 :
Then after completion of the process we will now run our Angular 7 application . So to run the application we have to run the following command.

ng serve --open (or --o)

After this in browser you will see the below screen .



Comments

Post a Comment

Popular posts from this blog

The input is not a valid Base-64 string as it contains a non-base 64 character, more than two padding characters, or an illegal character among the padding characters.

I was trying to upload a file in client side and sending back the data from the client to Web API controller by angular service . Step 1 : I was doing it by. (It was bot the complete code )   function saveFile(file, cb) {     var readerObj = new FileReader();     readerObj .readAsDataURL(file);     readerObj .onload = function () {         savedFileDataAsBase64Format(readerObj .result, file.name,cb);     };     readerObj .onerror = function (error) {         alert("Error in uploading the file.");     }; Step 2 :     This is my Web api controller action method.        [HttpPost]         [Route("api/FileInput/SaveBase64FileData/{fileName}")]         public void SaveBase64FileData(string fileName, [FromBody]string fileData)         {     ...
Read more

The transaction is aborted or Failure while attempting to promote transaction.

This error is generally produced while you working on the  Linq query with Entity framework and there was some other system configurations like Visual studio 2015. Entity framework version 4. C# 4.5 But while I checked the Inner exception I got the following message  "There is already an open DataReader associated with this Command which must be closed first" So in my case there was some WCF services and from the WCF services I was extracting the data by Linq query . This was code  Code: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 using (TransactionScope scope = new TransactionScope()) { using (CentralisedData_DataDataContext db = new CentralisedData_DataDataContext()) { // Some code was there } db.SubmitChanges(); ...
Read more

Unable to load one or more breakpoints in Visual studio.

Image
Those who are working on Visual studio IDE they might have faced this type of error while opening any existing project . Sometimes by rebuild the solution or removing the break points the issue is get resolved .  So this problem/ issue is caused due to various reason but among those reason one of them is worked for me .  Here is my solutions. It worked for me . Please follow my steps. Step 1:    Please go to the physical folders/files of your solution . Just right click of the solution and from the options choose "Open Folder is File Explorer". Please check the attached Image. Please click on Image to view it properly Step 2:     Then you will see the files like this. Then please check the if the "Hide Items" checkbox is checked or not . If not checked please check that one. Then you will   see .vs folder .                               Please click on Im...
Read more