2. What are the fundamentals concepts of Angular 2?

 Angular 2 is a most popular framework for developing mobile apps. It is also for desktop as well mobile applications.

The Angular 2 is focusing on data-binding, extensible HTML and on application test-ability but it is still in design and prototyping stage.

Angular framework helps us to build client applications in HTML and JavaScript.
Angular 2 is so simpler, faster, modular and instrumented design.

Angular 2 targeting to modern browsers and it is developing using ES6 (The ES6 is called ECMAScript version 6). It also support to ECMAScript version 5(ES5).

You don’t worry about the versions of ECMAScript. The compiler manages to the versioning related problems.

All Angular 2 framework code is already being written in ECMAScript 6.

What Is Architecture Overview of Angular?
Angular framework is also utilized in the cross platform mobile development called IONIC and so it is not limited to web apps only.
The bootstrapping process creates the components listed in the bootstrap array and inserts each one into the browser (DOM).

With helps of below Aarchitecture 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
7. Dependency Injection

The basic building blocks of an Angular application are NgModules, which provide a compilation context for components.



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 follow 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 its 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));

The Angular 2 framework consists of several libraries, the some of them working as core and some are optional.

Advantages of Angular 2

1. The Angular 2 has better performance.
2. The Angular 2 has more powerful template system.
3. The Angular 2 provide simpler APIs, lazy loading and easier to application debugging.
4. The Angular 2 much more testable.
5. The Angular 2 provides to nested level components.
6. The Angular 2 execute run more than two programs at the same time.

The ECMAScript is a scripting language which is developed by Ecma International Org.
Currently ECMAScript available in multiple versions that are ES5 and ES6 and both of versions fully supported to Chrome, Firefox, Opera, Safari, and IE etc.

The Traceur is a JavaScript compiler. The Traceur compiler is very popular now days use to allow use to use the features from the future. This compiler is fully supported to ES5, ES6 and also to vNext. The main goal of Traceur compiler is to inform to design of new JavaScript features and wrote the programming code of new efficient and good manners.