Skip to main content

Tutorial Intro

This section assumes you have installed Recoil and React. See the Getting Started page for how to get started with Recoil and React from scratch. Components in the following sections are assumed to have a <RecoilRoot /> in the parent tree.

In this tutorial, we'll be building a simple todo-list application. Our app will be able to do the following:

  • Add todo items
  • Edit todo items
  • Delete todo items
  • Filter todo items
  • Display useful stats

Along the way, we'll cover atoms, selectors, atom families, and the hooks exposed by the Recoil API.

SideGuide has provided an interactive version of this tutorial with live code samples: https://app.sideguide.dev/recoil/tutorial/