Creating a Real-World Angular 2 App: Modules, Routing and Components


 1 Review Add a review

Published November 2017

Learn how to build production-ready Angular 2 applications by building a bug tracking app!

In this course we’ll start taking the skills you learned in our Angular 2 fundamentals courses and put them to use in a real-world situation.

By building Bugged Out, a fully-featured bug-tracking application, you’ll get hands-on experience in building production-ready Angular apps.

We’ll start by looking at Angular modules — a way to organize your application, and extend it with external functionality.

Then we’ll use Angular routing to make sure your users are moved around the app appropriately as they interact with it.

Finally, we’ll build our app’s components, which are Angular’s basic building blocks for user interface and interaction elements.

After you complete this, you can continue building Bugged Out with the next course, Building a Realtime Firebase Database.

This is part four of a seven part series. Get the full benefit by completing them in order:

Oh yeah, and the whole SitePoint library! Learn More.

What you'll learn

  • Lay the foundations for a new production application

  • Get to grips with Angular modules

  • Learn all about application routing

  • How to use components to build your interface
Meet your instructor
Jess Rascal

Jess Rascal is a product manager by day, a web and iOS developer the rest of the time that his brain is active.

Lesson 1: Build a Real World Angular 2 App with Backend - Bugged Out
Introduction to the Bugged Out App 1:37
Adding the Bugs Module (Feature Module) 13:27
Creating a Shared Module 16:41
Creating the Bug List Component 5:37
Introduction to Routing 8:08
Creating the Router 12:58
Creating the Bug Module's Own Routing 10:11
Implementing Route Redirection 4:47
Adding Wildcard Routing 4:11
Creating the Navbar Component 5:35
Creating the Navbar Template 9:30
Styling the Navbar 6:12
Introduction to Router Links 7:47
Creating the Bug List Template 7:51
Styling the Bug List Component 13:20
Introduction to the Core Module 9:23
Creating the Core Module 14:05

Leave a Review