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

In some requirements, we would need to connect our state outside React. We have two functions exported for this use case: `subscribe` and `snapshot`. Both functions are used internally in `useSnapshot`.


# How to use `subscribe`?

You can get notified if a state is changed with the following snippet:

```js
import { proxy, subscribe } from 'valtio';

const state = proxy({ count: 0 });

subscribe(state, () => {
  console.log('state is mutated!');
});

state.count += 1;
```

You can subscribe to a portion of the state--if the portion is an object--as follows:

```js
subscribe(state.obj, () => {
  console.log('state.obj is mutated!');
});
```

Now, let’s run the modified application:

Learn how to use Valtio to interact with non-React code.

__default

Working outside React