With Angular 7 you can build modern Single-Page-Application (SPA) for the web, mobile, or desktop.
In this article, we take a look how to build and run a simple Angular application with Angular 7. For building our application we will use official Angular CLI tool to accelerate development. This short tutorial is targeted towards beginners new to Angular.
Before you begin, you need to have Node.js version 8.x or 10.x and above and an npm package manager installed.
To install Node.js, go to nodejs.org.
To verify that you have the npm client installed, run npm -v command.
node -v v10.15.0
npm -v 6.8.0
Once you will have installed node and npm you have to install Angular Command Line Interface which you will use to create an Angular project. Install the Angular CLI globally.
To install the CLI using npm run following command:
npm install -g @angular/cli
Now you will use angular cli tool to create your first angular application. You can create application by running following command:
ng new my-first-app
During application creation process you will be asked about routing and preferred style format, accept the defaults. When this is done, you can now see a new folder called my-first-app. After Angular CLI installs the necessary Angular npm packages and other dependencies you can start you first application.
To run the application on a development server, run the commands:
cd my-first-app ng serve --open
The ng serve command start the server and automatically open your browser to http://localhost:4200/ (due to –open flag). You will see your app in browser.
To edit your application open ./src/app/app.component.ts and edit title property. After saving file your application will be rebuild and browser will reloads automatically with the new title.