Angular is a TypeScript/JavaScript-based open-source cell and desktop web utility framework created by the Angular crew at Google. It is a full rewrite from the similar crew that constructed AngularJS. It is correctly suited to developing small to big scale cell and web features from scratch. On this data, we’ll learn how to arrange Angular on Ubuntu.
+
Situations
Updating System Packages
It is always actually helpful that you have the latest packages up to date on your server. To exchange the system packages, run:
sudo apt-get substitute && sudo apt-get enhance
How to Install Angular on Ubuntu Server in 5 Easy Steps
Step #1: Install Node.js
To begin with, you need to arrange Node.js on your server. Node.js is doubtless one of many hottest and beloved web utilized sciences at the moment. It is utilized by many web builders to improve the efficiency of the cell and desktop web utility.
If you already have Node.js put in on your server, it’s possible you’ll skip to the next step.
To place in Node.js, use the following set of directions to add node.js PPA in your Ubuntu server.
sudo apt arrange python-software-properties
curl -sL https://deb.nodesource.com/setup_12.x | sudo -E bash -
sudo apt arrange nodejs
Moreover, you will have to arrange npm, the Node.js bundle deal supervisor. You’re able to do that by typing:
sudo apt arrange npm
Run the following command and ensure to have effectively put in Node.js and NPM on your server.
node --version
npm --version
Step #2: Install Angular/CLI
On this step, we’ll arrange an Angular/CLI software program on our server. We’re going to arrange the Angular/CLI with the help of the Node Package deal deal Supervisor (NPM) that we put in earlier in the 1st step.
npm arrange -g @angular/cli
Whenever you hit enter, the latest mannequin of Angular/CLI will seemingly be put in on your server. For those who’re attempting to arrange one other mannequin of Angular/CLI, it’s possible you’ll specify the Angular mannequin. For example:
npm arrange -g @angular/[email protected] #Angular 6
npm arrange -g @angular/[email protected] #Angular 7
npm arrange -g @angular/[email protected] #Angular 8
npm arrange -g @angular/[email protected] #Angular 9
Throughout the command above -g
stands for worldwide. So whenever you embody -g
in your command, then the Angular/CLI will seemingly be put in globally. Which suggests, will in all probability be accessible to the all prospects and features present on your server.
+
Angular/CLI provides you a command ng
. It helps you to deal with command-line operations. So let’s study the put in mannequin of ng
on your server by typing:
ng --version
/ _ __ __ _ _ _| | __ _ _ __ / ___| | |_ _| / △ | '_ / _` | | | | |/ _` | '__| | | | | | | / ___ | | | | (_| | |_| | | (_| | | | |___| |___ | | /_/ __| |_|__, |__,_|_|__,_|_| ____|_____|___| |___/ Angular CLI: 9.0.5 Node: 12.16.1 OS: linux x64 Angular: ... Package deal deal Mannequin ------------------------------------------------------ @angular-devkit/architect 0.900.5 @angular-devkit/core 9.0.5 @angular-devkit/schematics 9.0.5 @schematics/angular 9.0.5 @schematics/substitute 0.900.5 rxjs 6.5.3
Checkout the official internet web page for CLI Overview and Command Reference.
Step #4: Creating new Angular Enterprise
Let’s create a model new Angular problem by the establish test-project
. To create that, run the following command:
ng new test-project
Output:
..... ...... added 1167 packages from 1048 contributors and audited 19053 packages in 72.14s 23 packages are looking for funding run `npm fund` for particulars found 0 vulnerabilities Effectively initialized git.
Step #5: Working Angular Utility
Now navigate to the test-project
and run the equipment using ng serve
command:
+
cd test-project
ng serve
Whenever you run the command, your Angular utility will get launched on the default port 4200
.http://localhost:4200
You can also change the host and port on your Angular utility by providing –host
and –port
command line arguments.
ng serve --host 0.0.0.0 --port 8080
The IP sort out 0.0.0.0
listens on all interfaces and may very well be accessed publicly.
For additional data related to the ng
software program, run the following command.
ng help
You might also like:
Conclusion
You should have effectively put in an Angular/CLI on Ubuntu and created a check out utility.
I hope you will uncover this tutorial on how to arrange Angular on Ubuntu useful. Do share your views inside the comment half beneath.