junyCoding

Virtual DOM Virtual DOM 은 실제 DOM과 비슷한 React의 객체 트리입니다. 실제 DOM을 제어하지 않고 Virtual DOM을 통해 변경된 부분만 DOM에 반영하는 작업을 하는 것이죠. Virtual DOM의 생성 ReactDOM.render( , document.getElementById('root') ) JSX 문법을 사용한 ReactDOM.render을 호출하면 Virtual DOM 이 만들어집니다. ReactDOM.render( React.createElement(App) , document.getElementById('root')); JSX 문법을 변환하면 다음과 같은 JS 코드가 만들어지고 이때 render 함수는 React에서 사용하는 타입의 컴포넌트를 생성합니다. 첫..

Apollo Client의 캐시 관리 기법 아폴로 클라이언트는 GrahpQL 쿼리요청 결과를 로컬에 저장할 수 있는 캐시 기능을 제공한다. 클라이언트에서 서버로 Graphql 쿼리를 요청하면 그 결과를 클라이언트 측 메모리에 저장하게 되는 것이다. 이를 잘 활용하면 클라이언트 측에서 동일한 쿼리를 요청할 때 재사용할 수 있기 떄문에 불필요한 요청을 줄일 수 있다. 기본적으로 브라우저 캐시는 GET 요청만 캐싱한다. 하지만 GrahpQL의 경우는 모든 요청을 POST로 하므로 브라우저 캐시를 사용할 수 없다. 이를 해결해 주는 좋은 해결책이 Apollo Client이다. 이는 POST 요청을 하는 GraphQL 요청에도 캐시를 사용할 수 있게 해 준다. 그렇다면 캐시 과정은 어떻게 일어날까? 요청을 보내면..

🌟MongoDB를 사용한 이유 우리 프로젝트에서 NOSQL에 해당하는 MongoDB 를 사용했다. 실시간 통신이 많아서 빠른 Data 조회 속도가 필요했기 때문이다. 또한 MongoDB 는 위치기반의 데이터 관련 쿼리를 지원하기 때문에 위치기반 애플리케이션인 우리 앱에 적합하고 판단했다. 그렇다면 SQL과 NOSQL의 특징과 차이점을 무엇일까? ⁉️ SQL? 구조화된 쿼리 언어 (Structured Query Language) 로서 특정 유형의 데이터 베이스와 상호 작용하는 데 사용되는 쿼리 언어입니다. SQL의 주요 특징은 다음과 같습니다. 정해진 스키마(구조)에 따라서 데이터 베이스를 테이블에 저장 데이터는 관계를 통해서 연결되고 여러 개의 테이블에 분산되어 저장 첫 번째는 엄격한 스키마인데 데이터를..