Angular 9 Firebase Project Course
The Angular Firebase PWA Course will teach you how to build a complex progressive web app with Angular 9 (ivy), Material Design, and Firebase. It starts from absolute basics and eventually culminates with the deployment of a server-rendered PWA on Google Cloud Run. You will build a full-stack Kanban (看板) storyboard app inspired by Trello. Authenticated users can create, sort, update, and delete boards with all interaction persisted in Firestore.
Read more about the course
What will I Learn?
- Code organization with feature modules
- Lazy-loaded routing
- Usage of common Angular Material components
- User authentication with Firebase (Google OAuth, Email/Password)
- Reactive Forms vs Template-driven Forms
- Drag-and-Drop with the Angular CDK
- Data modeling and complex writes/queries with Firestore
- Firestore security rules
- Angular Universal with Nest.js
- Prerendering and/or deployment to Google Cloud Run
Is this Course Right for Me?
This course is intermediate level and designed to expose you to real-world challenges when building PWAs with Angular. It assumes you have at least basic knowledge of web programming and basic skills in JavaScript, HTML, and CSS. It is fast-paced and similar to my style on YouTube, but far more in-depth and comprehensive.
Watch Online Angular 9 Firebase Project Course
# | Title | Duration |
---|---|---|
1 | Angular Tutorial for Beginners | 20:46 |
2 | Resources | 01:51 |
3 | CLI | 04:02 |
4 | Anatomy | 05:13 |
5 | Components | 13:52 |
6 | Component Composition | 05:19 |
7 | Dependency Injection and Services | 03:19 |
8 | Modules | 02:41 |
9 | App Overview | 02:50 |
10 | Meet Angular Material | 05:22 |
11 | Schematics | 01:10 |
12 | Shared Module | 03:59 |
13 | App Navigation Shell | 08:45 |
14 | Routing | 02:57 |
15 | Firebase Setup | 02:43 |
16 | Lazy Loaded Login Feature | 03:54 |
17 | Google SignIn | 04:38 |
18 | Email Password Auth | 11:33 |
19 | Auth Guard | 04:59 |
20 | Kanban Module | 02:10 |
21 | Firestore Data Model | 04:49 |
22 | Database Service | 07:39 |
23 | CDK Drag and Drop | 06:36 |
24 | Drag and Drop Animation | 03:07 |
25 | Dialogs | 08:04 |
26 | Delete Button | 03:11 |
27 | Server-side Rendering - What? Why? How? | 02:57 |
28 | SEO Service | 05:33 |
29 | Angular Universal with NestJS | 02:56 |
30 | Prerendering | 04:05 |
31 | Angular Universal on Google Cloud Run | 05:56 |
Similar courses to Angular 9 Firebase Project Course
![Complete Angular Developer in 2023 Zero to Mastery](https://cdn.courseflix.net/courses/100x56/complete-angular-developer-in-2023-zero-to-mastery.jpg?d=1739917844426)
Complete Angular Developer in 2023 Zero to Masteryzerotomastery.io
![Angular Interview Hacking](https://cdn.courseflix.net/courses/100x56/angular-interview-hacking.jpg?d=1739917844426)
Angular Interview HackingDmytro Mezhenskyi (decodedfrontend.io)
![Reactive Angular Course (with RxJs)](https://cdn.courseflix.net/courses/100x56/reactive-angular-course-with-rxjs.jpg?d=1739917844426)
Reactive Angular Course (with RxJs)udemy
![Zero to Full Stack Hero](https://cdn.courseflix.net/courses/100x56/zero-to-full-stack-hero.jpg?d=1739917844426)
Zero to Full Stack Heropapareact.com
![Build an app with ASPNET Core and Angular from scratch](https://cdn.courseflix.net/courses/100x56/build-an-app-with-aspnet-core-and-angular-from-scratch.jpg?d=1739917844426)
Build an app with ASPNET Core and Angular from scratchudemy
![Learn to build an e-commerce app with .Net Core and Angular](https://cdn.courseflix.net/courses/100x56/learn-to-build-an-e-commerce-app-with-net-core-and-angular.jpg?d=1739917844426)
Learn to build an e-commerce app with .Net Core and Angularudemy
![Angular - The Complete Guide](https://cdn.courseflix.net/courses/100x56/angular-the-complete-guide.jpg?d=1739917844426)