Michel Weststrate

React bindings for MobX

Create the next immutable state by mutating the current one.

GraphQL and mobx-state-tree are match made in heaven; both are a model first oriented technologies. GraphQL optimizes data fetches and mutations. Adding mobx-state-tree to this mix, makes this model even richer: It allows client only state, actions and derived data to be mixed into our data models.

In this talk I will both reflect on the product and my journey into the Open Source Software world.

Immer is a tiny package that allows you to work with immutable data structures with unprecedented ease. It doesn't require learning new data structures or update APIs, but instead creates a temporarily shadow tree which can be modified using the standard JavaScript APIs. The shadow tree will be used to generate your next immutable state tree. This shadow tree is maintained using Proxies.

Many battles have been fought over what is the best way to do state management. A gazillion of strategies and libraries are out there. So,.. it is time to take one step back. Why is state management relevant in the first place? What problems does it solve? For example, many debates are about mutability or immutability. But then Michel proposed that the more fundamental question to ask is: identities or values? With these concepts in mind, Michel took a look at several libraries and frameworks and recognize the patterns.

Immer is a tiny package that allows you to work with immutable data structures with unprecedented ease. It doesn't require learning new data structures or update APIs, but instead creates a temporarily shadow tree which can be modified using the standard JavaScript APIs. The shadow tree will be used to generate your next immutable state tree. Join this talk to see how to write your reducers in a much more readable way, with half the code and without requiring additional large libraries.

Many teams have been discussing on whether to go the immutable or mutable state route. Flux or MVC or MVVM? Redux, MobX or Apollo? Instead of answering the question, in this talk we will look at JavaScript code on a more fundamental level: How do data structures work in JavaScript. What assumptions can be we make if we treat them to be immutable? Or mutable? How can we express concepts like identities, references, collections, mutations, derivations in either case? And can we bent the rules between the two? This talk will provide you a deeper understanding of the difference between state and data.

React and its component model is nowadays the most appealing abstraction to declaratively describe user interfaces. The core concepts are so powerful that we can apply them outside the DOM, like in React-VR, Sound manipulation, games etc. In this talk I will demonstrate that all the core ideas powering React are so powerful that we can even translate them to a completely different field: state management. MobX-state-tree applies these very same concepts to make data management declarative, elegant and easy to reason about.

Last years there have been great developments in state management libraries. Both Redux and MobX sprung from the React community and provide stand-alone, generic state management solutions. Both have gained big in popularity, and both have their own strengths and weaknesses. What can we learn from both approaches?

"Reactive programming" still sounds scary to many developers. As if it is an elevated way of thinking, only accessible to the chosen few. Nothing is less true! It is the most natural way to look at programming problems. You just might not realize it yet! In this talk, Michel will demonstrate that many complex UI problems, such as form validation and routing, can all be seen as '*actions* that change *facts* which leads to *reactions*'. And as soon as we start distinguishing those concepts in our applications; our code will become more declarative, more concise and less imperative.

At React Amsterdam, you can meet its full-stack lead developer Michel who strongly believes in pragmatic, agile and the-simplest-thing-that-could-possibly-work programming.

A question people ask me regularly: “How do all the new React features (context, hooks, suspense) affect how we build (web) apps in the future? Do they make state management libraries like Redux or MobX obsolete?” With this post, I’ll try to answer that question once and for all!

So, in this blog post I’m just going to highlight the most compelling new features.

Apply functional Reactive programming for simple and scalable state management with MobX

In today’s show, the React Native Radio Host, Nader Dabit and Spencer Carli speak with Michel Weststrate about Immer and MobX state tree. Both libraries are written by Michel. Michel does open source and tech leads about Mendix. Mendix is an enterprise software vender that Michel works for currently. Michel and React Native Radio discuss MobX State Tree and Immer libraries, and other areas of Mendix.

In this course, Michel Westrate - Creator of Mobx - will teach us how to model application state after your problem domain with Mobx-state-tree (MST)

MobX is designed to enable building web applications with a complex data model in an intuitive and very performant manner.