12-2. Recoil -> Jotai 변환 코드 공유합니다.

Recoil 지원 중단 문제로 강의에 나온 Recoil 관련 내용을 Jotai 라이브러리로 대체했습니다.

여러 수강생 분들이 같은 문제를 겪는 듯해서 제가 사용한 코드를 공유합니다.

1. recoil 제거 & jotai 설치

npm uninstall recoil
npm install jotai

2. atom.js 변환 코드

   
   : jotai 의 atom 에선 key 값이 없습니다.

import {atom} from "jotai";

const testState = atom(['a', 'b', 'c', 'd']);

export default testState;

3. testWithComma.js

   
   : 마찬가지로 키 값이 없으며, 좀 더 단순하게 사용 가능합니다.

import {atom} from "jotai";

import testState from "./atom.js";

const testWithComma = atom((get) => {
    const abcdArr = get(testState)
    return abcdArr.join(',');
})

export default testWithComma;

4. CompletionPage.jsx
   : useRecoilValue -> useAtomValue 로 변경하시면 됩니다.

const testValue = useAtomValue(testWithComma);

Jotai 와 Zustand 중 고민하다가 Jotai가 Recoil과 더 유사하다고 하여 우선 Jotai로 학습 진행했습니다. 강의 수강에 참고가 되길 바랍니다.