| 이름 | 버전 |
|---|---|
| node | ^18.7.0 |
| npm | ^9.8.1 |
| react | ^18.2.0 |
server repository
npm install
npm start
코드 이미지
코드 Description
- 인자로 받은 callback 함수를 DEBOUNCE_DELAY_TIME 만큼 딜레이 후에 실행하는 함수를 return 하는 useDebounce custom hook 선언
- input의 onChange event listener에 위에 말한 return된 함수 넣기
- 검색어 상태를 변경하는 함수를 callback 함수로 넣어주기
- SearchKeywordList: 최근 검색어
- childrenElementCount: 모달에 몇개의 최근 검색어가 있는지
- 최근 검색어가 있으면
- key down
- 최근 검색어 리스트의 끝 지점 도달 T/F
- T : 최근 검색어 index 0 으로 초기화
- F : childrenIndex + 1
- 최근 검색어 리스트의 끝 지점 도달 T/F
- key up
- 최근 검색어 리스트의 처음 지점 도달 T/F
- T : 최근 검색어 리스트 끝으로 이동
- F : childrenIndex - 1
- 최근 검색어 리스트의 처음 지점 도달 T/F
- key down
| Commit Type | Format |
|---|---|
| feat | 새로운 기능 추가 |
| bug | 버그 수정 |
| design | 사용자 UI 디자인 변경(CSS 등) |
| refactor | 코드 리팩토링 |
| rename | 파일 혹은 폴더명을 수정만 한 경우 |
| remove | 파일을 삭제만 한 경우 |
| docs | 문서수정 |
| chore | 빌드 업무 수정, 패키지 매니저 수정(gitignore수정 등) |
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent