WAS(Web Application Server) DB 조회나 다양한 로직처리를 요구하는 동적인 컨텐츠를 제공하기 위해 만들어진 Application Server HTTP를 통해 컴퓨터나 장치에 애플리케이션을 수행해주는 미들웨어(소프트웨어 엔진)이다. 웹 컨테이너 혹은 서블릿 컨테이너 라고도 불린다. 컨테이너란, js...
Open Graph(OG) 프로토콜
Open Graph 프로토콜 HTML문서의 head에는 <meta> 태그로 사이트의 정보가 표기되어있는 경우가 많다. 이는 크롤러가 무엇이 제목이고, 무엇이 내용인지 파악하기 쉽도록 하기 위해서 표기한 것이다. 페이스북의 Open Graph 프로토콜은 이러한 메타태그의 표기 방법은 통일한 것이다. 이 Open Graph 프로토콜이 우리가...
Mysql Count 속도
Mysql의 Select Count(*) 얼마나 빠를까? 사용하는 데이터베이스 엔진에 따라 다르다. InnoDB : O(n) MyISAM : O(1) 이유는 MyISAM의 경우 row가 몇 개 있는지 저장하고 있기에 Count(*) 쿼리가 들어오면 그 저장한 값을 바로 리턴하여 O(1)이 된다. Count(*) vs Count(c...
리액트 리팩토링
리액트 리팩토링 useEffect 사용 useEffect 올바른 사용 props, state 변경에 따라 다른 데이터, state를 업데이트해야할 때 useEffect의 사용을 자제하자. useEffect vs EventHandler 중 어느 쪽에서 유저 인터랙션을 처리해야할까? useEffect 내에서 data fetching을 할...
자바 기본
Eclipse 프로젝트 생성 new Java project를 하면 여러 선택지가 나옴. Project layout use project folder as root for sources and class files 빌드 전 소스코드와 빌드 후 생성된 결과물이 root에 한번에 생김...
useEffect 올바른 사용
useEffect 올바른 사용 props, state 변경에 따라 다른 데이터, state를 업데이트해야할 때 useEffect를 사용하면 안된다. props, state가 변경이 되면 리렌더링이 발생하는데, 리렌더링이 끝난 후 useEffect가 호출되어 다시 리렌더링이 발생하기 때문이다. 따라서 다음과 같이 코드를 변경해야한다. 데이터...
바벨
바벨 바벨이란? 자바스크립트 트랜스파일러. 보통 모던 자바스크립트를 호환성을 위해 예전 문법으로 변환할때 사용한다. Typescript와 JSX 코드를 변환할 때도 사용한다. 바벨 설정 파일 예시 { "presets": [ [ "@babel/env", { "targets": { ...
선언형프로그래밍
선언형, 명령형 그리고 추상화 선언형이란? 명령형은 어떻게(How)에, 선언형은 무엇(What)에 집중한다. 선언형은 명령형 코드에서 ‘어떻게’를 감추고 ‘무엇을’만 노출하는 방식의 추상화이다. 일종의 리팩토링이다. 예시를 들면 다음과 같다. // 명령형 코드 : 배열에 있는 모든 숫자를 하나씩 제곱해서 result 배열에 넣는다. f...
React-query 에서 cache를 사용하는 방법
useQuery 설정 React-Query 공식문서상 캐싱개념은 stale과 cachetime을 통해 이루어진다 useQuery의 옵션으로 staletime과 cachetime을 보낼 수 있다. staletime : fetch를 통해 전달받은 데이터는 리액트 쿼리의 자료구조 내용중 캐시에 저장되는데, 이 캐시데이터의 ‘신선한 상태’가 언제까...
DB 페이징 기법
페이징 DB 에서 페이징을 구현하는 방법 오프셋 페이징 limit과 offset을 활용하여 페이징을 구현하는 방법. SELECT * FROM table ORDER BY timestamp OFFSET 10 LIMIT 5 장점 구현이 간단하다. 단점 Offset을 정말로 건너 뛰는 게 아니라, 한번은 읽는다. 따라서 만...