illustration for Getting Started with Recoil in React
Course

Getting Started with Recoil in React

  2. 2
    Create Shared State with Recoil in a React App
    3m 40s

Create Shared State with Recoil in a React App

Chris Achard
InstructorChris Achard
Share this video with your friends

Social Share Links

Send Tweet
Published 5 years ago
Updated 3 years ago

We'll create a new bit of shared state (called an "atom" in Recoil) by importing atom from Recoil and setting a unique key and default value:

import {
  atom
} from 'recoil'

const gameScore = atom({
  key: 'gameScore',
  default: 0
})

Then we can use that gameScore by calling the Recoil hook useRecoilState

import {
  useRecoilState
} from 'recoil'

...

  const [score, setScore] = useRecoilState(gameScore)

That looks a lot like a local useState call - but is different because it creates the state in Recoil, which can then be used in this component, or in any other component in the tree (underneath the same RecoilRoot)

View code for this lesson
egghead
egghead

Member comments are a way for members to communicate, interact, and ask questions about a lesson.

The instructor or someone from the community might respond to your question Here are a few basic guidelines to commenting on egghead.io

Be on-Topic

Comments are for discussing a lesson. If you're having a general issue with the website functionality, please contact us at support@egghead.io.

Avoid meta-discussion

  • This was great!
  • This was horrible!
  • I didn't like this because it didn't match my skill level.
  • +1 It will likely be deleted as spam.

Code Problems?

Should be accompanied by code! Codesandbox or Stackblitz provide a way to share code and discuss it in context

Details and Context

Vague question? Vague answer. Any details and context you can provide will lure more interesting answers!

Markdown supported.
Become a member to join the discussionEnroll Today