Constructing a User Interface with Angular

Constructing a User Interface with Angular

English | MP4 | AVC 1280×720 | AAC 44KHz 2ch | 4h 35m | 727 MB

The user interface is the single most important part of your application, because to users, it IS the application. Nothing else matters. In this course, you learn how to deliver an easy, effective, efficient, and maintainable UI using Angular.

At the core of any Angular project is how the user interacts with the application. In this course, Constructing a User Interface with Angular, you’ll learn how to deliver an easy, effective, efficient, and maintainable UI. First, you’ll learn the different elements involved in an Angular UI. Next, you’ll explore how to structure and develop an interface using those elements. Finally, you’ll discover how to do everything you need while maintaining performance and a loosely coupled architecture. When you’re finished with this course, you’ll have the knowledge and skills to help you as you move forward to Angular Awesomeness!

Table of Contents

Course Overview
1 Course Overview

Getting Started
2 Getting Started

Wrap up Use Cases and Final Thoughts
3 Introduction
4 Error Handling Scenarios
5 Personalization Scenarios
6 UI Goodness Scenarios

Understanding the Available Building Blocks
7 Introduction
8 Components
9 @Input Decorator on a Property Setter
10 Checking for @Output Property Subscribers
11 Manipulating the UI with Directives
12 Altering Data Presentation with Pipes
13 Wrap Up

Querying the UI
14 Introduction
15 Templates and TemplateRefs
16 Wrap Up
17 Querying the UI via ViewChild(ren) and ContentChild(ren)
18 TempateRef Selectors
19 ViewContainerRefs
20 HTMLElement as ElementRefs
21 ElementRef Selector Options – Read
22 ElementRef Selector Options – Descendants
23 ElementRef via Dependency Injection
24 QueryLists for Collections of UI Items

Manipulating the UI
25 Introduction
26 View Encapsulation-
27 Wrap Up
28 Shadow Piercing – Bypassing Shadow DOM
29 Building Custom Pipes – Dynamic Display Manipulation
30 Directive Selectors – More Than Just Attributes
31 Host Binding – Manipulating a Parent from a Child
32 Host Listening – Responding to a Parent From a Child
33 NativeElement and Renderer2 are NOT Bad
34 Getting and Using NativeElement Properly
35 JQuery as an Angular Anti-pattern

Creating a Dynamic UI
36 Introduction
37 Using Built-in Content Projection
38 Creating Dynamic Components Declaratively with ngComponentOutlet
39 Creating Dynamic Components Programmatically with ComponentFactoryResolver
40 Wrapping Content in ngContainer
41 Building Templates with ngTemplate
42 ngIf-Else with ngTemplate
43 Rendering Content with ngTemplateOutlet
44 Dynamic Content with ngTemplateOutletContext
45 Component Inheritance
46 Dynamic Component Creation
47 Overview of the Widget Framework

Keeping Your DOM Clean
48 Introduction
49 Component Attribute Selectors
50 ngIf to Minimize DOM Size
51 ngSwitch Bloat
52 Shadow DOM
53 Wrap Up

Improving Performance of the UI
54 Introduction
55 A Better UI for Async Loading
56 Pipes and Performance
57 A Better ngFor
58 Instant Caching with Memoizing
59 A First Look at Angular’s Lifecycle Hooks
60 Working with Angular’s Lifecycle Hooks
61 Wrap Up

Security in the Angular UI
62 Introduction
63 Understanding the Threat
64 Default Security
65 Bypassing the Default Security
66 Wrap Up

Bringing It All Together Building Dynamic Forms
67 Introduction _ What We’re Building
68 Defining the Form in Metadata
69 Generating the Field UI
70 Loading and Saving Data
71 Validating the Field Data
72 Wrap Up