Udemy
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
Development
Web Development Data Science Mobile Development Programming Languages Game Development Database Design & Development Software Testing Software Engineering Development Tools No-Code Development
Business
Entrepreneurship Communications Management Sales Business Strategy Operations Project Management Business Law Business Analytics & Intelligence Human Resources Industry E-Commerce Media Real Estate Other Business
Finance & Accounting
Accounting & Bookkeeping Compliance Cryptocurrency & Blockchain Economics Finance Finance Cert & Exam Prep Financial Modeling & Analysis Investing & Trading Money Management Tools Taxes Other Finance & Accounting
IT & Software
IT Certification Network & Security Hardware Operating Systems Other IT & Software
Office Productivity
Microsoft Apple Google SAP Oracle Other Office Productivity
Personal Development
Personal Transformation Personal Productivity Leadership Career Development Parenting & Relationships Happiness Esoteric Practices Religion & Spirituality Personal Brand Building Creativity Influence Self Esteem & Confidence Stress Management Memory & Study Skills Motivation Other Personal Development
Design
Web Design Graphic Design & Illustration Design Tools User Experience Design Game Design Design Thinking 3D & Animation Fashion Design Architectural Design Interior Design Other Design
Marketing
Digital Marketing Search Engine Optimization Social Media Marketing Branding Marketing Fundamentals Marketing Analytics & Automation Public Relations Advertising Video & Mobile Marketing Content Marketing Growth Hacking Affiliate Marketing Product Marketing Other Marketing
Lifestyle
Arts & Crafts Beauty & Makeup Esoteric Practices Food & Beverage Gaming Home Improvement Pet Care & Training Travel Other Lifestyle
Photography & Video
Digital Photography Photography Portrait Photography Photography Tools Commercial Photography Video Design Other Photography & Video
Health & Fitness
Fitness General Health Sports Nutrition Yoga Mental Health Dieting Self Defense Safety & First Aid Dance Meditation Other Health & Fitness
Music
Instruments Music Production Music Fundamentals Vocal Music Techniques Music Software Other Music
Teaching & Academics
Engineering Humanities Math Science Online Education Social Science Language Teacher Training Test Prep Other Teaching & Academics
AWS Certification Microsoft Certification AWS Certified Solutions Architect - Associate AWS Certified Cloud Practitioner CompTIA A+ Cisco CCNA Amazon AWS CompTIA Security+ AWS Certified Developer - Associate
Graphic Design Photoshop Adobe Illustrator Drawing Digital Painting InDesign Character Design Canva Figure Drawing
Life Coach Training Neuro-Linguistic Programming Mindfulness Personal Development Personal Transformation Meditation Life Purpose Emotional Intelligence Neuroscience
Web Development JavaScript React CSS Angular PHP WordPress Node.Js Python
Google Flutter Android Development iOS Development Swift React Native Dart Programming Language Mobile Development Kotlin SwiftUI
Digital Marketing Google Ads (Adwords) Social Media Marketing Google Ads (AdWords) Certification Marketing Strategy Internet Marketing YouTube Marketing Email Marketing Retargeting
SQL Microsoft Power BI Tableau Business Analysis Business Intelligence MySQL Data Modeling Data Analysis Big Data
Business Fundamentals Entrepreneurship Fundamentals Business Strategy Online Business Business Plan Startup Blogging Freelancing Home Business
Unity Game Development Fundamentals Unreal Engine C# 3D Game Development C++ 2D Game Development Unreal Engine Blueprints Blender
30-Day Money-Back Guarantee
Development Web Development Angular

NgRx (with NgRx Data) - The Complete Guide (FREE E-Book)

Learn the modern NgRx Ecosystem, including NgRx Data, Store, Effects, Router Store, NgRx Entity, and DevTools
Rating: 4.6 out of 54.6 (2,618 ratings)
11,047 students
Created by Angular University
Last updated 3/2021
English
English [Auto]
30-Day Money-Back Guarantee

What you'll learn

  • Code in Github repository with downloadable ZIP files per section
  • Become familiar with the centralized store pattern, and how to use it in Angular
  • Know when to use a centralized store solution and why
  • Learn how to use NgRx Data to handle entity data with minimal code
  • Learn In-depth NgRx Store, understand in detail all core store patterns, including Reducers and Actions
  • Learn in detail NgRx Effects, learn when to use a side-effect
  • Learn in detail NgRx Entity, when to use and why, learn what are the benefits
  • Transform step-by-step an existing Angular plain application, and turn it into a store based application
  • Learn to implement common functionality in NgRx, such as Authentication or Entity Pagination
  • Learn NgRx in-depth in a fun and practical way, by implementing real use cases
