Recently got an opportunity to work on angular project.With no previous experience in angular, I had some catch up to do in terms of web development.So here is a small blog post.
What is Angular ?
Framework to build client side applications.
Why would you use Angular?
Vanilla JQuery code gets harder to maintain,harder to test.
And like all most of the frameworks Junction, Angular provides:
Angular gave our applications clean structure.
Includes lots of Reusable code
Makes the application more testable
Also easier to co-relate to learn from Java perspective because of 2 features
gives our plain JS applications some structure & enables static typing.
3 Handles Server-side Rendering
We don’t save the data in client. We save it in server. Example: Data is wiped clean when user creates form.
Frontend Backend –> Backend (Presentation logic) Data APIs Business
Let’s get familiar with some terms in Angular first. Below is small comparison to co relate between Java and angular.
|Dependency management||Maven||npm(node package manager )|
|Library Repo||Maven Central||npmjs.org|
|Programming language||Java||Typescript ,HTML|
|Code style checks||Sonar||eslint|
|Browser End-to-end testing||Webdriver||Protractor (Layer on top of selenium)|
Like java has a main file. Similarly in angular, there is a
main.ts file which is the starting point of our application.It is present in bootstrapmodule(Appmodule).
Angular uses a tool called
webpack which is a static module bundler.It takes all our HTML,CSS and JS files and bundles them into a single file which is loaded by the browser. It bundles application source code into convenient chunks, to improve performance and load times.
Hot Module replacement
Hot Module Replacement (HMR) is a feature of webpack that allows developers to update code changes without the need for a full page reload. When a code change is made, HMR only updates the module that has been modified, which means the application can continue running while the changes are applied.