Angular:

-Angular (formerly called Angular JS) is a typescript-based web application

framework
that supports full-stack development for building all types of web applications.
-It helps in creating reactive single page application (SPA) and is
completely based on the
concepts of components.Google owns.
-It design for web, desktop, mobile platforms.

Advantages of Angular:
-Custom and reusable components (Angular allows developers to create their
own components. These components can be reused)
-Code reduction and good maintainability
-Productivity and code consistency
-MVVM
-Lazy loading
-Creating Single page Application

Single Page Application:

A Single Page Application (SPA) in Angular is a web app that loads one main
HTML page and updates its content
dynamically as you use it, without reloading the entire page.

Lazy loading:
Lazy loading in Angular is a technique that delays the loading of a module or
component until it is needed.
This improves the application's performance by reducing the initial load time.

@NgModule:
Imports, Declaration, Providers and bootstrap.

Angular flow:
https://medium.com/front-end-weekly/how-does-an-angular-app-work-8bf5da4b8a1e
-Angular looks for the entry point of the application angular.json file. The
main property defines
the entry point of the application, which in the above case, is main.ts.
-The main.ts file creates a browser environment and loads the module.
-The compiler renders the index.html file.This file loads the root component
of the application (AppComponent)
by using the selector (<app-root>)

Component:
-A component is a basic building block of an Angular application. It controls
a portion
of the user interface and consists of a TypeScript class (for logic), an HTML
template (for the view),
and CSS styles (for appearance).
-We can create component with help of cli command ng g c component name

Module:
-A module is a container for a group of related components, services,
directives, and pipes.
It organizes an Angular application into cohesive blocks of functionality. Each
module is defined
using a TypeScript class decorated with @NgModule. The root module, typically
called AppModule,
bootstraps the application.
-We can create module with help of cli command ng g m module name
Data binding:
Data communicate between html and ts.
It has two types
-one way data binding:
-Communicates between html to ts (or) ts to html
-String Interpolation:
-Ts to html
-Convert the string at runtime
-Have to use {{}}
-Property Binding:
-Ts to html
-Strict to the type
-Have to use []
-Event Binding:
-HTML to Ts
-It will trigger if any mouses events occurs like keyup, click
like that.
-two way data binding:
-Communicates between html to ts and ts to html same time.
-Combination of Property and Event Binding.
-Import FormsModule.ngmodel goes inside the property and event binding
[(ngModel)]
Input Decorator:
-Transfer the data from parent to child component
-by using property binding
-@Input decorator we need to child
-we have to use input decorator we need 2 components with help of cli command
ng g c component name .
Output Decorator:
-Transfer the data from child to parent component
-by using event binding
-@Output decorator must have type of event emitter.
-emit() method to send data from child to parent
-$ Event to get a data

Service:
-Used to transfer a data from one component to many component
-Its mainly used for writing a business logic code
-we can create Service with help of cli command ng g s service name .
-we have to use service we need to inject @injectable component in
constructor
Directives:
Directives is from core features of angular. A directive is a class that can
modify the structure
or behavior of elements in the DOM.
-Structural(ngIf,ngFor)
-ngIf:
*ngIf to show or hide an element based on a boolean expression
-Component(html,css,js)
-Attribute(ngClass,ngStyle)
-ngClass:
ngClass to add or remove CSS classes based on a condition or a
variable.
-ngStyle:
ngStyle to change the style properties of an element based on a
condition or a variable.

Routes:
In Angular, routes are configurations that define which component should be
displayed for a given URL path.
They enable navigation within the application.
Routes are key to navigating and displaying different components based on URL
paths.
Pipes:
In Angular, pipes are tools used to transform data in the templates. They
take an input value, process it,
and return the transformed value for display.

formControl and formGroup:

formControl:
-Represents a single input field. Tracks the value and validation
status of the input field
formGroup:
-Represents a group of FormControls. It tracks the value and validation
status of the group of FormControl

HTTP Client Module:

-In Angular, the HttpClient module is a part of the @angular/common/http
package. It provides
a simplified and robust way to handle HTTP requests and responses
-The HttpClient module in Angular is a service that allows you to perform
HTTP requests, such
as GET, POST, PUT, DELETE, and more, to communicate with a server or API. It helps
in fetching data
from a backend, submitting data to a server, and handling HTTP operations easily
and efficiently.
-To use HttpClient in an Angular application, you typically import the
HttpClientModule in your
app module and then inject HttpClient into your services or components where you
need to perform HTTP operations.