# 4/6

- React Hook 처럼 동작하게 만들어보기 vs MVVM 패턴
- 패턴에 대한 공부는 지난 미션에서 해봤으니 새롭게 Hook 처럼 만들어 보는 것도 좋을듯??

### 오후

- 2시 ~ 2시 20분 간략히 회의
- 2시 20분 ~ 3시 40분
- 스토리 회의
- 3시 40분 ~ 4시
- 쉬는시간 겸 PR 확인
- 4시
- PR 날리고 스토리 마저 회의

### 스토리

(A: 웹유저) (B: 브라우저)

- B 가 처음 열렸을 때 칼럼의 갯수를 세고 타이틀 옆에 표시한다.

- B 가 처음 열렸을 때 칼럼은 최신순으로 정렬된다.

- A 가 메뉴 버튼을 누르면 숨겨져있던 레이어가 애니메이션 효과와 함께 표시된다.
- 레이어는 최신순으로 정렬된다.
- 레이어에 기록이 많은 경우 오른쪽에 스크롤이 생긴다.
- A 가 X버튼을 누르면 레이어가 애니메이션 효과와 함께 숨겨진다.

- A가 타이틀 옆에 + 버튼에 마우스를 올리면 +버튼의 색상이 바뀐다.
- A가 타이틀 옆에 + 버튼을 클릭하면 새로운 카드를 등록할 수 있는 박스가 나온다.
- + 버튼을 또 누르거나 X 버튼을 누르면 박스가 사라진다.

- A가 새로 생성할 박스에 내용을 입력하면 등록 버튼이 활성화된다.
- A가 내용을 입력후 등록을 누르면 새로운 카드가 등록된다.
- A가 카드를 등록하면 새로운 카드를 등록할 수 있는 박스는 사라진다.

- A는 카드를 같은 칼럼, 다른 칼럼으로 드래그 드랍을 할 수 있다.
- A가 드래그앤 드랍시 원래 카드의 자리엔 잔상이 남고, 이동 경로의 절반정도가 되면 예정 목적지에 잔상이 남는다.
- 드래그를 중단하면 잔상이 있는 위치에 카드가 남고 잔상은 사라진다.
- 드래그 시 카드는 반투명하다.

- A가 칼럼 타이틀의 X버튼에 마우스를 올리면 X버튼의 색상이 빨간색으로 변한다.
- A가 칼럼타이틀의 X버튼을 클릭해도 아무런 반응이 없다.
- A가 카드의 X버튼에 마우스를 올리면 카드의 색상이 빨간색으로 변한다.
- 카드의 X버튼을 클릭하면 "삭제할까요?" 같은 알럿창이 뜬다.
- 알럿창의 취소버튼을 누르면 알럿창이 닫힌다.
- 알럿창의 삭제버튼을 누르면 해당 카드가 삭제된다.

- A가 카드를 더블 클릭하면 정보 입력을 위한 박스로 전환된다.
- A가 취소버튼을 누르면 수정이 취소된다.
- A가 내용을 모두 삭제하면 수정버튼이 비활성화 된다.
- A가 내용을 수정한 후 수정버튼을 누르면 변경사항이 반영된다.

###