[FEAT] 유저는 도서를 검색할 수 있다.
noy3928 opened this issue · comments
- 컴포넌트 작성
- 책 정보를 보여주는 컴포넌트 작성
- 책 정보를 보여주는 리스트 컴포넌트 작성
- 검색 폼 컴포넌트 작성
- or 과 not 연산자를 통해 도서 검색 결과를 반영하기
or 과 not 연산자를 통해 도서 검색 결과를 반영하기 (구현 고민)
해당 내용은 어떤 방식으로 구현할 것인지에 대해서 고민이 필요해보인다. 구현하기전에 먼저, 어떤 flow로 동작하게 할 것인지 그려보면 좋을 것 같다.
- searchAndSetBooks 함수를 만든다. setState를 미리 받아놓는 커링 함수다.
- searchAndSetBooks에 setState를 넣어 만든 함수에서 handleSearchBook를 만든다.
- handleSearchBook를 SearchForm의 prop에 넘겨준다.
- SearchForm에서 키워드 입력시 handleSearchBook을 실행한다.
- handleSearchBook에서는 "|","-" 키워드에 따라 검색 타입을 구분하는 resolveKeyword 함수를 사용한다.
- resolveKeyword 함수로 반환받은 검색 타입에 따라 다르게 동작하는 fetchBooksByType 함수를 실행한다.
- fetchBooksByType 함수로 받아온 값을 통해 setState를 실행한다.
결국 책 검색 후의 흐름은 다음과 같다.
입력을 받는다(handleSearchBook) -> 검색의 타입을 구분한다(resolveKeyword) -> 타입에 따라 api 함수를 호출한다(fetchBooksByType) -> 호출한 결과값을 화면에 반영한다. (setState)
그리고 각각의 함수들에 대해서 테스트를 작성해보면 좋을 것 같다.
구현사항 정리
- pipe 함수를 구현한다.
- pipe 함수에서 keyword를 인자로 받고 resolveKeyword -> fetchBooksByType -> setState 의 파이프라인으로 함수를 실행한다.
- 각각의 함수에 대해서 테스트코드를 작성한다.