Building Angular and Django Apps

Course details

Put your Angular and Django REST knowledge to the test. In this course, join Rudolf Olah as he delves into the intricacies of pairing the two frameworks to build dynamic web applications. Throughout the course, Rudolf demonstrates how to wire together the two frameworks, add pagination, secure, and test your applications. Discover how to prepare your Angular code for production, communicate between the front-end and back-end servers using the built-in Angular HttpClient, and use the Angular Material UI component framework to display pop-up dialog boxes and data in tables. Plus, learn how to set up authentication with the Django OAuth Toolkit, implement filtering with Django and Angular, and use unit and end-to-end testing to ensure that your app is ready for production.

Learning objectives
Serving Angular code through Django static files
Creating forms with Angular and Django
Setting up authentication
Filtering with Django and Angular
Pagination with Django and Angular
Unit testing authentication

Concepts

Introduction

Create a full-stack Angular app with the Django REST framework
What you should know
Demo project overview

Django and Angular Preparation

Running the Angular and Django development servers
Compiling Angular Code
Serving Angular Code Through Django static files

Forms with Angular and Django

Creating models with the Django REST framework
Creating a ViewSet with Django
Creating a REST API service with Angular
Creating a basic form as an Angular component
Connecting an Angular component to a service

Front-End Design and Layout with Angular

Form layout with Angular Material
Date time selection with a Calendar in Angular
Displaying a data table with Angular Material table
Displaying a pop-up dialog box with Angular
Displaying more information with Angular

Authentication with Django and Angular

Setting up Authentication with Django OAuth Toolkit
Using scopes with Django OAuth Toolkit for permissions
Registering a new OAuth application with Django OAuth Toolkit
Logging in and authentication with Angular and HttpClient
Using OAuth headers with Angular and HttpClient
Authentication storage with Angular

Filtering and Pagination with Django and Angular

Checking permissions with Django
Deleting an item using Angular and Django
Partially updating an item using Angular
Pagination with Django
Pagination with Angular
Filtering with Django
Filtering with Angular
Animations in Angular

Testing Angular

Unit testing a component
Unit testing a service
Unit testing a controller
End-to-end testing the form submission process
End-to-end testing the filtered data table

Testing Django

Unit testing authentication
Unit testing permission checks
Unit testing validation for the REST API

Conclusion

Next steps