DevDays Europe 2021

Devlin Duldulao

Position: Full-stack Cloud Developer

Company: inmeta

Country: Norway

Biography

Devlin Duldulao is a Filipino full-stack cloud engineer based in Norway. He is a Microsoft MVP, an Auth0 Ambassador, a trainer, a conference speaker, an author, and a senior consultant at Inmeta. He loves going to universities and user groups to share his expertise.

Workshop

NgRx State Management in Angular

Learn how to use NgRx to solve complex managing of states in large Angular applications. You will be using NgRx, a library that uses Redux design patterns and Rxjs library, pragmatically. Alongside using NgRx are enterprise Angular architecture, Reactive Forms, and Angular Material.

Agenda

Step-by-step process of learning NGRX in Angular

  • Part 1: NgRx fundamentals:
    • Getting started with NgRx
    • Setting up NgRx
    • Writing an action type, effect, and reducer
    • Configuring a store
  • Part 2: CRUD in NgRx:
    • Writing a selector and using a selector in a component
    • Using a dispatcher in a component
    • Deleting an object with and without a side effect
    • Adding, and updating an object with a side effect
  • Part 3: Exercise:
    • Implementation of NgRx using what you have learned
    • Code reviews of the exercise
Objectives

This workshop’s main goal is to teach you how to properly use a state management library in general. You don’t have to put all your state in a store. In this workshop, you will know some use cases of making a state globally accessible and use cases where a local state does not need to be included in a global state or store. This will help you write large Angular apps in the future and help you find more job opportunities by leveling up your skill.

Target audience

This workshop is for developers who have tried Angular or have experienced building Angular apps and how to manage to reflect and sync states between deeply nested components.

Technical requirements

Latest VS Code, latest Nodejs runtime lts version, Chrome browser, npm cli, and Angular cli.

« Back