Curated for the Udemy for Business collection

Course content

7 sections • 52 lectures • 6h 17m total length

  • Preview06:36
  • IMPORTANT - Recommended Software Versions
    00:14
  • Preview08:03
  • Preview03:20
  • Preview11:46
  • Preview07:17

  • Preview08:16
  • The Store Service API - Implementing the Login Screen
    07:28
  • Defining NgRx Actions using Action Creators
    11:09
  • Grouping Actions Together with Action Types
    03:44
  • NgRx Reducers - Step-by-Step Implementation
    08:55
  • Key Concepts Summary - NgRx Actions and Reducers In Action
    06:00

  • How to Query the Store Data - An Example
    12:37
  • NgRx Selectors - An In-Depth Explanation
    12:00
  • NgRx Feature Selectors - a Simple Explanation
    04:55
  • Implementing User Logout (Practice Lesson )
    04:30
  • Implementing a Router Authentication Guard (Practice Lesson)
    08:12
  • Introduction to NgRx Effects - What is a Side Effect?
    05:49
  • Understanding NgRx Effects - A Simple Example
    07:16
  • NgRx Effects - Step-by-Step Implementation
    08:38
  • Implementing the Logout Effect (Practice Lesson)
    06:52

  • Setting up NgRx Router Store and the Time-Travelling Debugger
    10:33
  • NgRx Runtime Checks - How do they work?
    08:30
  • NgRx Metareducers - Step-by-Step Implementation
    06:49

  • NgRx Entity - Section Kickoff
    03:35
  • NgRx Feature Design - Defining Actions First
    06:07
  • Loading NgRx Entity Data using a Router Resolver
    10:17
  • NgRx Effects - Fetching Data From the Backend
    06:56
  • Understanding the NgRx Entity Format
    05:53
  • Implementing Reducers Using the NgRx Entity Adapter
    08:11
  • NgRx Entity Selectors - Refactoring the Home Component
    10:07
  • Entity Adapter Configuration - Understanding sortComparer and selectId
    04:25
  • NgRx Data Fetching Solution - How to Load Data Only If Needed
    10:33
  • Optimistically Editing Entity Data - The Edit Course Dialog
    10:42
  • Optimistic Data Editing - Reducer Implementation and Demo
    04:06
  • Optimistic Data Editing - Saving Data in the background with an Effect
    06:00

  • Why NgRx Data? New Section Introduction
    05:53
  • Setting Up NgRx Data in a Lazy Loaded Module
    08:23
  • How Does NgRx Data Work? Transparent Fetching Data In Action
    09:11
  • NgRx Custom Data Service - Fetching Data From the Backend
    11:20
  • Controlling Data Loading with the NgRx Data loaded flag
    05:18
  • Querying Store Data with NgRx Data and the entities$ Observable
    08:16
  • NgRx Data CRUD - Why use Optimistic Updates?
    13:22
  • NgRx Data CRUD - Why Pessimistic Data Creation?
    06:43
  • NgRx Data CRUD - Optimistic Delete Implementation
    07:08
  • Setting Up a new Entity - The Lesson Entity
    03:42
  • Implementing the Course Component Using NgRx Data
    05:15
  • Lessons Pagination using NgRx Data
    12:12
  • Switching an NgRx Application to OnPush Change Detection
    06:38

  • Preview02:17
  • Bonus Lecture
    01:26
  • Preview04:28

Requirements

  • Just a little bit of Angular and Typescript

Description

This course is a complete guide to the new NgRx Ecosystem, including NgRx Data, Store, Effects, Router Store, NgRx Entity, and DevTools, and comes with a running Github repo

This Course in a Nutshell

State management is the number one topic to know when it comes to frontend architecture design choices. Why choose to do state management in a single page application, when to do it and why, what are the benefits, and what are tradeoffs?

These are all critical questions that we will address in this course, as we give you an extended guided tour of the NgRx Ecosystem.

The most popular state management library in the Angular space is NgRx, and for good reasons. The latest release of NgRx is probably one of the most important releases in the whole Angular ecosystem recently. Although backward compatible, it contains so much new functionality that it's almost a brand new state management library.

