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
Build Fullstack Trello clone: WebSocket, Socket IO
Learn to build professional-grade Angular Applications | Angular Start
The essential guide to Firebase with React.
Angular Interview Hacking
