화면부터 API, 데이터와 실행까지 하나의 규칙으로

type Memo = { title: string };

export const data = {
  memos: [] as Memo[]
};

export const onServer = async () => {
  data.memos = await fetchGet<Memo[]>("/api/memos");
};

export default () => (
  <main class="mx-auto max-w-xl space-y-3">
    <h1>Memos</h1>
    {data.memos.map((memo) => (
      <Card key={memo.title}>{memo.title}</Card>
    ))}
  </main>
);