Angular Tutorials: Premium Quality Tutorials on Angular and its Ecosystem https://angular-university.io The single resource a developer with a full time job needs for learning and keeping up with the fast moving Angular and its ecosystem, by providing very focused, summarised and high quality tutorials on Angular. Learn the framework from beginner to intermediate or advanced, be up-to-date on the latest developments and features, all in small bite-sized videos of less than 5 minutes. The courses include but are not limited to: - Angular For Beginners - https://angular-university.io/course/getting-started-with-angular2 - Angular Router - https://angular-university.io/course/angular2-routing- Angular Forms - https://angular-university.io/course/angular2-formsFollow us:Twitter - https://twitter.com/AngularUnivGoogle+ - https://plus.google.com/u/1/113731658724752465218Facebook - https://www.facebook.com/angular.university
The course is an Web Application Security Fundamentals Course, where the application will use the Angular/Node stack.This course covers Angular 4 and all the server code is in Typescript, but the security concepts explained in it are applicable to other technology stacks.We will use several Angular and Node packages from Auth0, and we will also include a demo of how to use Auth0 for doing Application User Management.Security - A Fundamental Step in Your Software Development CareerSecurity is probably the number one advanced topic that Software Developers are expected to master when going forward in their software development careers.Security knowledge is hard to come by but its essential for advancing to more senior software development positions, like for example Application Architect or similar.Learning Web Security Fundamentals, knowing how to design an application for security, and knowing how to recognize and fix security issues is an essential skill for a senior developer.But the problem is that security knowledge is orthogonal to most other topics and it typically takes years to learn.The good news is that once you have it, Security knowledge has a much longer shelf live than most software development knowledge in general.Most of the vulnerabilities and fixes that you will learn in this course were useful 10 years ago, and will (very likely) still be useful 10 years from now - Angular and Node are just an example of one stack, to make the course examples more practical.Security is seen as something really hard to master - this is actually not the case! Application Security is much more approachable than you might think, depending on how you learn it.What Is The Best Way To Learn Security in a Fun and Practical Way?Here is what we will do: we are going to take the skeleton of a running application that has no security yet, and we are going to secure the application step-by-step.Using a couple of open-source packages from Auth0, we are going to implement the Sign-Up and Login functionality from scratch, and because security cannot be enforced only at the client-side, we will implement both the frontend in Angular and the backend in Node.As we secure the application, we are going to periodically put on our Black Hat, and we are going to attack the application many times during the course, to prove that the vulnerabilities are real!!By doing so, we will learn along the way the fundamentals of Authentication and Authorization, we will become familiar with common vulnerabilities like Dictionary Attacks, XSS, CSRF and others, and we will get familiar with commonly used cryptographic tools like Hashing, Salting, JWT, password storage recommendations and more.Please don't be intimidated by these concepts: The focus in this course will not be on the internals of each of the cryptographic tools that we will use, but instead on understanding on a high-level what problems do these tools solve, when to use each and why.We will also learn how to design our application for security, and we will learn how in many situations application design is ou best defense.Course OverviewWe will start at the beginning: we will see the proper way of doing User Management and Sign Up: we will learn how to store passwords in a database, and we will introduce cryptographic hashes in an approachable way.Once we have the Sign-Up functionality in place, we will implement Login and understand the need for a temporary identity token. Our first implementation will be stateful login, where the token is kept at the server level.And at this point we could think we have authentication in place, but we decide to prepare our application for scalability, so we decide to try a JWT (JSON Web Tokens) based approach, because we know that this is what services like Firebase and Auth0 use.We will use a couple of Auth0 packages to quickly refactor our Login to be JWT based, and learn the advantages of using JWT, and some potential disadvantages as well. And with this in place, we could think that we had a solid security solution.Its at this point that we will realize that this application is not secure at all!! We will put on our Black Hat, and we will conduct step-by-step an XSS script injection attack and we will steal the identity of another user and send it to an attack server.We decide to first protect our authentication token from theft, and then deal with XSS injection attack later. We try to move the JWT to Cookie storage, only to realize that it made us vulnerable to another attack: CSRF request forgery!We will proceed to further attack the application, and take the time to really understand the attack.At this point feeling more confident with the security of the application, we have decided to tackle the original XSS vulnerability and see how Angular provides built-in defenses for that, and when to bypass those defenses and why.
We will build a series of small open source libraries (about 7) of progressively increasing difficulty, and we will learn a large number of Angular advanced features in a very fun and practical way.We will build a series of small open source libraries (about 7) of progressively increasing difficulty, and we will learn a large number of Angular advanced features in a very fun and practical way.What Is The Best Way To Learn Advanced Angular Features ?Technology is never created in a vacuum - there are always certain original use cases for the appearance of a framework or even a framework feature. The best way to learn technology and according to some recent research to learn anything in general, is something called "Deliberate Practice".So the best way to learn Angular and its most advanced features is to simply take and use it to build something very concrete, like for example an application or a library -and do it in a step-by-step way.This is of course very time-consuming to do without any help because we will have to learn everything by ourselves along the way as we build something, gluing together an endless number of blog posts, documentation and Stackoverflow answers.Given this, here is what will do in this course: we are going to take Angular and use it to build a series of small reusable libraries. We are going to learn the advanced features of Angular in their original use cases, where they make the most sense and so are easier to learn.What Will We Build In This Course ?In this course we are going to start by getting familiar with the Node library ecosystem. We are going to learn how npm dependencies really work under the hood, and what are the features that have been making the NPM Node ecosystem explode with tens of thousands of packages.We are going to learn how and why the frontend ecosystem will also soon start benefiting from those features. Then we will start building a series of libraries: Our goal is that at the end of the course combine all the libraries we have built to create a reusable real-world dynamic modal payment widget, that will allow the user to submit payments in both Stripe and Paypal.We will split this major component into smaller libraries: As we will be introducing testing and all the ecosystem that comes with it, we will start simple by doing a Font Awesome customizable action button.Then we will progressively increase the difficulty of each library: we will build a dynamic tab container that allows to add new tabs at runtime, a reusable dynamic modal component with customizable content, a input mask directive to help the user introduce card numbers, a payment panel with a validated form for entering card data.All of these libraries are reusable on their own, but fit the larger picture of building a working payments modal widget that provides a great user experience.All of these will be tested and we will introduce animations where it makes the most sense and deploy everything to npm. We will discuss testing in detail, namely what parts of the library to test, how and and why. Each library will have a small sample application.What Will you Learn In this Course?We will learn how to use the Angular CLI to create a AOT compatible library, how to define a library module, how to isolate the styles of a component but still make them customizable, how to design components and directives to make them easier to maintain - making them customizable while at the same time giving the components great default behavior.We will cover all of the more advanced features of Angular, like templates, template outlets, ng-content, ng-container, style isolation and customization, AOT, global events, debugging with the CLI, @ViewChildren, @ContentChildren, Light DOM vs Shadow DOM, @HostBinding, @HostListener, dynamic components, directives, handling keyboard events, testing, animations and more (this is a non-extensive list).But more than presenting the features in isolation, we will use them in real use cases which will make the features much easier to learn.Course OverviewAs we will building a set of Angular libraries and deploying them in NPM, we will cover first NPM and its ecosystem - meaning how does the npm dependency management system work, and how the frontend development work is likely going to experience a similar growth to the Node ecosystem.For more videos tutorials on Angular, check the Angular University website - https://angular-university.io Follow us:Twitter - https://twitter.com/AngularUnivGoogle+ - https://plus.google.com/u/1/113731658...Facebook - https://www.facebook.com/angular.univ...Category
RxJS and Reactive Programming can sometimes be seen as hard to get into. Although RxJs is optional in many parts of the Angular API and we can usually use Promises instead, one of the items of the Angular Project Roadmap is to allow to build reactive style applications. So clearly reactive programming is a topic that is close to the framework.What is The Best Way To Learn RxJs ?Why is RxJs and reactive programming sometimes seen as hard to get into ? The main reason for that could be that Observables and reactive programming are presented as either a programming paradigm shift, an alternative to promises or a generalization of functions, which are approaches that don't help as much as we could think in the learning process.We are going to take an alternative learning take for learning these concepts: a problem / solution approach. RxJs and Observables are actually a very practical and effective solution to a very common set of problems that we face all the time while building asynchronous programs like user interfaces, and that by understanding those problems we are going to also understand RxJs - because it evolved over time as a solution to many of those problems.
These are sample lessons of the Angular Ngrx Reactive Extensions Architecture Course, the complete course is available here - https://angular-university.io/course/angular2-ngrxWe are going to build step by step a chat application that reproduces the situation that the Facebook team faced with the unread messages counter. We are going to solve the problem not by using the original Flux dispatcher, instead we are going to use a derived single store RxJs-based solution: The Angular Reactive Extensions Ngrx Store.We are going to use the Angular CLI to quickly scaffold an application, and implement the frontend of the chat application from scratch: from an empty folder - every line of code will be explained.The backend will also be explained but we will initially get a running backend as a starting point, so that we focus on the frontend architecture and the store solution.We are going to build the application using Reactive Programming principles and a set of libraries of the Angular Reactives Extensions (Ngrx) Ecosystem: this will include the Ngrx Store, Ngrx Effects, DB, Router integration.We are going to cover the benefits of Immutability and OnPush change detection, its advantages and disadvantages.For more tutorials on Angular , have a look at the courses available in the Angular Academy - https://angular-university.ioFollow us:Twitter - https://twitter.com/AngularUnivGoogle+ - https://plus.google.com/u/1/113731658724752465218Facebook - https://www.facebook.com/angular.university