rsnext/examples/with-jotai
Mathis Møller 8a80b0b357
Examples: Jotai (#27940)
## Documentation / Examples

- [X] Make sure the linting passes

This adds an example using Jotai with Next.js. It uses the new hook `useHydrateAtoms` to hydrate atoms with values from the server.
2021-08-14 04:06:49 +00:00
..
pages Examples: Jotai (#27940) 2021-08-14 04:06:49 +00:00
public Examples: Jotai (#27940) 2021-08-14 04:06:49 +00:00
styles Examples: Jotai (#27940) 2021-08-14 04:06:49 +00:00
.gitignore Examples: Jotai (#27940) 2021-08-14 04:06:49 +00:00
next-env.d.ts Examples: Jotai (#27940) 2021-08-14 04:06:49 +00:00
next.config.js Examples: Jotai (#27940) 2021-08-14 04:06:49 +00:00
package.json Examples: Jotai (#27940) 2021-08-14 04:06:49 +00:00
README.md Examples: Jotai (#27940) 2021-08-14 04:06:49 +00:00
tsconfig.json Examples: Jotai (#27940) 2021-08-14 04:06:49 +00:00

Jotai example

This example shows how to integrate Jotai in Next.js.

  • Jotai is a primitive and flexible state management library for React.
  • Jotai is TypeScript oriented and aims to expose a minimalistic API for dealing with state in a data-flow graph way.
  • Jotai uses the useHydrateAtoms hook to hydrate the value of an atom, for values that come from the server.

Preview

Preview the example live on StackBlitz:

Open in StackBlitz

Deploy your own

Deploy the example using Vercel:

Deploy with Vercel

How to use

Execute create-next-app with npm or Yarn to bootstrap the example:

npx create-next-app --example with-jotai with-jotai-app
# or
yarn create next-app --example with-jotai with-jotai-app

Deploy it to the cloud with Vercel (Documentation).