0% completed

All LessonsFree Lessons (3)

Introduction

Introduction to the Course Plan for the Course

Project Planning and Setup

Project Mini-Mek UI Mockups Creating the Initial Project Managing Project Dependencies Redux Setup Adding Hot Module Replacement Further Information

UI Layout and Project Structure

Setting Up the UI Toolkit Initial UI Layout Building a TabBar Component Rendering Tab Panels Thoughts on Folder Structure Absolute Imports and Feature Folders Building the First Content Components Handling Tab State with Redux Further Information

Using Redux-ORM

Intro to Redux-ORM Basic Usage Core Concepts Typical Usage Specialized Behavior Further Information

Loading and Displaying Data

File Structure and Mock APIs Connecting the Unit Info Tab Setting Up Redux-ORM Loading Pilot Data Displaying a List of Pilots Defining Models with Relations Handling Selection Logic

Connected Lists, Forms, and Performance

Connecting List Components Connected Components and Performance Connecting Form Components Pilot Form UI State Further Information

Form Change Handling, Data Editing, and Feature Reducers

Code Cleanup Buffering Form Changes and Dispatches Structuring Reducer Logic for Features Editing Pilot Entries Further Information

Form Draft Data Management

Adding Entity CRUD Reducers

Implementing Pilot Deletion

Managing Draft Data for Forms

Generic Reducer Logic for Editing Entities

Using Draft Data for Editing Pilots

Saving Form Edits

Resetting and Canceling Form Edits

Further Information

Managing Modals and Context Menus

Adding Modal Dialog Support Making Modals Stackable Creating a ColorPicker Dialog Connecting the ColorPicker Dialog Making the ColorPicker Dialog Reusable Designing a Context Menu System Building the Context Menu System Adding a Context Menu to the Pilots List Further Information

Wrapping Up

What Was Covered Next Steps

Practical Redux/

...

/

Generic Reducer Logic for Editing Entities

Generic Reducer Logic for Editing Entities

We'll cover the following...

Before we create the actual core reducer logic, we’ll add some utility functions to encapsulate behavior. We’ll have a small function to update state.entities, and another to update state.editingEntities. We’ll also create a small function to access a given Redux-ORM Model instance, and ask it to copy its entire contents into a plain JS object:

...