이 코드에서는 todosStorage라는 객체를 만들어 해당 객체 내부에 get과 set 메서드를 만들어줬습니다. 추가로 데이터를 불러오거나 저장할 때 사용하는 key 값은 따로 상단에서 상수로 선언해 추후 손쉽게 바꿀 수 있도록 준비해줬습니다.

코드를 작성한 뒤, todosStorage를 App 컴포넌트에서 불러와 사용하세요.

App.js

(...)
import todosStorage from './storages/todosStorage';

function App() {
  const today = new Date();

  const [todos, setTodos] = useState([
    {id: 1, text: '작업환경 설정', done: true},
    {id: 2, text: '리액트 네이티브 기초 공부', done: false},
    {id: 3, text: '투두리스트 만들어보기', done: false},
  ]);

  useEffect(() => {
    todosStorage
      .get()
      .then(setTodos)
      .catch(console.error);
  }, []);

  useEffect(() => {
    todosStorage.set(todos).catch(console.error);
}, [todos]);

App 컴포넌트에서는 더 이상 AsyncStorage를 사용하지 않으므로 import 코드를 지워주세요. 그리고 todosStorage를 불러온 다음 useEffect에서 get과 set 메서드를 사용할 때 이번에는 async 함수를 따로 선언하지 않고 Promise를 그대로 사용했습니다. 데이터를 불러오는 부분에서 .then(setTodos)라고 코드를 작성했는데, 데이터를 불러오고 나서 그 결과물을 setTodos의 함수 인자로 넣어 호출하겠다는 의미입니다.

코드를 저장하고, iOS와 안드로이드에서 둘 다 잘 작동하는지 확인해보세요.