바닐라코딩/Boot Camp6 Geospatial data and B-Tree https://github.com/POODADAK/poodadak-client 팀프로젝트를 진행하면서 사용자의 위치정보(위도, 경도)기반으로 주변에 있는 화장실을 찾아주는 기능을 개발해야할 일이 있었다. 그런데 위치정보라는 것은 일반적인 데이터가 아니기 때문에 DB 에서 검색을 할때 "특정 위도/경도 포인트의 주변 500m 내의 존재하는 위도/경도 포인트들" 을 어떻게 가져와야 할지 고민을 했었다. 조금 조사를 해봤더니 몽고DB 에서는 기본적으로 Geospatial 데이터타입과 2dsphere 인덱싱을 지원해서 관련된 쿼리또한 네이티브로 지원해서 편하게 기능 구현을 할 수 있었다. https://www.mongodb.com/docs/manual/geospatial-queries/ Geospatial Qu.. 2022. 3. 31. 바닐라코딩 6주차 정리 강의 이번주의 강의 내용은 주로 리액트의 useCallback, useMemo와 같이 성능 최적화에 관련된 부분이었습니다. useCallback 리액트에서 함수형 컴포넌트는 리렌더링이 일어 날때 마다 재실행 됩니다. 함수가 재실행 되면 해당 함수내에서 선언된 함수는 다시 선언되고, "함수 === 참조형" 이므로 만약 하위 컴포넌트에 해당 함수를 prop으로 넘겨주거나 할 경우 해당 하위컴포넌트는 새로운 prop이 들어온것으로 판단해 불필요한 리렌더링이 발생할 수 있습니다. 이럴 경우 useCallback으로 해당 함수를 감싸주고 디펜던시 리스트를 설정해주면 함수를 무조건 적으로 재생성 하지 않기 때문에 효율적으로 리렌더링을 관리 할 수 있습니다. https://reactjs.org/docs/hooks-r.. 2021. 12. 12. 바닐라코딩 5주차 정리 강의 이번주부터 3주간 front-end 주간으로 리액트를 학습하게 됩니다. 리액트란? 자바스크립트를 통해 UI를 선언적(Declarative) 으로 그려나갈 수 있는 라이브러리입니다. 여기서 선언적으로 UI를 그린다는게 무엇을 의미하는지 한번 생각해보고 가봅시다. 일반적으로 자바스크립트를 통해 UI를 그리려면(조작하려면) 아래와 같은 과정을 거치지 않을까 싶습니다. 1. createElement로 필요한 DOM 엘리먼트 생성하기 2. 해당 엘리먼트에 addEventListener 붙이기. 3. 해당 엘리먼트가 들어가야할 위치에 appendChild 등을 통해 DOM 트리에 붙이기. 위와 같이 모든 단계를 일일히 절차적으로 거치는 것을 imperative(절차적/명령형)라고 합니다. 리액트의 경우는 다릅.. 2021. 12. 5. 바닐라코딩 3주차 정리 강의 이번주의 강의 내용은 기본적인 정렬알고리즘과 프로그래밍 패러다임에 관한 내용이었습니다. Bubble Sort - 총 n개의 입력이 주어졌을때 n-1, n-2,....,1 만큼 자기옆의 원소와 비교연산을 수행하여 정렬을 수행합니다. - 위의 과정때문에 시간 복잡도는 O(n^2)입니다. - 장점 in-place 방식 이기 때문에 별도의 메모리 공간을 차지하지 않습니다. 인풋이 이미 정렬된 상태일경우 시간복잡도가 O(n)이기 떄문에 정렬이 이미 되어있던 정도를 확인 가능합니다. -단점 시간복잡도가 O(n^2)으로 느립니다. Insertion sort - 버블 소트와 마찬가지로 현재 선택된 원소를 원쪽의 원소들과 비교해 나가며 올바른 자리에 삽입 하는 정렬 방식입니다. - 위의 과정때문에 시간 복잡도가 O.. 2021. 11. 20. 바닐라코딩 2주차 정리 강의 이번주의 강의 내용은 자료구조였습니다. Stack -First In Last Out - 삽입: O(1) - 삭제: O(1) - 조회: O(n) - 사용처: 브라우저의 앞/뒤로가기기능, 자바스크립트의 콜스택 등등... Queue -First In First Out - 삽입: O(1) - 삭제: O(1) - 조회: O(n) - 사용처: 대기줄, 자바스크립트의 콜백큐 등등... Linked List - 삽입: O(1) - 삭제: O(1) *여기서 말하는 삭제는 원하는 값을 '조회' 후 삭제하는것이 아니라 말그대로 해당 노드를 삭제 하는 행위만을 의미 합니다. - 조회: O(n) - 사용처: 해시테이블의 충돌 해결법, 웹브라우저의 히스토리 저장방식 등등.. Hash Table - 삽입: O(1) - 삭제:.. 2021. 11. 14. 바닐라코딩 1주차 정리 강의 이번주의 강의는 바닐라 자바스크립트의 비동기함수와 프로미스에 관한 부분이었습니다. 비동기 함수 - 자바스크립트는 메모리힙, 콜스택, 이벤트큐, 이벤트 루프로 구성되어있으며 비동기함수의 경우 이벤트 큐에 저장되었다가 동기함수가 콜스택에서 전부다 실행되어 콜스택이 비었을때 이벤트루프가 해당 비동기 실행 함수를 콜스택으로 옮겨와 실행하게됩니다. Promise - 자바스크립트에서 비동기를 처리할 수 있는 방법중 하나이며 new Promise와 같은 형태로 promise 객체를 생성할 수 있습니다. - promise 객체생성시 resolve와 reject라는 콜백함수를 인자로 받아올 수 있으며 resolve 실행시 해당 promise는 resolve되고 reject시 해당 promise는 reject됩니다... 2021. 11. 6. 이전 1 다음
