Angular Tutorial for Beginners Build a Tic-Tac-Toe game with Angular Intro đ Resources đ Brand New to Angular? The following beginner-level tutorial teaches you how to build a Tic-Tac-Toe game with Angular. It’s not part of the full course, but rather a gentle intro project to get acquainted with the Angular ecosystem. It is completely optional. Tic-Tac-Toe Source Code Example of the final tic-tac-toe PWA deployed in this section Recommended Lessons You may also find the following lessons useful for mastering the basics of Angular. Reactive Forms Basics Testing Angular Apps Material Datatables Kitchen Sink Chapters Optional Beginner Project đļ 1 Angular Tutorial for Beginners Build a Tic-Tac-Toe game with Angular free 20:23 Intro đ 2 Resources Source code and course resources free 1:51 ⥠3 CLI Introduction to the Angular CLI free 4:01 âŖī¸ 4 Anatomy The purpose of every file in Angular free 5:13 đĻ 5 Components An introduction to Components, Directives, and Pipes free 13:51 đ 6 Dependency Injection and Services What is dependency injection (DI) and why is it so useful? free 3:18 𧊠7 Modules How NgModules help manage code and complexity free 2:41 App đģ 8 App Overview Overview of the organization and architecture of the Firestarter demo app. 2:50 đ¨ 9 Meet Angular Material Introduction to Angular Material and design systems 5:21 đī¸ 10 Schematics Using Angular Material Schematics 1:10 đ¤ 11 Shared Module Share component and Material Modules efficiently throughout the app 3:59 đ 12 App Navigation Shell Add a responsive navigation shell to the app 8:45 đ 13 Routing Create a home page configured with the Angular Router. 2:56 đĨ 14 Firebase Setup Add Firebase and @angular/fire to your app 2:42 Users 𤸠15 Lazy Loaded Login Feature Configure the router for lazy-loaded user module, aka code splitting. 3:54 đ¤ 16 Google SignIn Create a directive that extends Google SignIn to any button or element 4:37 đ§ 17 Email Password Auth SignUp, SignIn, and reset a password with Reactive Forms 11:32 đŽ 18 Auth Guard Protect routes with guards. 4:59 Kanban đą 19 Kanban Module Kanban feature module setup 2:10 đĨ 20 Firestore Data Model Firestore database model for kanban boards and backend security rules. 4:48 đĨ 21 Database Service Create a specialized Firestore database service for Kanban boards 7:39 đą 22 CDK Drag and Drop Add drag and drop capabilities to a Material Card 6:36 đą 23 Drag and Drop Animation Animate the CDK Drag and Drop events with CSS transitions 3:06 đą 24 Dialogs Create, update, delete data from a Material Dialog modal popup 8:03 đī¸ 25 Delete Button Create a confirmable delete button 3:10 Server-side Rendering â 26 Server-side Rendering - What? Why? How? Key concepts related to SSR and Angular Universal 2:57 đˇī¸ 27 SEO Service Create a service for Open Graph & Twitter meta tags. 5:32 đĻ 28 Angular Universal with NestJS Add server-side rendering to Angular with Nest.js 2:56 đ 29 Prerendering Prerender with Angular Universal using a vanilla JS script 4:04 đŠī¸ 30 Angular Universal on Google Cloud Run Deploy to Angular Universal to Google Cloud Run and connect it to Firebase Hosting 5:55
