parsedData를 콘솔에 찍으면 나오질 않고 있습니다.

안녕하세요.

강의 24분쯤의 내용입니다.

parsedData를 콘솔에 찍으면 아무것도 나오지 않고 있습니다.
Application에 로컬스토리지에 보면 4개의 데이터가 잘 저장되어있는데요.

인강을 몇번 돌려 봐도 계속 그런 상태인데 제가 뭐 놓치고 있는게 있을까요?

function reducer(state, action) {
  let nextState;

  switch (action.type) {
    case "INIT":
      return action.data;
    case "CREATE": {
      nextState = [action.data, ...state];
      break;
    }
    case "UPDATE": {
      nextState = state.map((item) =>
        String(item.id) === String(action.data.id) ? action.data : item
      );
      break;
    }
    case "DELETE": {
      nextState = state.filter((item) => String(item.id) !== String(action.id));
      break;
    }
    default:
      return state;
  }
  localStorage.setItem("dairy", JSON.stringify(nextState));
  return nextState;
}

export const DiaryStateContext = createContext();
export const DiaryDispatchContext = createContext();

function App() {
  const [data, dispatch] = useReducer(reducer, []);
  const idRef = useRef(0);

  useEffect(() => {
    const storedData = localStorage.getItem("diary");

    if (!storedData) {
      return;
    }

    const parsedData = JSON.parse(storedData);
    console.log(parsedData);
  }, []);