본문 바로가기

리액트 공부와 함께 하는 일상37

[TIL] 4주차 - 6. 검색 (feat. ES, Redis / 디바운싱, 쓰로틀링) Today I Learned 검색을 이해하려면 다양한 DB를 알아야 돼! - DataBase 검색 결과를 페이지네이션과 연결해야 돼! - Search / Pagination 검색하기 버튼 없이 검색을 한다고?! - Debouncing / Throttling 검색 프로세스 이해 (ES, Redis 등) 백엔드의 검색 시스템 구조에는 가장 기본적으로테이블을 풀 스캔하는 방식(full table scan)으로 전체 테이블 로우를 조회하는 방법이 있습니다. 초기에 빠르게 만들기 위한 방법으로 사용되고, 서비스 규모가 커짐에 따라 이러한 방식은 잘 사용되지 않습니다... 웹서비스의 검색 의 가장 기본적인 프로세스는 다음과 같습니다. Browser에서 검색 요청을 하면 Back-end에서 DB 내부의 수 많은 Da.. 2022. 2. 9.
[TIL] 4주차 - 5. 이미지 파일 업로드 이미지 프로세스 이해 (이미지 서버, 스토리지 포함) 이미지 프로세스를 이해하기 위해서는 storage 사용을 알아야 합니다. storage 또한 컴퓨터이며 여러 컴퓨터들을 연결시켜 놓은 큰 용량을 담을 수 있는 데이터베이스 입니다. 이미지 파일 업로드 시 데이터 베이스에는 이미지 파일이 저장된 주솟값이 들어가며 실제 저장되는 위치는 storage입니다. uploadFile 이라는 api가 있을때, 파일을 선택하고 uploadFile을 요청하게 될 경우, backend에서 storage로 파일을 전송하게 됩니다. 우리가 이미지를 보기 위해서는 주소를 사용해 접근하게 됩니다. 즉, storage에서는 backend로 이미지 주소를 넘겨주게 되며 이 주소를 다시 front에게 주게 됩니다. 우리는 이 주소를.. 2022. 2. 8.
[TIL] 4주차 - 4. Firebase BAAS 서비스 Firebase (BAAS 서비스) FireBase는 Back-end 개발자 없이 Back-end 기능을 클라우드 서비스 형태로 제공하여 앱 / 웹 개발을 도와주는 서비스 입니다. 프런트엔드에서 데이터베이스로 바로 저장할 수 있습니다. FireBase 사용을 위해서는 FireBase 홈페이지로 이동하여 가입 및 설정을 해야합니다. 프런트에서 바로 Firebase로 저장할 수 있지만 보이지 않는 백엔드가 제공 됩니다. 그래서 파이어베이스는 BAAS backend as a service(백엔드기능을 클라우드 서비스 형태로 제공해주는 것) 이라고 불립니다. 비슷한 서비스로 SAAS : Software-as-a-Service(서비스로서의 소프트웨어) 설치한 적도 없는데 웹에서 서비스해주는 것. PAAS: Pla.. 2022. 2. 7.
[TIL] 4주차 - 3. CORS (Cross-Origin Resource Sharing) CORS (Cross-Origin Resource Sharing) 오픈 api를 사용하다 보면 cors 에러가 발생하여 리소스 값들을 가져 오지 못하는 경우가 있습니다. cors에서 origin은 주소 값을 뜻하며 사이트 주소(네이버 주소 같은 것.)가 됩니다. 어디서 출발한지를 나타내며 요청 출발지에 해당됩니다. 예를 들어, 네이버에서 카카오로 요청을 하게 됩니다. 그러면 네이버라는 오리진에서 카카오로 요청을 하게 되는 것입니다. 이 때 오리진이 크로스 됩니다. 네이버에서 네이버로 요청을 해야지 왜 카카오로 요청하느냐 는 식입니다. api 요청 시 기본적으로 크로스된 상태에서 리소스를 허용할 수 없습니다. 백엔드에서 허용해야 리소스 값을 받을 수 있습니다. 이 때 우회적인 방법으로 api 데이터 값을 .. 2022. 2. 7.