본문 바로가기
728x90

페이지네이션4

41. 페이지네이션 el = fetchBoards에서 map으로 꺼냈을 때, 그 안에 어떤 타입인지 몰라서 빨간 줄이 뜬다. 왼쪽 = data에 대한 타입 오른쪽 = (FETCH_BOARDS) 이 안에 들어갈 타입 currentTarget = 클릭 했을 때 타겟 id가 빨간색인 이유 = id는 HTML이라서 숫자가 못들어감. 그래서 String을 넣어야함 new를 빼도 됨 el은 사용하지 않아서 흐린 것 이런 el을 사용하지 않을 때는 _ 언더바로 바꾼다 _ = 뭔지 모르겠지만 안쓰는거구나~ 없애면 안됨 = 위치가 있기 때문 이전 페이지, 다음 페이지 화살표 index는 무조건 0~9 여기에 +1이 된것 마우스 있는 부분이 10단위로 바뀌게 하면 된다 마지막 페이지 조건부 렌더링 시작페이지 마지막페이지 마.. 2023. 2. 14.
검색 프로세스, 검색어 결과 표시, 디바운싱 쓰로틀링 7/30 오늘 수업은 검색 프로세스와 관련하여 배웠다. 1. 백엔드의 검색 시스템 구조에 대해서 배웠다. 가장 기본적으로 1)테이블을 풀 스캔하는 방식으로 전체 테이블 로우를 조회하는 방법이 있다. 초기에 빠르게 만들기 위한 방법으로 사용되고, 서비스가 커짐에 따라 이러한 방식은 잘 사용되지 않는다. 이 방법을 개선하기 위해 데이터베이스에 저장할 때, 문장을 키워드 단위로 2)토크나이징하고, 2)역인덱스(inverted index)를 만들어서 저장한다. 이를 쉽게 해주는 데이터베이스 프로그램이 2)엘라스틱서치(ES) 서비스가 더 커지게 되면, 수많은 사람들이 검색하는 데이터는 어느정도의 틀에서 크게 벗어나지 않는다. 따라서, 3)검색어와 매칭되는 검색결과를 메모리에 저장(이를 (검색로그를) 캐싱한다고 한.. 2021. 10. 22.
useEffect와 의존성배열, useRef, 컴포넌트 생명주기 7/26 지난주까지 배웠던 부분들이 서비스를 만드는데에 있어서 핵심 코어부분이라고 할 수 있다. 프론트엔드의 컴포넌트 라이프사이클, 백엔드와 데이터베이스, 이미지 저장소, 검색 시스템 등이 예가 된다. 이유는, 전체를 알아야 백엔드 개발자 및 기타 기획자, 프로젝트매니저 등과 커뮤니케이션에 무리가 없기 때문이다. class 컴포넌트의 render, componentDidMount, componentDidUpdate, componentWillUnmount 등과 마찬가지로 함수형 컴포넌트에는 useEffect가 있다. class컴포넌트는 함수형 컴포넌트로 전환이 가능했고, 이 때의 핵심은 useEffect와 dependency array(의존성 배열) 이다. 또한, componentDidMount 시점에서,.. 2021. 10. 22.
페이지네이션 7/22 페이지네이션, 무한스크롤 page로 바꿈 그런데! 이전을 계속 누르면 마이너스가 된다..? return = 값을 반환하는 것 = 함수를 종료하는 뜻 감싸준다 더 깔끔하게 만들면 전에 썼던 bbb를 바꿈 완성 코드는 2021. 10. 22.
728x90