[AIBE3/3팀/이병진] TodoApp 만들기 완료

[Zeri-Time]

Todo App mini-project

프로젝트 소개

React를 이용해 Todo 어플리케이션을 구현한 사이트입니다.

할일을 입력하면 index 순서대로 로컬에 저장되며 수정 버튼을 눌러 내용을 수정할 수 있습니다.

완료(체크버튼) 클릭시 해당 항목이 리스트 제일 아래로 이동하며 최대 표시 항목수는 5개 이고 이후로는 아래로 스크롤 됩니다.

기술스택

개발기간

• 25/07/07 - 25/07/10

---

⚙️설치 및 실행 방법

1. 리액트 설치

npm create vite@latest projectname -- --template react
cd projectname
npm i

2. 테일윈드 설치

npm i tailwindcss @tailwindcss/vite

✔️vite.config.js 에 추가

import tailwindcss from '@tailwindcss/vite'
plugins: [tailwindcss()]

✔️index.css 에 추가

@import "tailwindcss";

3. 라우터 설치

npm i react-router-dom

🚀실행

npm run dev

---

데모

[JaeSeungJae]

고생 많으셨습니다!
많은 컴포넌트로 분리해서 구현해서 세세하게 기능을 알 수 있어서 좋았습니다.

[yhcho14]

수정기능 구현과 디자인 구현이 좋았습니다.

[chan808]

수고하셨습니다~
디자인도 깔끔하고 수정-저장 부분이 편리하게 잘 구현된 부분이 좋았습니다

[haemin4738]

• 컴포넌트 구조가 명확하고, 역할 분리도 잘 되어 있어 보기 편했습니다.

• id 생성이 max+1 방식인데, 추후 삭제 후 추가 시 중복 우려가 있을 수 있어 uuid 사용하는 것도 좋을 것 같습니다.

• handleClick과 handleEnter 함수는 하나로 합쳐놓으면 좀 더 편하게 유지보수가 가능할 것 같습니다.

  고생하셨습니다 ! 😊

[get783]

• 디자인도 깔끔하고 보기 좋습니다! 😊
• 수정 기능, 할 일 완료 시 자동으로 목록 아래로 정렬되는 기능이 좋았습니다. 사용자가 쓰기 편할 것 같습니다.