Table of Contents
Angular is an open-source Web Application Framework developed and maintained by the Angular team at Google, It is one of the most popular frameworks at the current time. Angular is used to develop rich web applications, it enhances the performance of applications, easy to develop and test. Applications developed using Angular can be reused for other platforms. The same set of code will work for Web, Mobile, and Native Desktop / Mobile applications.
Now Angular JS’s first version is written in JavaScript and is mainly used to develop Single Page Applications. It is not a mobile-friendly framework. When ember.js and ReactJS introduce better features and performance to the development community. The angular team decided to rewrite the entire Angular again in TypeScript instead of upgrading the existing framework.
Let’s check the comparison between Angular Js and Angular, which will help you to select to learn first and use better options for your projects.
| Angular Js ( 1. x ) | Angular ( 2. x ) | |
| Language | JavaScript | TypeScript |
| Architecture | Angular Js used MVC ( Module – View – Control ) architecture | Angular used Component-based architecture |
| Rendering | Client Side | Server Side |
| Template | HTML | TypeScript |
| Structure | Less manageable compare to Angular | Better manageable, Easy to create and maintain large-size applications. |
| Tool-chain | Low | High |
| Dependency Injection (DI) | Does Not User DI | Hierarchical Dependency Injection system used. |
| Performance | Compare to Angular is a slow one | Fast |
| Reusable | Low | Higher |
| Command Line Interface | Don’t have its own CLI | CLI support |
| Mobile Support | Support from third-party libraries | Native Mobile Support |
Angular Material
Angular Material is a UI component library developed by Google in 2014. It is reusable and well-tested and help developer develops high-quality, responsive, interactive and device-oriented User Interface.
Setup Simple Angular Project
Angular CLI is a command line interface that helps a developer initialize, develop and maintain Angular applications. Install CLI using an npm package manager. For more details about versions, please visit and see the Release section on GitHub – https://github.com/angular/angular-cli/releases
npm install -g @angular/cliWe also need to install Node.js to develop Angular Apps. Angular is an updated framework written in TypeScript which does not understand browsers. So we required npm ( Node Package Manager ) and node. If the developer using Visual Studio then it comes with Node.js plugins.
Now we will use Angular CLI as the easiest way to generate application and libraries code which will help in development, testing and deployment
$ sudo npm install -g @angular/cli
$ ng version - To Test @angular/cli installation statusUser ng new command to create Angular Application and accept default setting which asks configuration. Angular CLI install the necessary packages and dependency. myAngularApp App is created
$ ng new myAngularAppNow go to the application folder ( myAngularApp ) and launch the server by using CLI Command. ng serve command build the applications and start a web server on port 4200.
$ ng serve --openWe have set up a basic Angular Project. We will discuss more Angular projects in detail like folder structure, development and maintenance in our next blog.
