Darakbang3 코드를 컴포넌트화 해서 더 깔끔하고 가독성 좋은 코드로 변경하기 이번 프로젝트에서 내가 가장 고쳐야겠다고 싶었던 것 중에 꽤 높은 비율을 차지했던 사항이였다. 말로 장황하게 설명하는 것 보다 코드를 직접 보면서 고쳐나가는게 더 좋다고 보이는 파트이기에 어떤 방식으로 이런 변경을 하는지 살펴 보자! return ( 카테고리 커피 식 음료 영화 관람권 공연 관람권 숙박권 상품권 기타 {posts && posts.totalPages && currentPage > 1 && ( )} {posts && posts.totalPages && Array.from({ length: Math.min(PAGE_GROUP_SIZE, posts.totalPages - currentPage + 1) }, (_, index) => ( handlePageChange(currentPage + ind.. 2024. 4. 22. Debouncing 기법을 이용한 연관 검색 기능 구현 및 성능 향상 일반적인 사이트를 보면 검색창에 입력을 할 때마다 그에 맞는 연관 검색어를 밑에 dropdown으로 출력 시켜준다. 그렇다면 그 방법을 알고 어떤 방식을 쓰는게 좋을지 부터 살펴보자면 이 input 창에 검색어를 치게된다면 onChange에 의해 검색어에 입력될때마다 handleInputChange 함수가 실행 될 것이다. 그렇다면 연관 검색어를 출력하기 위해서는.. Input 칸에 검색어를 입력 -> Backend api를 통해서 내가 입력한 검색어와 query가 일치하거나 비슷한 결과를 return -> return 받은 연관 검색어들을 출력 하는 방법이 있을 것이다. 그런데 내가 한 글자씩 몇 백개의 글자를 입력할때마다 api 연결 시도를 해버린다면.. 이런식으로 input 칸에 내가 12글자를 입.. 2024. 4. 21. 1차 다락방 프로젝트 구현 완료 및 피드백 사항 2달 간의 프로젝트 1차 구현이 마무리 되었다. 프로젝트 github 주소 : https://github.com/stophyeon/Darakbang.git GitHub - stophyeon/Darakbang: 오픈 마켓 서비스 오픈 마켓 서비스. Contribute to stophyeon/Darakbang development by creating an account on GitHub. github.com 처음 재대로 시작한 프로젝트였고, 공부 기간 약 2달 만에 시작한 프로젝트였다. 막상 1차 완성을 하고 다시 돌아보니 아쉬움이 되게 많은 프로젝트였다. 혼자 독학하며 강의영상을 보면서 공부하던 때와는 정말 완전히 다르고 새로운 경험이었다. 협업이라는 자체에 처음이었기에 많고 많은 실수들도 거듭했다. 사.. 2024. 4. 17. 이전 1 다음
