Taming the State in React (The Bare Essentials)
Taming the State in React
Your journey to master Redux and MobX
About the Book
The course turned out to exceed all my expectations. What started as an attempt to write a sole ebook about state management in React with Redux and MobX, turned out into a full blown course with a 250-page ebook, exciting applications and boilerplate projects to get started in learning and building applications with these libraries, and screencast series about implementing React applications from scratch with state management.
The bigger idea was to built a course that gives learners a consistent way to study the topic state management. I had the feeling that there exist way too many, partly inconsistent or outdated, tutorials around these topics and it is hard for learners to choose from so many opportunities. I thought, one well structured course should help newcomers to get started easily in the topic of state management with React's local state, Redux and MobX. Afterward, everyone should be on one well set level to build his/her own applications with Redux or MobX.
What will I learn from the course?
The course teaches you how to use local state in React and scaling React applications with advanced practices, patterns and techniques. Afterward, the ebook dives into learning Redux and MobX as libraries for state management. These libraries are taught from scratch without React but in combination with React later on. However, all these learnings are not necessarily bound to React as view layer library. They can be applied in other view layer (component based) libraries, such as Vue.js, or single page application (SPA) frameworks, such as Angular.js, too. If you are new to React and want to learn React before, I recommend you to read the up to date book The Road to learn React. It has been downloaded by 11.000 people so far, which makes me very proud.
Due to Redux's popularity, the course teaches more about Redux than MobX. But it is planned to grow the MobX part too, because I am really into that library as well. For both state management libraries, Redux and MobX, you will learn to use them standalone, to connect them to React applications in multiple ways, and to apply best practices, patterns and tricks to scale them in larger applications. You will learn about using JavaScript ES6 to keep your state immutable, middleware in Redux, and flat and normalized state structures. Afterward, the terms actions, reducers, store(s), connected components and so on, will not be foreign subjects to you anymore.
After taking the course, I believe you are ready to build your own applications in any (view layer) library or SPA framework of your choice with Redux or MobX. But when using React, you are setup with advanced knowledge about React's local state to use it in larger applications.
What's the content of the course?
The course is divided into three packages. Basically, it boils down into taking the course (1) by reading the 250-page ebook in PDF, EPUB or MOBI and doing all the examples on the way, (2) by reading the book and having access to several exciting applications and boilerplate projects to get started on your own, or (3) by reading the book, getting access to all the source code and watching screencasts series to see me coding applications from scratch and explaining it for you.
For all of the three packages, you can join the Slack Group that was created to build a community around these courses where people help each other. There are already a couple of hundred people in the Slack Group because of my previous ebook about React and it has become a great community for those who want to learn more about it. In addition, when taking the course, you will get a curated list of articles for further readings outside of the ebook to keep yourself updated about these topics.
Why should you take the course?
In the previous part, I have shown the benefits and learnings when taking the course, as well as talked about its content. So why should you believe in the course and my content in the first place?
For the last three years, I worked on larger scale applications using Angular and React with Redux. In my development team, we felt the shortcomings of Angular's state management, implemented our own state management solution when Flux wasn't a thing, but decided to move over to React and Redux eventually. Since it is a larger application, the migration is still ongoing, but while migrating and implementing a lot of features in React and Redux from scratch, there were several challenges ahead to overcome and opportunities to grow with them.
Last year, I started to write heavily about React and JavaScript. Over the time, I had the chance to advance my writing and teaching style due to my readers feedback. End of last year, I published an ebook about learning React from scratch. It got downloaded over 11.000 times which was an overwhelming surprise for me. I received great feedback and it makes me really happy to see how people are making progress in their learnings.
So by now, I believe that I am able to teach things about web development, JavaScript and React in a good way. I hope you believe in this as well. So jump on the train and learn Redux and/or MobX :-)
About the Author
Table of Contents
-
Introduction
- About the Author
-
Requirements
- React
- Editor and Terminal
- Node and NPM
- FAQ
-
How to read the Book
- Tips & Tricks
-
Local State Management
-
Definitions
- Pure Functions
- Immutability
- State
-
Local State in React
- Stateful and Stateless Components
- Props vs. State
- Form State
- Controlled Components
- Unidirectional Data Flow
-
Scaling Local State in React
- Lifting State
- Functional State
- Higher-Order Components
- React’s Context for Provider and Consumer
-
Persistence in State
- Local Storage
- Caching in State
-
Transition to Sophisticated State
- The Controversies of Local State Management
- The Flaw of Local State Management
-
Definitions
-
Redux
-
Basics in Redux
- Action(s)
- Reducer(s)
- Store
- Hands On: Redux Standalone
-
Advanced Actions
- Minimum Action Payload
- Action Type
- Action Creator
- Optional Payload
- Payload Structure
- Hands On: Redux Standalone with advanced Actions
-
Advanced Reducers
- Initial State
- Nested Data Structures
- Combined Reducer
- Clarification for Initial State
- Nested Reducers
- Hands On: Redux Standalone with advanced Reducers
-
Basics in Redux
-
Redux in React
-
Connecting the State
- Hands On: Bootstrap React App with Redux
- Hands On: Naive Todo with React and Redux
-
Connecting the State, but Sophisticated
- Hands On: Sophisticated Todo with React and Redux
- Hands On: Connecting State Everywhere
-
Connecting the State
-
Redux State Structure and Retrieval
- Middleware in Redux
- Immutable State
- Normalized State
-
Selectors
- Plain Selectors
- Denormalize State in Selectors
- Reselect
- Hands On: Todo with Advanced Redux
- Hands On: Todo but more Features
-
Asynchronous Redux
-
Redux Thunk
- Hands On: Todo with Notifications
-
Asynchronous Actions Alternatives
- Redux Saga
- Hands On: Todo with Redux Saga
-
Redux Thunk
-
Redux Patterns, Techniques and Best Practices
- Using JavaScript ES6
- Naming Conventions
- The Relationship between Actions and Reducers
-
Folder Organization
- Technical Folder Organization
- Feature Folder Organization
- Ducks
- Testing
- Error Handling
-
(React in) Redux FAQ
- Redux vs. Local State
- View vs. Entity State
- Accidental vs. Planned State
-
Redux State as Architecture
-
Hands On: Hacker News with Redux
- Part 1: Project Organization
- Part 2: Plain React Components
- Part 3: Apply Styling
- Part 4: Archive a Story
- Part 5: Introduce Redux: Store + First Reducer
- Part 6: Two Reducers
- Part 7: First Action
- Part 8: First Selector
- Part 9: Re-render View
- Part 10: First Middleware
- Part 11: First Action Creator
- Part 12: Connect React with Redux
- Part 13: Lift Connection
- Part 14: Interacting with an API
- Part 15: Separation of API
- Part 16: Error Handling
- Part 17: Testing
- Final Words
-
Hands On: Hacker News with Redux
-
Redux Ecosystem Outline
- Redux DevTools
- Connect Revisited
- Concise Actions and Reducers
- React Redux Libraries
- Routing with Redux
- Typed Redux
- Server-side Redux
-
MobX
-
Introduction
- Observable State
- Autorun
- Actions
- Computed Values
-
Introduction
-
MobX in React
- Local State
- Scaling Reactions
- Inject Stores
-
Advanced MobX
- Other Reactions
- Be Opinionated
- Alternative to Redux?
- Beyond Redux and MobX
-
Last but not Least
- Further Learning Paths
- Never stop Learning
- Acknowledgements
- Thank You
The Leanpub 60 Day 100% Happiness Guarantee
Within 60 days of purchase you can get a 100% refund on any Leanpub purchase, in two clicks.
Now, this is technically risky for us, since you'll have the book or course files either way. But we're so confident in our products and services, and in our authors and readers, that we're happy to offer a full money back guarantee for everything we sell.
You can only find out how good something is by trying it, and because of our 100% money back guarantee there's literally no risk to do so!
So, there's no reason not to click the Add to Cart button, is there?
See full terms...
Earn $8 on a $10 Purchase, and $16 on a $20 Purchase
We pay 80% royalties on purchases of $7.99 or more, and 80% royalties minus a 50 cent flat fee on purchases between $0.99 and $7.98. You earn $8 on a $10 sale, and $16 on a $20 sale. So, if we sell 5000 non-refunded copies of your book for $20, you'll earn $80,000.
(Yes, some authors have already earned much more than that on Leanpub.)
In fact, authors have earnedover $13 millionwriting, publishing and selling on Leanpub.
Learn more about writing on Leanpub
Free Updates. DRM Free.
If you buy a Leanpub book, you get free updates for as long as the author updates the book! Many authors use Leanpub to publish their books in-progress, while they are writing them. All readers get free updates, regardless of when they bought the book or how much they paid (including free).
Most Leanpub books are available in PDF (for computers) and EPUB (for phones, tablets and Kindle). The formats that a book includes are shown at the top right corner of this page.
Finally, Leanpub books don't have any DRM copy-protection nonsense, so you can easily read them on any supported device.
Learn more about Leanpub's ebook formats and where to read them