Under the hood, the core concepts of Actions, Reducers, Effects, Entities, and Selectors remain the same, but we have now a brand new API for managing these concepts in a much less verbose way. Also, we have the inclusion of NgRx Data, which is a new and very powerful way of managing Entity Data.

Actually, NgRx Data is a powerful abstraction layer on top of NgRx, that allows us to add state management to large parts of our application without having to write much code at all!

Course Overview

In this course, we are going to take a small existing application that is built without any state management. We are going to understand what are the consequences of not doing state management by identifying some problems that the application has in its initial form.

Then we are going to start refactoring the application, and we are going to add state management to the application multiple screens step-by-step. We are going to start with the Authentication features of the application, and then we are going to move on to the entity data management part.

We are going to explain at length all the key concepts of NgRx: Actions, Reducers, Effects, and Selectors, and we are going to explain in detail the Store architecture itself and understand its benefits.

Throughout the course we are going to introduce step-by-step and explain in detail the NgRx Store module, NgRx Effects, we are going to cover in detail NgRx Entity and the Entity format, we are going to install and do a guided tour of the NgRx Dev Tools, the NgRx Router Store, and the time-travelling debugger.

We are also going to learn how to make the most out of NgRx Data, and learn how to customize it in order to manage entity data with minimal application code. We will cover NgRx while keeping in mind best practices like good Action hygiene.

Table of Contents

This course covers the following topics:

  • Introduction to State Management

  • The Store Architecture In Detail

  • NgRx Key Concepts

  • Actions and Action Creators

  • Reducers

  • NgRx Effects

  • Selectors

  • Adding Authentication to an NgRx Application

  • NgRx Entity and the Entity Format

  • NgRx DevTools

  • NgRx Time Travelling Debugger

  • NgRx Runtime checks and Store Immutability

  • NgRx Router Store

  • NgRx Data and Entity State Management

  • NgRx Best Practices

What Will You Learn In this Course?

At the end of this course, you will feel comfortable with the notions of state management and the centralized store solution in general.

You will feel comfortable designing new Applications using NgRx, using a simple methodology and you will know in-depth the complete Ngrx library ecosystem: including the Ngrx Store, Effects, Entity, and NgRx Data libraries.

You will know how to quickly scaffold parts of the solution using Ngrx Schematics, and how to set up the Ngrx DevTools from scratch, including the router integration.

Who this course is for:

  • Angular Developers looking to learn in-depth the modern NgRx Ecosystem, including Ngrx Store, Effects, Router Store, Ngrx Entity, DevTools and Schematics!

Featured review

Thendokhae Makahane
Thendokhae Makahane
35 courses
14 reviews
Rating: 4.5 out of 5a year ago
The course is really good it goes in depth with implementing complex functionality using NgRx. But if someone does not have a basic understanding of NgRx they might be a bit lost with all the different available functions within the NgRx module. All in all i learnt a lot from the course.

Instructor

Angular University
Best Selling Angular Courses | 95,000+ students | 16 courses
Angular University
  • 4.5 Instructor Rating
  • 15,838 Reviews
  • 102,762 Students
  • 17 Courses

About the Angular University:

The Angular University aims to be the one place that you go in order to learn and keep up with the whole Angular ecosystem. We provide premium quality video tutorials, screencast style.

No matter if you are a beginner, intermediate or advanced in Angular, we have several courses for you.

About the course instructor:

Hello, my name is Vasco  and I'm a Software Developer with 17 years of experience, very seasoned building user interfaces with Angular. I've worked as a Frontend Developer/Architect in a large variety of enterprise projects throughout the years.   

I worked on a ton of projects, everything from single page applications to help build the European Criminal Record Information Exchange System, to brand new e-banking portals, to corporate banking portals, and more. I've been a key part of internal framework teams that built frameworks for in-house departments of tens of developers.

I also love to teach, write and talk about technology.  I am looking forward to be your Angular instructor,

Kind Regards,

Vasco

  • Udemy for Business
  • Teach on Udemy
  • Get the app
  • About us
  • Contact us
  • Careers
  • Blog
  • Help and Support
  • Affiliate
  • Impressum Kontakt
  • Terms
  • Privacy policy
  • Cookie settings
  • Sitemap
  • Featured courses
Udemy
© 2021 Udemy, Inc.