[DAY 27] TIL

오늘의 의문점

1. Layout 컴포넌트를 사용하는 방법에 대해 자세히 설명해주실 수 있나요 ?

2. 먼저 Home.jsx에서 모든 내용을 작성한 후에 컴포넌트 분리를 한다고 할 때, id값을 전달해주는 방법을 모르겠어요.
card컴포넌트 분리 후, prop로 todo를 받아오고, 그 후에 각각의 버튼이 독립적으로 작동하는 것 까지는 이해했으나,
home에 한번에 작성 후 분리를 하고싶을 때, 방법이 따로 있는건가요 ?
이러한 방법을 알아야할 필요가 있나요 ?
컴포넌트 분리를 해서 하는 방법만 알아도 괜찮나요 ?

1. 레이아웃 컴포넌트는.. 메인 페이지에서 위아래로 감싸주거나.. 헤더와 푸터를 따로 만들어서 각각 넣어주면 됨. 음.. 아직 <Layout>이런식으로 헤더, 푸터 포함해서 사용하는 법은 모를지두....

import React from "react";
import styled from "styled-components";
import Footer from "../components/Footer";
import Form from "../components/Form";
import Header from "../components/Header";
import List from "../components/List";
import GlobalStyle from "../GlobalStyle";
import { useNavigate } from "react-router-dom";

function Home() {
  const navigate = useNavigate();

  return (
    <Wrapper>
      <GlobalStyle />
      <Header onClick={(e) => navigate("/")} />
      <Form />
      <List />
      <Footer />
    </Wrapper>
  );
}

const Wrapper = styled.div`
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  max-width: 1200px;
  min-width: 800px;
  margin: auto;
`;

export default Home;

2. 에 대한 답변은.. 그냥 그때그때 분리해가면서 하는 것이.... 정신건강에 이롭고..... 나중에 한번에 정리하는것은 마치... 수능공부를 하면서... 일단 인강을 쭉 듣고 다시 처음부터 노트정리 하는것과 같아..... 내가 기억을 못할 수 도 있으니까 .. . 그냥 그때그때 알아보기 쉽게 정리해두도록 하자....