Hello World with Angular CLI
I am going to use Angular CLI to create the famous Hello World program. If you have installed the Angular CLI you can run the following command at your terminal to create
ng new helloworld
If you want to create the project with routing you can use the –routing flag
ng new helloworld --routing
When you open the created project with SublimeText you can see the following folder structure
You can see the
src folder in folder structure. That is the most important folder in your project. So this is where you are doing your development work
You can see the node_modules folder where you have the
node.js libraries you need for this project.
I am going to edit the
src\app\app.component.html file. You can delete all content of that file and add the following code.
<div style="text-align: center;"> <h1>Hello World</h1> </div>
Now you have to build the project using the following command at the command line. When you run the command the first time it will create a folder named build and place the files inside it. This is what you are going to upload to your production server.
Then you can run the server.
ng serve -o
This will run the server and open the browser