Learning Angular 2 Directives
0.7 (3 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.
29 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Learning Angular 2 Directives to your Wishlist.

Add to Wishlist

Learning Angular 2 Directives

Learn how to build efficient Angular 2 directives with this fast and interactive guide
0.7 (3 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.
29 students enrolled
Created by Packt Publishing
Last updated 5/2016
English
Curiosity Sale
Current price: $10 Original price: $75 Discount: 87% off
30-Day Money-Back Guarantee
Includes:
  • 2.5 hours on-demand video
  • 1 Supplemental Resource
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • Develop a strong understanding of Angular 2 components by slicing static HTML pages into dedicated components
  • Configure a modern setup with TypeScript, SystemJS, and ES2015
  • Refactor and upgrade an Angular 1.x application to Angular 2
  • Design reusable components by understanding how data flows in and out of them and by leveraging advanced Angular 2 template techniques
  • Debug Angular 2 components and write automated unit and end-to-end tests
  • Embed external libraries such as d3
  • Run Angular 2 components on mobile devices and on the server
View Curriculum
Requirements
  • This is a hands-on course. You will uncover new concepts while building real Angular 2 components for a home automation dashboard application. This course is like a pair programming session with the author.
Description

Get up to speed with the building blocks of Angular 2. New technologies and new patterns are emerging on a daily basis. Coding for the front end is extremely demanding, but at the same time more interesting and challenging than ever before. This highly dynamic ecosystem provides huge possibilities to create awesome things.

Learning Angular 2 Directives helps you get on track by introducing you to Google’s brand new Angular 2 web framework. In this video course, you will be guided through the various steps in building real-world Angular 2 components.

We will start by setting up a modern development environment with TypeScript and ES2015 support, and you'll gain an initial understanding of what components are about, how to build them, and how they differ from the directives. We then focus on applying new concepts while building a fictitious dashboard application for a home automation system.

We'll guide you through the process of building reusable Angular 2 components. You will learn about HTML rendering templates, see how to establish a data flow between different components, and even find out how to integrate external libraries. But not only that, we will also focus on how to make our components production-ready and maintainable by applying automated unit and end-to-end testing techniques. As a bonus, you will discover how to bring your Angular 2 components to other environments such as the server side and mobile devices.

Learning Angular 2 Directives is your go-to guide when building successful Angular 2 components.

About The Author

Juri Strumpflohner is a passionate web developer, tech lead, and architect, and is currently focusing on frontend technologies. He has over 6 years of experience in developing JavaScript single page applications with various frameworks, most lately with Angular 1.x and 2.0.

Who is the target audience?
  • This video is for JavaScript web developers who are looking to learn how to build appealing web applications with Google’s new Angular 2 framework. It’s also aimed at Angular 1.x developers who are planning to upgrade to Angular 2.
Students Who Viewed This Course Also Viewed
Curriculum For This Course
20 Lectures
02:22:49
+
Getting Started
3 Lectures 16:32

This video will provide an overview of the entire course.

Preview 03:41

The viewer doesn’t yet have a good understanding of ES6 and TypeScript, which makes it hard for him to read and understand Angular 2 code. Thus, we go over the fundamental features and we’ll take a look at our development setup, on top of which we build our application. 

Project Setup
06:38

Current approaches in componentization and reusability on the web frontend have some undesirable side effects. This video shows the user what the potential problems are and how modern methodologies such as WebComponents and Angular aim at tackling them. 

All about Components
06:13
+
Angular 2 – Scratching the Surface
3 Lectures 22:48

Many people already have huge Angular 1.x applications. In the long run people will want to upgrade in order to benefit from Angular 2’s new features. This video shows some possible upgrade paths and measures that should be taken. 

Preview 05:37

How do we write Angular 2 components? In this video, we’ll get a first grasp of it. 

Hello, Angular 2
06:16

Commonly, our components interact with the outside by having data flow in and out. This video demonstrates how to realize that data flow. 

Feeding Our Component with Data
10:55
+
HomeAuto – First Screens
3 Lectures 21:44

We identify components on a static HTML page representing our app layout. 

Preview 07:29

Inject an external dependency into a component and render its data using the Angular template syntax. 

Scanning for New Sensors
07:59

How to use pipes to filter data? And how to establish a data flow and communication between different components? 

Creating a General Purpose Filter
06:16
+
Building Reusable Modals
3 Lectures 18:32

Develop a modal dialog, style it via dedicated component properties, and establish two-way data binding with the passed data. 

Preview 07:01

Currently, our modal dialog solution is not reusable for different use cases. We will solve this problem in this video. 

Making the Modal Generally Reusable
05:13

Learn about the difference between components and directives. 

Attribute Directives to the Help
06:18
+
Building Up Our Dashboard
3 Lectures 22:38

Learn how to interact with child content that is projected in a <ng-content> region. 

Preview 07:16

Learn how to best integrate external, third-party libraries and make them work with Angular 2. 

Integrating an External Library – Data Visualization with D3
05:06

Minify, bundle, and deploy an app in production. 

Ready for production – Bundling and Minification
10:16
+
Maintaining Components
3 Lectures 23:39

Writing a unit test for our Angular 2 component. 

Preview 09:07

Learn how to debug the current state of our application to gain better insight. 

Debugging (with Batarangle)
06:10

Learn how to automate the detection of malfunctioning software. 

e2e Testing Angular 2 Components
08:22
+
Show Me More!
2 Lectures 16:56

Learn how to build hybrid mobile apps with Angular 2. 

Preview 07:28

    Pre-rendering Angular 2 applications on the server.

Going Universal with Angular 2
09:28
About the Instructor
Packt Publishing
3.9 Average rating
7,349 Reviews
52,586 Students
616 Courses
Tech Knowledge in Motion

Packt has been committed to developer learning since 2004. A lot has changed in software since then - but Packt has remained responsive to these changes, continuing to look forward at the trends and tools defining the way we work and live. And how to put them to work.

With an extensive library of content - more than 4000 books and video courses -Packt's mission is to help developers stay relevant in a rapidly changing world. From new web frameworks and programming languages, to cutting edge data analytics, and DevOps, Packt takes software professionals in every field to what's important to them now.

From skills that will help you to develop and future proof your career to immediate solutions to every day tech challenges, Packt is a go-to resource to make you a better, smarter developer.

Packt Udemy courses continue this tradition, bringing you comprehensive yet concise video courses straight from the experts.