odada

할 일 관리 앱 만들기0. 프로젝트 생성하기todo-Todo 디렉토리를 생성 후 프로젝트를 생성합니다.npx create-next-app@latest ./https://ko.react.dev/learn/start-a-new-react-project1. 컴포넌트 구조 설계하기2. 컴포넌트 제작- Header 컴포넌트 만들기// src/components/TodoHd.jsximport React from 'react';const TodoHd = () => { return ( 📝 할 일 관리 앱 2024.03.11 오늘의 할 일을 적어보세요. );};export default TodoHd;- TodoEditor 컴포넌트 만들기// src/components/TodoEdit..

라이프 사이클 (생명주기) 이해하기React에서 컴포넌트의 생명주기를 관리하는 것은 앱의 성능과 유지보수성에 중요한 영향을 미칩니다. 특히, 함수형 컴포넌트에서는 useEffect 훅을 사용하여 이러한 관리 작업을 수행합니다.- 뉴스 예제로 알아보는 라이프 사이클데이터를 불러와 화면에 표시하는 간단한 뉴스 목록 컴포넌트를 생각해볼 수 있습니다.생명주기 단계소셜 미디어 대시보드Mounting (마운팅)데이터 가져오기Updating (업데이팅)실시간 업데이트Unmounting (언마운팅)컴포넌트가 DOM에서 제거되는 단계마운트 (Mounting) - 태어나고이 컴포넌트는 useEffect 훅을 사용해 컴포넌트가 마운트될 때 뉴스 API에서 데이터를 한 번만 불러오고,이 데이터를 컴포넌트의 상태로 저장하여 화..