7
Angular 5 Angular 5 www.sevenmentor.com

Angular 5 CCSA Checkpoint - Sevenmentor Pvt. Ltd · Getting Started with Angular 5 Course Introduction What is Angular Angular vs Angular 2 vs Angular 4 vs Angular 5 LI Deep Dive

  • Upload
    others

  • View
    19

  • Download
    0

Embed Size (px)

Citation preview

Page 1: Angular 5 CCSA Checkpoint - Sevenmentor Pvt. Ltd · Getting Started with Angular 5 Course Introduction What is Angular Angular vs Angular 2 vs Angular 4 vs Angular 5 LI Deep Dive

CCSACheckpoint

CCSA Checkpoint

www.sevenmentor.com

Angular 5Angular 5

www.sevenmentor.com

Page 2: Angular 5 CCSA Checkpoint - Sevenmentor Pvt. Ltd · Getting Started with Angular 5 Course Introduction What is Angular Angular vs Angular 2 vs Angular 4 vs Angular 5 LI Deep Dive

Getting Started with Angular 5

Course IntroductionWhat is AngularAngular vs Angular 2 vs Angular 4 vs Angular 5LI Deep DiveProject Setup and First AppThe course StructureWhat is TypeScriptA basic setup of Bootstrap for Styling

Databinding & Directive Concepts

Module IntroductionWhat is DatabindingString InterpolationProperty BindingProperty Binding vs String InterpolationEvent BindingBindable Properties and EventsPassing and Using Data using Event BindingTwo-Way BindingForms Module and Two Way BindingUnderstanding DirectivesUsing ngIf and Else ConditionsUsing ngStyle for Styling Angular AppApplying css Class dynamically with ngClassDisplaying Lists using ngFor

The Basics of Angular 5

Module IntroductionHow an Angular App gets loaded and startedComponentsCreating new ComponentUnderstanding the role of AppModule and Component DeclarationUnderstanding Component TemplatesUnderstanding Component StylesUnderstanding Component Selector

www.sevenmentor.com

Page 3: Angular 5 CCSA Checkpoint - Sevenmentor Pvt. Ltd · Getting Started with Angular 5 Course Introduction What is Angular Angular vs Angular 2 vs Angular 4 vs Angular 5 LI Deep Dive

Advanced Component and Databinding

Dividing the App into multiple componentsProperty and Event Binding deep diveBinding to custom propertiesBinding to custom eventsView EncapsulationUnderstanding Local Reference inside TemplatesGetting Access to the templates using @ViewChild.Exploring Component Life CycleLife cycle hooks deep diveModule Introduction

Advance Directive Concepts

Creating a basic custom attribute directiveExploring Renderer to create a DirectiveUnderstanding HostListener and HostBindingBinding to Directive’s PropertiesBuilding Structural DirectivesExploring ngSwitch

Understanding Services and Implementing Dependency Injection

Module IntroductionWhy Services are requiredCreating a ServiceInjecting the service into componentsUnderstanding Dependency Hierarchical InjectorInjecting a Service into other services

www.sevenmentor.com

Page 4: Angular 5 CCSA Checkpoint - Sevenmentor Pvt. Ltd · Getting Started with Angular 5 Course Introduction What is Angular Angular vs Angular 2 vs Angular 4 vs Angular 5 LI Deep Dive

Routing in Angular 5

Module IntroductionUnderstanding the need of a RouterSetting Up and implementing RoutesNavigating to Router LinksUnderstanding Router PathsStyling Active Router LinksUnderstanding Navigation PathsStyling Router LinksNavigating DynamicallyUsing Relative PathsPassing Parameters to Routes and fetching route parametersFetching route parameters in a Reactive WayPassing query parameters and fragmentsUnderstanding Nested RoutesRedirecting and Wildcard routesRedirection Path MatchingOutsourcing the Route ConfigurationIntroduction to GuardsUnderstanding can activateUnderstanding canActivateChildUnderstanding can deactivatePassing Static Data to a RouteUnderstanding Resolve GuardExploring Location Strategies

Observables in Angular 5

Module IntroductionUnderstanding built-in Angular ObservableCreating ObservablesUsing a Custom observableUnsubscribeUsing Subjects to pass and Listen to DataUnderstanding Observable Operators

www.sevenmentor.com

Page 5: Angular 5 CCSA Checkpoint - Sevenmentor Pvt. Ltd · Getting Started with Angular 5 Course Introduction What is Angular Angular vs Angular 2 vs Angular 4 vs Angular 5 LI Deep Dive

Forms in Angular 5

Module IntroductionNeed of Angular’s helpTemplate Driven vs Reactive Approach

Template Driven Approach

TD: Creating the Form and Registering the controlsTD: Submitting and Using the formTD: Understanding Form’s StateTD: Accessing Form using @ViewChildTD: Adding Validation to user inputTD: Built-in Validator and using HTML 5 ValidationTD: Understanding Form StateTD: Outputting Validation Error MessagesTD: Set Default Value with ngModel Property BindingTD: Using ngModel and two-way bindingTD: Grouping Form ControlsTD: Using Form Data

Reactive Form Approach

Reactive: Creating a Form in CodeReactive: Submitting the formReactive: Adding ValidationReactive: Getting Access to ControlsReactive: Grouping ControlsReactive: FormArrayReactive: Custom ValidatorsReactive: Exploring Error CodesReactive: Custom Async Validator

www.sevenmentor.com

Page 6: Angular 5 CCSA Checkpoint - Sevenmentor Pvt. Ltd · Getting Started with Angular 5 Course Introduction What is Angular Angular vs Angular 2 vs Angular 4 vs Angular 5 LI Deep Dive

Exploring Pipes in Angular 5

Module IntroductionUsing PipesParameterizing PipesChaining Multiple PipesCreating a custom PipePure & Impure PipesUnderstanding the Async Pipe

Making HTTP Requests in Angular 5

Introduction & how HTTP request works in SPAsSending POST RequestAdjusting request headersSending GET requestsSending PUT RequestsResponse with observable operatorsCatching HTTP errorsUsing the async pipe with HTTP Requests

Authentication & Route Protection in Angular Apps

Module IntroductionHow Authentication works in SPAsIntroduction to JWTCreating a Signup Page and RouteSetting up Firebase SDKSigning users upSigning users inToken introductionSending a tokenRoute protection and redirection example.

www.sevenmentor.com

Page 7: Angular 5 CCSA Checkpoint - Sevenmentor Pvt. Ltd · Getting Started with Angular 5 Course Introduction What is Angular Angular vs Angular 2 vs Angular 4 vs Angular 5 LI Deep Dive

Typescript Introduction

Module IntroductionUsing typesClassesInterfaceGenericsWrap up & ModulesDeep dive into typescripts

www.sevenmentor.com