MobX quick start guide : supercharge the client state in your React apps with MobX / Pavan Podila, Michel Weststrate.

Format:

Book

Author/Creator:

Podila, Pavan, author.

Weststrate, Michel, author.

Language:

English

Subjects (All):

JavaScript (Computer program language).

Web applications.

Application software--Development.

Application software.

Information technology--Management.

Information technology.

Physical Description:

1 online resource (228 pages) : illustrations

Edition:

1st edition

Place of Publication:

Birmingham ; Mumbai : Packt Publishing, 2018.

System Details:

text file

Biography/History:

Podila Pavan: Pavan Podila has been building frontend applications since 2001 and has used a variety of tools, technologies, and platforms, from Java Swing, WPF with. Net/C#, Cocoa on macOS and iOS, to the web platform with frameworks like React and Angular. He has been working with React since 2013 and MobX since 2016. He is a colead of the Interactive Practice at Publicis. Sapient, where he builds large financial apps for web and mobile platforms. Earlier, he was a Microsoft MVP for client application development (2008-2011), a published author of WPF Control Development Unleashed (Addison-Wesley). He created QuickLens, a Mac App for UI designers/developers, and authored several articles and video courses on Tuts+. Pavan is a Google Developer Expert (GDE) for web technologies and currently authors courses on The UI Dev. He is a regular speaker at meetups, conferences, and workshops. When time permits, you can find him sketching on iPad or playing Ping-Pong. Weststrate Michel: Michel Weststrate (Msc) is tech lead and open source evangelist at Mendix. He has been active as both a frontend and backend developer in different stacks. An occasional speaker at software conferences, he has authored video courses on egghead. Intrigued by several (transparent) reactive programming libraries, he researched and worked on making the ReactJS framework more reactive while addressing predictability and maintainability constraints in other solutions. This led to mobservable (nowadays MobX), which was quickly adopted at Mendix. He's very active in the open source software community, and he authored MobX, Immer, and several small libraries, and coauthored MobX-state-tree.

Summary:

Apply functional Reactive programming for simple and scalable state management with MobX Key Features The easiest way to learn MobX to enhance your client-side state-management Understand how the concepts and components fit together Work through different state management scenarios with MobX Book Description MobX is a simple and highly scalable state management library in JavaScript. Its abstractions can help you manage state in small to extremely large applications. However, if you are just starting out, it is essential to have a guide that can help you take the first steps. This book aims to be that guide that will equip you with the skills needed to use MobX and effectively handle the state management aspects of your application. You will first learn about observables, actions, and reactions: the core concepts of MobX. To see how MobX really shines and simplifies state management, you'll work through some real-world use cases. Building on these core concepts and use cases, you will learn about advanced MobX, its APIs, and libraries that extend MobX. By the end of this book, you will not only have a solid conceptual understanding of MobX, but also practical experience. You will gain the confidence to tackle many of the common state management problems in your own projects. What you will learn Explore the fundamental concepts of MobX, such as observables, actions, and reactions Use observables to track state and react to its changes with validations and visual feedback (via React Components) Create a MobX observable from different data types Define form data as an observable state and tackle sync and async form validations Use the special APIs to directly manipulate observables, tracking its changes, and discovering the reasons behind a change Tackle any state management issue you may have in your app by combining mobx-utils and mobx-state-tree Explore the internals of the MobX reactive system by diving into its inner workings Who this book is for This book is for web developers who want to implement easy and scalable state management for their apps. Knowledge of HTML, CSS, and JavaScript is assumed Downloading the example code for this book You can download the example code files for all Packt books you have purchased from your account at http://www.PacktPub.com. If you purchased this book elsewhere, you can visit http://www.PacktPub.com/support and register to have the files e-mailed directly to you.

Contents:

Cover

Title Page

Copyright and Credits

Dedication

Packt Upsell

Foreword

Contributors

Table of Contents

Preface

Chapter 1: Introduction to State Management

The client state

Handling changes in state

The side effect model

A speed tour of MobX

An observable state

Observing the state changes

It's time to take action

A comparison with Redux

Redux in a nutshell

MobX versus Redux

Summary

Chapter 2: Observables, Actions, and Reactions

Technical requirements

Observables

Creating observables

Observable arrays

Observable maps

A note on observability

The computed observable

Better syntax with decorators

Actions

Enforcing the use of actions

Decorating actions

Reactions

autorun()

reaction()

A reactive UI

when()

when() with a promise

Quick recap on reactions

Chapter 3: A React App with MobX

The book search

Observable state and actions

Managing the async action

The Reactive UI

Getting to the store

The SearchTextField component

The ResultsList component

Chapter 4: Crafting the Observable Tree

The shape of data

Controlling observability

Using @decorators

Creating shallow observables with @observable.shallow

Creating reference-only observables with @observable.ref

Creating structural observables with @observable.struct

Using the decorate() API

Decorating with observable()

Extending the observability

Derived state with @computed

Structural equality

Modeling the stores

Observable state

Derived state

Chapter 5: Derivations, Actions, and Reactions

Derivations (computed properties)

Is it a side effect?

There's more to computed().

Error handling inside computed

Why an action?

Async actions

Wrapping with runInAction()

flow()

Configuring autorun() and reaction()

Options for autorun()

Options for reaction()

When does MobX react?

The rules

Chapter 6: Handling Real-World Use Cases

Form validation

The interactions

Modeling the observable state

Onto the actions

Completing the triad with reactions

React components

The UserEnrollmentForm component

Other observer components

Page routing

The Cart checkout workflow

A route for a step, a step for a route

The WorkflowStep

Actions and reactions of the workflow

Loading a step

The HistoryTracker

The React components

The TemplateStepComponent

The ShowCart component

A state-based router

Chapter 7: Special API for Special Cases

Direct manipulation with the object API

Granular reads and writes

From MobX to JavaScript

Watching the events flow by

Hooking into the observability

Lazy loading the temperature

Gatekeeper of changes

Intercepting the change

observe() the changes

Development utilities

Using spy() to track the reactivity

Tracing a reaction

Visual debugging with mobx-react-devtools

A few other APIs

Querying the reactive system

Probing deeper into the reactive system

Chapter 8: Exploring mobx-utils and mobx-state-tree

The utility functions of mobx-utils

Visualizing async-operations with fromPromise()

Using lazyObservable() for deferred updates

A generalized lazyObservable() with fromResource()

A view model to manage edits

There is lot more to discover

An opinionated MobX with mobx-state-tree.

Models - properties, views, and actions

Defining actions on the model

Creating derived information with views

Fine-tuning primitive types

Composing trees

References and identifiers

Referencing by types.identifier() and types.reference()

Out-of-the-box benefits of declarative models

Immutable snapshots

JSON patches

Middlewares

Further reading

Chapter 9: Mobx Internals

A layered architecture

The Atom

Reading atoms at runtime

Creating an Atom

The atomic clock example

ObservableValue

ComputedValue

Efficient computation

Derivation

The cycle of derivation

Exception handling

The API layer

Transparent functional reactive programming

It is Transparent...

It is reactive...

It is functional...

Value Oriented Programming

Other Books You May Enjoy

Index.

Notes:

Includes bibliographical references.

Description based on print version record.

ISBN:

9781789348972

1789348978

OCLC:

1048776374