What Is Angular?
Angular is the most popular web development framework for developing mobile apps as well as desktop applications.
The angular framework is also utilized in the cross-platform mobile development called IONIC and so it is not limited to web apps only.
Angular is an open source framework written and maintained by the angular team at Google and the Father of Angular is Misko Hevery.
The bootstrapping process creates the components listed in the bootstrap array and inserts each one into the browser (DOM).
What Is Architecture Overview of Angular?
What Is Architecture Overview of Angular?
Angular is a platform and framework for building client
applications in HTML and TypeScript. Angular is written in TypeScript. It
implements core and optional functionality as a set of TypeScript libraries that
you import into your apps.
With the help of the above architecture overview, you
can identify the seven main building blocks of an Angular Application.
1. Component
2. Templates
3. Metadata
4. Data
Binding
5. Directives
6. Services
The basic building blocks of an Angular
application is NgModules, which provide a compilation context for components.
The angular app is defined by a set of NgModules and
it always has at least a root module that enables bootstrapping, and many more
feature modules.
1. Components
define Template views
2. Components
use services
The Angular Module (NgModules) helps us to organize an application into connected blocks of functionality.
The NgModule properties for the minimum “AppModule” generated by the CLI which are followed as -
ü Declarations — Use to declare the application components.
ü Imports —Every application must import BrowserModule to run the app in a browser.
ü Providers — There are none to start.
ü Bootstrap — This is a root AppComponent that Angular creates and inserts into the index.html host web page.
app.module.ts -
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { LoginComponent } from './login/login.component';
import { SignupComponent } from './signup/signup.component';
@NgModule({
declarations: [
AppComponent,
LoginComponent,
SignupComponent
],
imports: [
BrowserModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
By default Bootstrap file is created in the folder “src/main.ts” and “main.ts” file is very stable. Once you have set it up, you may never change it again and it looks like -
import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app/app.module';
import { environment } from './environments/environment';
if (environment.production) {
enableProdMode();
}
platformBrowserDynamic().bootstrapModule(AppModule)
.catch(err => console.log(err));
|
Anil Singh is an author, tech blogger, and software programmer. Book writing, tech blogging is something do extra and Anil love doing it. For more detail, kindly refer to this link..
|
