Jotai, now with Optics

This page summarizes the projects mentioned and recommended in the original post on

Our great sponsors
  • SurveyJS - A Non-Cloud Alternative to Google Forms that has it all.
  • Amplication - open-source Node.js backend code generator
  • Appwrite - The open-source backend cloud platform
  • Sonar - Write Clean JavaScript Code. Always.
  • InfluxDB - Collect and Analyze Billions of Data Points in Real Time
  • Mergify - Updating dependencies is time-consuming.
  • optics-ts

    Type-safe, ergonomic, polymorphic optics for TypeScript

    Fast forward to now and we are learning more about Jotai, a Recoil alternative from Poimandres ( creators of react-three-fiber, etc.). Needless to say, we were very excited when we stumbled upon Jotai Issue #44, a discussion concerning focusable atoms started by Meris Bahtijaragic and the compelling work that resulted, jotai-optics. This code wraps another library we have been very intrigued by as of late, optics-ts which provides a whole new level of typesafe, functional goodness.

  • joeflix

    A Netflix clone using React, React Router, Recoil and React Query.

    For this exercise, we thought it might be fun to upgrade Diogo Gancalves' cool Joeflix app to JotaiFlix!

  • SurveyJS

    A Non-Cloud Alternative to Google Forms that has it all.. SurveyJS JavaScript libraries allow you to easily set up a robust form management system fully integrated into your IT infrastructure where users can create and edit multiple dynamic JSON-based forms in a no-code form builder. Learn more now.

  • jotai-devtools

    Redux Devtools integrations for jotai.

    NOTE: This sample code includes Jotai Dev Tools so be sure to use a Redux DevTools Browser Extension to easily observe the relevant state changes. For more info, please see our previous article.

  • Lets talk about what is happening here. In short, we use a jotai-optics wrapped optics-ts isomorphism to transform the internally passed atom collection passed by the outer focus call.

  • focal

    Program user interfaces the FRP way.

    More and more functional paradigms have been finding their way into our contracting work. This really accelerated when we started using React Hooks a while back. In fact, back in the day, we were tasked to convert a legacy Angular ThreeJS project we had written earlier to React / react-three-fiber for performance, ease of maintenance, etc. Given the increasing complexity, we wanted a more atomic, composable state management system (of course this was before Recoil had been introduced). After some due diligence, we settled on Grammarly's Focal. This library, although a bit older, is powerful and introduced us to the intriguing FP concepts of Optics, Lenses, etc

  • jotai-optics

    Jotai integration library for optics-ts

    In order to explore this new functionality, we will use an existing Recoil example. We will not only convert to Jotai, but also add some extra functionality to soft introduce some benefits of jotai-optics (and optics-ts).

NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts