https://www.figma.com/embed?embed_host=notion&url=https%3A%2F%2Fwww.figma.com%2Ffile%2FWQWQdH9JWwcSugQeWIJMxh%2F2023-frontend-basic-react-todoapp%3Ftype%3Ddesign%26node-id%3D323-756%26t%3DHgFfpvctxroAbUVc-4

[お手本 storybook(http://shinonome.io/frontend-basic-todoapp-storybook/?path=/story/pages-mainpage--default)](https://shinonome.io/frontend-basic-todoapp-storybook/iframe.html?path=/story/pages-mainpage--default&viewMode=story&full=1&shortcuts=false&singleStory=true)

お手本 storybook(http://shinonome.io/frontend-basic-todoapp-storybook/?path=/story/pages-mainpage--default)


ここではレイアウトの調整を行います。 Organisms/TodoCardとAtoms/Titleを、お手本を参考にいい感じに配置しましょう。

ディレクトリ構造

src
  └ components
    └ Pages
      └ MainPage
        ├ index.jsx
        ├ story.jsx (旧テンプレートの場合)
        └ index.stories.jsx (新テンプレートの場合)

前のページ

Organisms/TodoCard

次のページ

ひとまず完成