Angular 2 Crash Course with TypeScript
4.1 (617 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
17,416 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Angular 2 Crash Course with TypeScript to your Wishlist.

Add to Wishlist

Angular 2 Crash Course with TypeScript

Get in-depth knowledge of Angular 2 and TypeScript with this crash course for all skill levels.
4.1 (617 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
17,416 students enrolled
Last updated 7/2017
English
English [Auto-generated]
Current price: $10 Original price: $100 Discount: 90% off
5 hours left at this price!
30-Day Money-Back Guarantee
Includes:
  • 4 hours on-demand video
  • 2 Articles
  • 2 Supplemental Resources
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • Code an Angular2 Project with an Online IDE
  • Learn to code with TypeScript and use it's data typing features
  • Understand and use Angular2's Component paradigm
  • Use Angular2's powerful data binding features
  • Use Angular2's improved Pipes to transform displayed data
  • Implement Interfaces in Angular2
  • Compose Components with Angular2's Component Nesting capabilities
  • Implement Services in an Angular2 application
  • Use Dependency Injection to keep an Angular2 application lean
  • Integrate with Web Services using Reactive Extension's Observables
  • Implement Routing in Angular2
  • Understand what Angular2 is, and how it can help you as a developer ... and much, much more!
View Curriculum
Requirements
  • Before taking this course, a student should ideally (but not absolutely) have some experience in: Creating web UI’s with normal Javascript tools (i.e. jQuery, Bootstrap, ASP.NET, AngularJS, etc.) Programming with a common object-oriented or scripting language (i.e. Java, C#, Python, PHP, etc.) JavaScript development of complete client-side solutions. ANGULAR1 EXPERIENCE IS NOT REQUIRED!!!
Description

There’s no way around it. If you want to gain a competitive edge in UI/UX design, web development, or anything to do with mobile and desktop web apps, then you need to know Angular JS. Better yet, you need to know Angular 2, the latest version. This Angular 2 crash course will refresh your memory and get you updated on the essentials of the latest version. And if you’re just getting started with Angular JS, don’t worry = this is the perfect introduction too.

Get Up to Speed with Angular 2

  • Understand Angular 2 and how it can help you as a developer
  • Code an Angular 2 project with an online IDE
  • Get to grips with Angular 2’s many powerful features
  • Improve your UI/UX design and development skills
  • Discover what’s new in the latest version of Angular

Upgrade your Programming Skills

With 71 lectures and 5 hours of content, this Angular 2 online course will give you a thorough understanding of how Angular 2 solutions are designed, administered, and developed. If you’re a web, mobile or service app developer, architect, UI designer, tester or administrator, or if you just want to know how to get Angular 2 projects up and running, then this is the course for you.

You don’t need any Angular 1 or UI experience to take this course, although if you’re familiar with creating web UIs with normal JavaScript tools (jQuery, Bootstrap, etc.), or object-oriented scripting languages like Java, C#, Python etc., you’ll already have a head start.

The course will begin with an introduction to TypeScript, the Cloud9 IDE and using Angular 2 modules. Then you’ll get stuck into Angular 2’s components, building a UI and binding your data. After that things get a little more challenging with a breakdown of advanced component concepts and component composition. From there you’ll jump into services, web services, and routing before setting up Angular 2 from scratch.

By the end of this course you’ll be able to set up and get going on your own Angular 2 projects quickly, easily, and efficiently.

About Angular JS

Angular is a development platform for building mobile and desktop web applications. It’s a structural framework that allows you to use HTML as your template language, and is JavaScript based. It has many high-power features like data binding and dependency injection that eliminates huge chunks of coding for the developer, making the process much more efficient and streamlined.  It’s mostly maintained by Google and a wide network of users.  Angular 2 is the latest version of the framework, first released in September 2014.


Who is the target audience?
  • This course was built for web developers who design and build UI/UX solutions for mobile and the web. This course is designed for those developers who want to design with Angular2 as easily as they can with other JavaScript frameworks. Of course, the info presented here is just as valuable for architects, testers, and product managers as they too should understand how Angular2 is designed and used in a complete web solution.
Compare to Other Angular Courses
Curriculum For This Course
74 Lectures
03:49:26
+
Introducing Angular 2
5 Lectures 12:04

This course teaches you how to design and build components, how to use templates to create your application’s user interface, how to extend HTML with directives and data binding, and how routing is done.

Please download the attached document for course project source files information 


Preview 02:00

What is Angular? Why should we use Angular? Why is there an Angular2?

Preview 04:10

Let’s understand what we’ll do over the life of this course and how we’ll do it.

How This Course Works
03:02

We can get a Cloud9 account set up if necessary and get our initial project set up in the cloud.

Preview 02:00

We now understand what to expect in the sections of this course and what we can expect to learn.

Section Summary
00:52
+
Pack Our Lunch
7 Lectures 21:56

Prepare ourselves with some significant background info and a functioning development environment.

Preview 00:59

TypeScript is the language of choice for Angular2. Let’s learn why.

Preview 03:56

We need to get our Cloud9 online IDE set up and ready for development.

Getting the Cloud9 Online IDE
01:24

Setting Up the Cloud9 IDE
02:02

We’ll code every concept that we learn in our course project. Let’s set it up and get it ready for our first lesson.

Course Project Setup
08:06

Modules are a foundational part of Angular2. Let’s be sure to understand what they are and how we’ll use them.

Using Angular 2 Modules
04:03

We are now primed and ready to dive into Angular2.

Section Summary
01:26
+
Angular 2 Components
7 Lectures 25:53

Take a close look at what Angular2 components are and learn the steps involved in creating one.

Section Introduction
01:14

Let’s learn what components are and what they’re made of.

The Component Defined
02:23

Components consist of 3 parts. Let’s learn what they are and what each part does.

The Component Parts
04:52

Let’s learn the interactions of the 3 component parts and how to stitch them together to create a complete component.

Tying a Component Together
01:59

The App Component is the heart of an Angular2 application. Let’s learn to create it.

The App Component
04:28

With enough ammunition to get an app up and running, let’s learn how to do it.

Bootstrapping an Angular 2 App
06:57

We learned enough to get an app up and running. With a very app is simple and very high-level Angular2 knowledge, we’re ready to dive deep into the Angular2 depths.

Section Summary
04:00
+
Building Angula r2 UI
7 Lectures 32:19

We will learn to define the visible aspects of components as HTML within a template.

Section Introduction
02:40

Our view is defined in HTML which can then be inserted into our component’s template.

The Component Template
05:47

We can create a template in a separate file.

Create A Template
02:44

There are 3 steps in using a component as a directive.

The Directive Component
04:25

Binding data from our component’s class to it’s template is easy with interpolation.

Interpolation
04:07

Angular2 has tons of built-in directives that we need.

Angular 2 Built-In Directives
09:27

We learned to work with templates within components, to bind data in those components, and how to use components as directives.

Section Summary
03:09
+
Binding in Angular 2
6 Lectures 16:54
Section Introduction
01:47

When data changes in our class, we need to reflect the change in our HTML. Let’s learn how this works.

Property Binding
03:42

Certain user interactions with our web page need to update properties in our class. We can use Event Binding to have this happen automatically.

Event Binding
03:49

We can use both Property binding and Event binding at the same time to synchronize class properties and page elements.

2-Way Binding
02:09

Let’s learn to use Pipes to transform bound properties before they are displayed.

Formatting Bound Data
03:19

In this section we learned to use Property binding & Event binding and how to combine them for 2-Way binding. We also learned how Pipes help us control the display of our data.

Section Summary
02:08
+
Advanced Component Concepts
6 Lectures 26:28

We will learn several ways to improve upon our components.

Section Introduction
02:18

Let’s see how to make the most of Angular2’s TypeScript benefits thru use of Interfaces.

Interfaces and Components
05:08

There is a better way to do styling in Angular2 than simply referencing a CSS file. Let’s learn how!

Styling Components
04:02

Let’s learn to listen to an Angular2 application and react to it’s many events.

Component Lifecycle Events
03:55

We can transform and apply logic to data before we display it in the browser. Let’s see how it works.

Pipe Transform Interface
07:55

In this section we learned to leverage TypeScript strong typing with interfaces, saw how to encapsulate styling within a component, and how to tap into component lifecycle events to trigger operations.

Section Summary
03:10
+
Component Composition
6 Lectures 20:03

We will discus how to build components designed to be nested within other components and have these components talk to one another.

Section Introduction
01:58

Let’s see how components can work “inside” other components.

Parent-Child Components
05:10

We can use a Nested Component as a Directive. Let’s discuss how this is done..

More Parent-Child Components
02:24

Let’s learn how a Nested Component can take input from its Par

Property Binding with Input
02:40

A Nested Component can send data to its Parent Component. Let’s examine this functionality.

Event Binding with Output
05:38

In this section we learned how Components can nest within one another and still maintain normal data binding.

Section Summary
02:13
+
Services
6 Lectures 16:37

We can use Services when we have data or logic that is not associated with a specific view or that we want to share across components.

Section Introduction
01:39

Let’s learn how Dependency Injection can make Services most effective

Angular 2 Dependency Injection
02:11

Services are created quite similarly to Components and Pipes. Let’s see how simple it really is.

Creating Services
03:14

Let’s learn to get Services into play by registering them as Providers.

Using Services
02:55

We can leverage Dependency Injection to expose services where they’re needed.

Service Injection
04:35

In this section we learned to create Services, register them as Providers, and how to expose them most efficiently with Dependency Injection.

Section Summary
02:03
+
Web Services
6 Lectures 16:20

We will learn how to use HTTP with observable to retrieve data from the interwebs.

Section Introduction
01:21

We can use Reactive Extensions (RxJS) to implement Angular2’s Observables instead of simply using Promises.

Observables vs Promises
02:05

Let’s learn to get Reactive Extensions (RxJS) into play along with Angular2’s HTTP library.

Using Reactive Extensions
02:11

We’ll learn to send HTTP requests in Angular2.

HTTP Requests
06:13

Let’s see how to use Observables to work with data requested via HTTP.

Implementing Observables
02:26

In this section we learned about using Reactive Extensions (RxJS) and it’s Observables instead of relying on Promises. We learned how Angular2’s HTTP library gets us HTTP requests and how to use Observables to handle data in an HTTP response.

Section Summary
02:04
+
Angular2 Routing
7 Lectures 27:41

We will learn to define routes for navigate between multiple views in an Angular2 application.

Section Introduction
05:27

In Angular2 routing is component based. Let’s learn to configure routing targets and to define routes for components.

Route Configuration
03:17

We will discuss the technique of tying routes to user actions for effective navigation within an application.

Routes and Actions
04:53

Routes and Views
01:50

Oftentimes routes need to be passed a parameter. Let’s discover how this works in Angular2.

Routes And Parameters
05:35

Let’s find out how to do routing with code vs. user interactions. We can implement Angular2’s RouterService to make this happen.

Routes And Code
02:32

In this section we walked through how to configure routes, tie routes to actions, and define where the routed component’s view should appear. We also uncovered some additional routing techniques, including passing parameters to a route and activating a route with code.

Section Summary
04:07
3 More Sections
About the Instructor
Stone River eLearning
4.2 Average rating
17,256 Reviews
285,712 Students
203 Courses
280,000+ Happy Udemy Students

At Stone River eLearning, technology is all we teach. If you're interested in programming, development or design - we have it covered. 

Check out our huge catalog of courses and join the over 450,000 students currently taking Stone River eLearning courses. We currently offer 100+ different technology training courses on our Stone River eLearning website and are adding new courses on hot and trending topics every month. A subscription option is available for those with a real passion for learning.