Angular 2 Web Development with TypeScript

Angular 2 Web Development with TypeScript

English | 2016 | MP4 | AVC 1280×720 | AAC 44KHz 2ch | 8 Hours | 1.55 GB

Leverage the power of TypeScript while authoring Angular 2 applications to take your web development skills to the next level

Angular 2 is a web development framework focused on writing component-based applications. TypeScript allows us to develop applications in a higher language than JavaScript, avoiding common mistakes and leveraging the future features of JavaScript. The two make a great combination, helping us write maintainable, clean web applications’ code using the tools of our choice.

This course will get your well on your way to learning Angular 2 and TypeScript together. You will study and practice how to create Angular 2 components in TypeScript. When we are done, you will be able to set up the environment and create a full-fledged application that can consume and publish server data and allow users to interact with it.

We start out by setting up an environment to develop a TypeScript-based Angular application. You will study the object-oriented features of TypeScript and then jump straight into the key concepts of Angular 2. We will create a new project setup in Visual Studio 2015 using the ASP.NET vNext web project. Next,we’ll cover the creation of database and web API controllers that handle data operations using Entity Framework and SQL Server. Finally, we will create components, communicate with web services, and learn how to guide users through our application with menus and forms.

This course will take your web development skills to a new level, enabling you to author Angular 2 applications from scratch.

What You Will Learn

  • Set up the development environment to get started with Angular 2 and Typescript
  • Grasp how to debug TypeScript in a browser
  • See how TypeScript solves “this” problem in JavaScript
  • Create web API web services in ASP.NET Core with Entity Framework 7 and SQL Server
  • Author the key building blocks of an Angular 2 application, injectable services, components, pipes, and directives
  • Find out how to validate user input using Angular 2 forms
  • Use the built-in Angular features to build list-based screens and study how to conditionally display data
  • Create a menu-based navigation system to guide the user through the application
  • Understand the basics of the Reactive Extensions framework to compose complex applications, flowing data, and events between components
Table of Contents

Introducing TypeScript
01. The Course Overview
02. Features and Benefits of TypeScript
03. Setting Up Our Environment

TypeScript Concepts
04. Built-in- Primitive Types
05. Your First Class
06. Creating Advanced Methods
07. Inheritances and Interfaces
08. Debugging TypeScript

Advanced TypeScript Concepts
09. Using Enumerations, Constants, and Block Scope
10. Working with Statics
11. Advanced Properties
12. Generics
13. Solving this Problem

Starting Angular 2 Application
14. Angular 2.0 Versus Angular 1.0p
15. Setting Up the New Project
16. Overview of Key Angular 2 Concepts
17. Creating the Shell Page
18. Creating the First Component

Creating Web API Web Services
19. Brief Overview of the Web API
20. Brief Overview of the Entity Framework
21. Creating Entity Framework Classes and Configuration
22. Creating API Controller to Handle CRUD Operations
23. Configuring Application Start-up

Authoring Angular Components
24. Creating a Service That Uses HTTP
25. Creating the Nested Components Which Use Services
26. Creating a Directive

Best Practices
28. Basics of Client-Side Routing
29. Configuring Routes
30. Nested Routes, Parameters, and Query Strings
31. Navigating with Directives and Code

Working with Forms
32. Form Types and Anatomy of an Angular Form
33. Form Data Binding
34. Simple Validation
35. Reactive Forms
36. Monitoring Changes and Using Notifications

Built-in Angular Building Blocks
37. Dynamic Styling
38. Displaying Lists of Data
39. Conditionally Displaying Data
40. Change Detection and Component Queries
41. Dynamic Component Loading

Working with Server Data and Next Steps
42. Reactive Extensions
43. Performing Insert, Update, and Delete Calls
44. Communicating Events between Components
45. Next Steps in Learning Angular 2