Designing and Building Component-based AngularJS Applications

Components are the main application design difference with the new Angular. In this course, you'll learn how to build sites in a component-based way, where they are easier to design, develop, modify, and enhance in AngularJS.
Course info
Rating
(34)
Level
Intermediate
Updated
Jul 10, 2017
Duration
4h 9m
Table of contents
Course Overview
Course Introduction
Shifting to a Component-based Design - Angular (2+) Thinking
The Development Environment
Writing a Component
Laying out Your Component-based Application
Routing
Building Out the Rest of the App Structure
The Author List and Course List Components
Adding Services
Securing the Application
The Course Component and Its Internal Structure
The Author & Sidebar Components
Replacing the Home Component with Recent Courses
What About ASP.NET?
Description
Course info
Rating
(34)
Level
Intermediate
Updated
Jul 10, 2017
Duration
4h 9m
Description

Angular has made it necessary to learn new syntax, new installation procedures, and of course wants us to use TypeScript. However, the single most significant change is that it takes you down the path of component-based design. What if you are not ready to make the leap to the next version of Angular? Well, now you can design and develop your web applications using this great modular and encapsulated paradigm, and you can do it using the familiar AngularJS environment. In this course, Designing and Building Component-based AngularJS Applications, you'll learn how to design and develop these kinds of applications. First, you'll begin by leveraging all of your existing Angular knowledge and learning a hierarchical way of designing, making your web site a hierarchy of components. Next, you'll explore how to use the Angular UI Router, which replaces the Component Router. This offers you the same nested routing capability that you'll find in the new Angular router. Finally, you'll cover how to make your components secure, requiring the user to be authenticated before accessing them. By the end of this course, you'll have the necessary knowledge and understanding of how to utilize the component-based way that Angular does things now.

About the author
About the author

Whether playing on the local Radio Shack’s TRS-80 or designing systems for clients around the globe, Miguel has been writing software since he was 12 years old. He keeps himself heavily involved in every aspect, layer, nook, and cranny of app development and would not have it any other way.

More from the author
Implementing Autofac in ASP.NET
Intermediate
2h 16m
Sep 12, 2019
WCF Power Topics
Advanced
7h 11m
Feb 29, 2016
More courses by Miguel Castro
Section Introduction Transcripts
Section Introduction Transcripts

Course Overview
Hello everyone, my name is Miguel Castro, and welcome to my course, Designing and Building Component-based AngularJS Applications. I'm president and principal consultant at Melvicorp LLC. This course can very well be the most important AngularJS course you can watch today. It may also be the most fun. This course is a bridge between AngularJS and Angular, teaching you the component-based paradigm that Angular forces you into, but in AngularJS, which most of you, including myself, are still using, and have a lot invested in, the course it platform agnostic, so you only need to understand AngularJS to follow along. Some of the major topics that we will cover include a comparison between the traditional view controller design, and the more advanced and robust component design, how to lay out an application using components, thus making it easier to build, modify, and enhance later, using the Angular UI router to help us map URLs to various component hierarchy's, and also give the user full back button support without ever performing a full server trip. Making component secure, requiring the user to be authenticated before accessing them. And for you Microsoft developers out there, at the end I'll be showing you how you can incorporate ASP. NET into all of this as well. By the end of this course, you'll know everything you need to design complete component-based applications in AngularJS, and you'll be completely comfortable using this design paradigm. This means that when you take the leap into Angular, you'll have mastered the thing that truly makes it massively different from AngularJS. Before beginning the course, you should be familiar with traditional AngularJS development using conventional views and controllers with nothing else but JavaScript. Don't worry, I'll take you the rest of the way. After you've completed this course, you'll feel very comfortable diving into any course using Angular 2 or higher, since you will have already mastered the biggest difference in designing applications between Angular and AngularJS. I hope you'll join me on this journey to learn component-based design and development, with the Designing and Building Component- based AngularJS course, at Pluralsight.

Replacing the Home Component with Recent Courses
This next function will be called getRecentlyViewedCourses. It too will be secure. And this one will be a simple http get call, so everything will be included in the URL. I'll just go ahead and quickly add this one, as you can see, nothing new, nothing special. And finally, just to complete things, we'll add a function to clear a user's recent course list. This one I'll add in full, since you're used to me doing this already. Again, nothing fancy here, you've seen it all before. I can leave out the then promise if I want, since I'm not doing anything with it, but I'll leave it here just in case I change my mind in the future.