O'Reilly logo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Web Development with Angular 2 and Bootstrap

Video Description

Angular 2 is a game changer in the field of web development and enables you to efficiently architect large-scale and maintainable software. It has everything from a powerful view engine to an exceptional data binding framework and a design that embraces modern web development. Bootstrap allows users to quickly get started developing professional-looking responsive web applications. With both joining forces, we burst into modern web development with the very best of development and design.

This course demonstrates how to write dynamic, feature-rich Angular 2 applications with Bootstrap's responsive layouts and end-to-end testing techniques. We will set up our development environment with Angular 2 and ES6 with TypeScript. In Angular 2, everything is a component using TypeScript annotations. This course takes a component-centric approach, using them as the main point of discussion to help you learn the core concepts in Angular 2. You'll also get to grips with Bootstrap to create and design web applications that are elegantly styled with a responsive user interface.

If you have been building applications with 1.x versions of Angular, this course will also lay down the migration steps required to port your application to the newer version without disrupting the functionalities. Throughout this course, you will learn about the advanced features of Angular 2 such as components, views, event handlers, directives, dependency injection, services, routing, and data binding using Bootstrap styling. Finally, we'll end the course by implementing all that you've learned using Angular 2 web components and BootstrapUI.

By the end of the course, you’ll be ready to start building quick and efficient applications with a stunning interface that takes advantage of all the new features on offer from both Angular 2 and Bootstrap.

Table of Contents

  1. Chapter 1 : Getting Started with Angular 2.0
    1. The Course Overview 00:04:37
    2. Angular 2.0 Versus Angular 1.0 00:06:18
    3. Title1_3 00:06:22
    4. “Hello world” Application Using Angular 2.0 00:05:28
  2. Chapter 2 : Bootstrap Components and Styling
    1. Bootstrap Installation and Setup 00:05:16
    2. Bootstrap Fluid Responsive Layout with Grid System 00:08:54
    3. Bootstrap Responsive .navbar Header and .navbar Tabs 00:04:07
    4. Bootstrap Table, List, Form, and Glyph Icons and Responsive Utilities 00:06:57
    5. Bootstrap Carousel with Bootstrap Panel, Accordion, and Tab Menu 00:05:53
    6. Creating Demo Application Structure Using Bootstrap Component 00:05:00
  3. Chapter 3 : Understanding Typescript, Module Loaders, and Transpilers
    1. Writing an Application Using Typescript/ES5/ES6 00:05:07
    2. Typescript as a Language for Angular 2 00:04:52
    3. Understanding Universal Module Loader System JS 00:04:02
    4. Understanding webpack Module Loader 00:05:46
    5. Loaders and Transpilers using NPM Package Manager 00:03:20
    6. Typescript@ annotations for Components, Views, and Directives 00:04:45
    7. Hands-On on Our Application 00:04:46
  4. Chapter 4 : Understanding Features of ES6 ES2015
    1. Scope of Variables using let and const 00:05:01
    2. Template Literals and Default Arguments 00:04:14
    3. Spread Operator, Rest Parameter, and De-Structuring 00:05:40
    4. Arrow Function and Lexical This Binding 00:04:55
    5. ES6 Classes and Inheritance 00:05:09
    6. ES6 Modules Import and Export 00:05:34
    7. Asynchronous Processing with ES6 Native Promises 00:03:42
    8. Iterators and Generators in ES6 00:04:48
  5. Chapter 5 : Angular 2 Modules, Components, Templates, Metadata, and Architecture
    1. Angular 2 Application Architecture 00:07:52
    2. Angular Modules and Components 00:04:43
    3. Angular 2 Modules: @Ng Module 00:05:40
    4. Angular Components Nesting and Templates 00:05:43
    5. Angular Web Component and View Encapsulation 00:07:39
    6. Angular Component Metadata 00:06:38
    7. Angular Component Communication Input and Output 00:07:11
    8. Angular Component Building for Application 00:06:09
  6. Chapter 6 : Data Binding, Events, and pipes in Angular 2
    1. Angular 2 - Property binding 00:04:03
    2. DOM events and event binding 00:05:44
    3. Two-way data binding in Angular app 00:06:14
    4. Attribute directives and structural directives 00:06:56
    5. Pipes in Angular 2 00:06:19
    6. Angular component Lifecycle Hooks 00:05:46
    7. Application development with data binding, pipes, and directives 00:04:37
  7. Chapter 7 : The Dependency Injection and Inversion of Control Patterns
    1. Dependency Injection and Inversion of Control Patterns 00:04:53
    2. Injector and Providers @inject @injectable 00:04:24
    3. Building And Registering a Service 00:03:35
    4. Dependency Injection with Angular 2 Application 00:05:50
  8. Chapter 8 : Angular 2 Understanding Routing Basics, Observable Objects, and Immutable Objects
    1. Angular 2 Understanding Routing Basics, Observable Objects, and Immutable Objects 00:06:40
    2. Route Architecture with Route Linking and Redirection 00:04:10
    3. Angular 2.0 Understanding Child Routes and Route Param 00:06:25
    4. Securing Routes and Location Strategy 00:06:19
    5. Routing with Angular 2 Demo Application 00:06:29
  9. Chapter 9 : Understanding Angular 2 Forms
    1. Angular 2 Template Driven forms 00:05:06
    2. Template-driven forms with Validation 00:07:08
    3. Model-driven Forms or Reactive Forms 00:04:43
    4. Model-driven Forms with Validations 00:06:34
    5. Angular 2 Application Development with Forms 00:08:23
  10. Chapter 10 : Reactive Programming in Angular 2 RX Observables
    1. Angular 2.0 Understanding Reactive Functional Programming 00:08:09
    2. Observables and Reactive Extensions 00:06:07
    3. Observables with HTTP Service in Angular 2 00:08:11
    4. Observables with Angular Forms in Angular 2 00:06:29
    5. Observables and RX JS with Angular 2 Application 00:09:16