리액트 투두리스트

컴포넌트는 반복되는거 위주로 생각해보자

컴포넌트

Input
TodoBoard
TodoItem

state

inputValue : 인풋창의 change.value
todoList : 추가버튼을 클릭시 투두아이템을 담을 배열 데이터

로직

인풋창, 버튼 존재
인풋창에 값을 입력하고, 버튼을 클릭하면 아이템 추가
아이템 삭제 누르면 삭제가 가능
수정버튼을 누르면 아이템 수정
mode -> notdone, done을 통하여 해당 아이템만필터

1. 유저가 값을 입력
2. • 버튼을 클릭하면, 할일이 추가
3. delete버튼을 클릭하면, 할일이 삭제
4. check 버튼을 누르면 할일이 done 상태 (state로 관리)

mode를 통하여 state 관리 -> done / notdone

• done탭은 done 상태인 목록만 출력
  -not done은 not done인 상태인 목록만 출력
  -all 탭을 누르면 다시 모든 아이템으로 돌아온다. --> 이걸 기본값으로,..?

5. 해당 목록을 누르면 수정가능한 (업데이트 기능)

데이터 구조

all not done

{
id
content
status
}

check버튼눌렀을때 state 변경
조건에 맞는 필터 filter로 status 분류