Valtio Lightweight Proxy-Based State Management for React.png

In this course, you will learn to use Valtio, a small but powerful state management library for React applications. By just learning the basics, you can create a global state instantly in React.

To kick things off, you’ll start by creating view and app components and learn how to edit them. Once you have some of the basics down, you will run through creating a ToDo list. Lastly, you will drill down into some of the patterns for creating and using state within React.

By the end of this course, you will have a great new library to add to your React applications.

Valtio: Lightweight Proxy-Based State Management for React

Valtio itself provides basic functions `proxy` and `useSnapshot`. It's up to developers to decide how to organize a state object and actions.

Let's look at some patterns to create a simple `store.js`.

As an example, we use a tiny app with one `Counter` and one `TextBox`.

# State object and action functions

This is what we saw in the previous lesson.
 

```js

const state = proxy({
  count: 0,
  text: 'hello',
});

const increment = () => {
  state.count += 1;
};

const setText = (text) => {
  state.text = text;
};
```

Now, let’s run the application:

Learn some patterns to create state and actions in Valtio.

__default

Various Patterns for Creating State and Actions

State object and action functions