[React] Todo 앱 만들기 / 배포 완료

✏ 환경설정

1. Node.js 및 npm 설치

• Node.js 공식 웹사이트에서 Node.js를 다운로드 npm은 Node.js와 함께 제공

2. create-react-app 설치

• 터미널(또는 명령 프롬프트)에서 다음 명령어를 실행하여 create-react-app을 전역으로 설치

npm install -g create-react-app

3. 프로젝트 생성

• 터미널에서 프로젝트를 생성할 디렉터리로 이동한 후, 다음 명령어를 실행하여 React 앱을 생성

create-react-app react-todo

4. 프로젝트 폴더로 이동

• 생성된 프로젝트 폴더로 이동

cd react-todo

5. 코드 실행

• 브라우저에서 http://localhost:3000로 이동하여 앱을 확인

npm start

---

✏ 배포/코드 및 실행 화면

1. 코드 설명

• 깃허브 코드 깃허브
• 배포 Todo-App
• components 폴더에서 컴포넌트들을 관리하여 편리성 UP

• index.js 코드
  

• App.js 코드
  

• Task.js 코드
  

• TaskForm.js 코드
  

• TaskList.js 코드
  

2. 실행 화면

• 메인화면
  
• Task 생성
  
• Task 삭제