Angular is a component-based development framework for building scalable web applications, built on TypeScript:
1. component 2. routing, 3. forms management, 4. client-server communication, and more
Plateform uses for single-developer projects to enterprise-level applications.
Components: ng generate component first
Components are the building blocks that compose an application. A component includes a TypeScript class with a @Component() decorator, an HTML template, and styles. The @Component() decorator specifies the following Angular-specific information:
import { Component } from ‘@angular/core’;
@Component({
selector: ‘first’,
template: `
Hello World
This is my first component!
`
})
export class FirstComponent {
// The code in this class drives the component’s behavior.
}
Route:
Often, as a user navigates your application, you want to pass information from one component to another.
import { Router, ActivatedRoute, ParamMap } from ‘@angular/router
const routes: Routes = [
{ path: ‘first-component’, component: FirstComponent },
{ path: ”, redirectTo: ‘/first-component’, pathMatch: ‘full’ }, // redirect to `first-component`
{ path: ‘**’, component: PageNotFoundComponent }, // Wildcard route for a 404 page
];
Forms: Handling user input with forms is the cornerstone of applications.
1. Reactive form
import { Component } from ‘@angular/core’;
import { FormControl } from ‘@angular/forms’;
@Component({
selector: ‘app-reactive-favorite-color’,
template: `
Favorite Color:
`
})
export class FavoriteColorComponent {
favoriteColorControl = new FormControl(”);
}
2. Template-driven forms
import { Component } from ‘@angular/core’;
@Component({
selector: ‘app-template-favorite-color’,
template: `
Favorite Color:
`
})
export class FavoriteColorComponent {
favoriteColor = ”;
}
There are many more features are available in the Angular framework to build a PWA application.
Comments: