Video description
This course will take you on a journey where you'll you will learn to build a real Angular app using Angular, Angular Material, AngularFire (+ Firebase with Firestore), and NgRx. Angular is an amazing frontend framework with which you can build powerful web applications; we will add real-time database functionalities and see our updates almost before we make them here. This course offers a brief refresher on Angular, a detailed introduction into Angular Material, and a realistic app that uses many Angular Material components.
What You Will Learn
- Build amazing Angular apps with modern tools such as Material, NgRx, and AngularFire
- Build real-time apps that not only work great but also look awesome
- A realistic app that uses many Angular Material components
- Examples of components such as Datepickers, Sidenavs, or the Material Data Table (incl. sorting, filtering, and live updating!
- A real-time database connection powered by Firebase (using Firestore) and AngularFire
- A better understanding of RxJS observables
- State-of-the-art state management with the help of NgRx
Audience
This course is designed for those who want to delve into Angular and build a real app with it, those who want to practice Angular, who want a practical guide to building Angular apps, and those who are interested in using Firebase, NgRx, and/or Angular Material.
About The Author
Academind by Maximilian Schwarzmüller:
Academind GmbH
Bundling the courses and the knowledge of successful instructors, Academind strives to deliver high-quality online education. The platform covers topics such as web development, data analysis, and more in a fun and engaging way.
Maximilian Schwarzmüller
Since the age of 13, he has never stopped learning new programming skills and languages. In his early days, he started creating websites simply for fun. This passion has remained and shaped his decision to work as a freelance web developer and consultant. Although he started web development on the backend (PHP with Laravel and NodeJS), he has progressed to becoming a front-end developer using modern frameworks such as React, Angular, and VueJS 2 in many projects.
The most rewarding experience for him is to see how people find new and better jobs, build exciting web applications, acquire amazing projects, or simply enjoy their hobby with the help of his content.
Publisher resources
Table of contents
- Chapter 1 : Getting Started
- Chapter 2 : A Brief Angular Refresher (OPTIONAL)
-
Chapter 3 : Angular Material
- Module Introduction
- Understanding Angular Material Components
- Adding Angular Material to a Project
- Stay Up To Date!
- Our First Angular Material Component - The Button
- Creating the Course App Structure
- Working on The Signup Form
- Flexbox - A Quick Refresher
- Controlling the Layout with @angular/flex-layout
- Adding Configuring the Submit Button
- Implementing Hints and Validation Errors (on Forms)
- Adding a Datepicker
- Restricting Pickable Dates
- Adding a Checkbox
- Finishing the Form with Style
- Wrap Up
-
Chapter 4 : Diving Deeper into Angular Material
- Module Introduction
- Adding Navigation a Sidenav
- Working on the Sidenav and Toolbar
- Styling the Sidenav
- Making the Page Responsive
- Adding Navigation Items
- Splitting the Navigation Into Components
- Working on the Welcome Screen
- Adding a Tabs Component
- Adding some "Cards"
- Adding a Dropdown Menu
- Adding a Spinner to the Training Screen
- Adding a Nice Exercise Timer
- Adding a Cancel Dialog Screen
- Passing Data to the Dialog
- Adding "Exit" and "Continue" Options
- Wrap Up
-
Chapter 5 : Working with Data and Angular Material
- Module Introduction
- Important: RxJS 6
- Implementing Authentication
- Routing Authentication
- Route Protection
- Preparing the Exercise Data
- Injecting Using the Training Service
- Setting an Active Exercise
- Controlling the Active Exercise
- Adding a Form to the Training Component
- Handling the Active Training via a Service
- Handling "Complete" and "Cancel" Events
- Adding the Angular Material Data Table
- Adding Sorting to the Data Table
- Adding Filtering to the Data Table
- Adding Pagination to the Data Table
- Wrap Up
-
Chapter 6 : Using Angularfire Firebase
- Module Introduction
- What is Firebase?
- Getting Started with Firebase
- What is Angularfire?
- RxJS Oservables Refresher
- Diving into Firebase
- Listening to Value Changes (of Firestore)
- Listening to Snapshot Changes (of Firestore, incl. Metadata)
- Restructuring the Code
- How Firebase Manages Subscriptions
- Storing Completed Exercises on Firestore
- Connecting the Data Table to Firestore
- Working with Documents
- Adding Real Authentication (Sign Up)
- Adding User Login
- Understanding Authentication in SPAs
- Configuring Firestore Security Rules
- Managing Firestore Subscriptions
- Reorganizing the Code
- Wrap Up
- Chapter 7 : Optimizing the App
-
Chapter 8 : Using NgRx for State Management
- Module Introduction
- What is Redux - An Overview
- NgRx Core Concepts - A First Example
- Working with Multiple Reducers Actions
- Dispatching Actions Selecting State Slices
- Adding an Auth Reducer (and Actions)
- Adding Auth Subscriptions
- Adding the Training Reducer and Actions with Payloads
- Lazy Loaded State
- Dispatching Training Actions
- Selecting Training State
- Selecting Single Values Correctly
- Connecting the Data Table
- Cleaning the Project Up
- Adding a small Bugfix
- Wrap Up
- Chapter 9 : Deploying the App
- Chapter 10 : BONUS: Angular Material Themes
- Chapter 11 : BONUS: Angular Material Themes
Product information
- Title: Angular (Full App) with Angular Material, Angularfire and NgRx
- Author(s):
- Release date: October 2018
- Publisher(s): Packt Publishing
- ISBN: 9781789958829
You might also like
video
Building Web Applications with Firebase
Really great introduction to Firebase and how to use each of its components. Jonathan Wood, Software …
book
Java Coding Problems
Develop your coding skills by exploring Java concepts and techniques such as Strings, Objects and Types, …
book
Refactoring: Improving the Design of Existing Code
Fully Revised and Updated–Includes New Refactorings and Code Examples “Any fool can write code that a …
book
Effective Java, 3rd Edition
Since this Jolt-award winning classic was last updated in 2008, the Java programming environment has changed …