Angular 9 Firebase Project Course
Course description
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
All Course Lessons (31)
| # | Lesson Title | Duration | Access |
|---|---|---|---|
| 1 | Angular Tutorial for Beginners Demo | 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 |
Unlock unlimited learning
Get instant access to all 30 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.
Learn more about subscriptionComments
0 commentsWant to join the conversation?
Sign in to commentSimilar courses
Reactive Angular Course (with RxJs)
Angular Basics (v15)
Building Your First App with Spring Boot and Angular
Angular Architecture. How to Build Scalable Web Applications
