현재 운영중인 서비스에 IFDO, GoogleTagManager, Criteo 3가지의 마케팅 솔루션을 사용하고 있다.최근 naverAnalytics에 대한 추가 요청을 받게 되었다.react 및 next 에 대한 마케팅 솔루션 관련 스크립트에 대한 문서를 흔하게 찾을

프론트 서버의 메모리 사용량이 많이 올라가는 것을 확인하였다.첫째로, 프론트 프로젝트에서 메모리 누수가 발생하는것은 아닌지 확인하였으나, 메모리 누수는 아니었고 예상하기로는 당사의 서비스가 다량의 이미지를 사용하기에 이미지의 캐싱과 관련되어있는것은 아닐까 라는 생각이

운영 중인 닷컴 서비스에 \*\*i18n(국제화)\*\*을 도입을 하게 되었다. 단순히 번역 파일을 작성하는 것이 아닌, i18next-scanner로 번역 키를 자동 추출하고, 구글 스프레드시트와 연동하여 각 팀이 협업할 수 있는 워크플로우를 구축한 과정을 정리 해보

PM2 Logrotate로 로그 관리 최적화하기 필자의 라이브 프론트 서버에서 애플리케이션의 로그가 현재까지 계속 쌓여 하드디스크(HDD)의 용량이 출시 초기부터 현재까지 조금씩 증가하는 현상을 인지하게 되었다. 필자는 최근 PM2를 이용하여 서버의 프로세스를 관리

필자의 서비스는 jenkins를 이용하여 CI/CD를 하고있다.프로젝트를 각 deploy 서버에서 배포시, 각 서버의 CPU와 MEMORY 사용량이 튀는(갑자기 증가하는) 현상을 발견하였다. 또한 시간이 빌드시 만큼 오래 걸려 이를 해결하고자 한다.jenkins의 bu

리뷰 서비스 개발 중, 리뷰에 관련한 써드파티 API를 사용하는데 있어서 문서의 내용 중에 구글 봇이 해당 컨텐츠를 크롤링 할 수 없도록 처리해야한다고 명시되어있었다. 크롤링을 처리하는 방법에는 여러가지 방법이 있지만 동적으로 데이터를 로드하거나 User-Agent를 판별하여 호출하는 방법 둘 중 하나를 선택하기로 하였다. 측에서 동적으로 데이터를 로드...

점진적 향상법(progressive enhancement)과 우아한 성능저하법(graceful degradation) 점진적 향상법(Progressive Enhancement)과 우아한 성능저하법(Graceful Degradation)은 웹 개발에서 사용자 경험을

호이스팅과 스코프 호이스팅 JavaScript 호이스팅은 코드가 실행되기 전에 함수, 변수, 클래스의 선언문을 해당 스코프의 맨 위로 끌어올리는 것처럼 보이는 현상을 뜻한다. JavaScript에서 변수를 선언할 때 사용하는 주요 키워드에는 var, let, cons

서비스 운영 및 협업을 하면서, 사람마다 함수를 사용하는 스타일이 달라 선언형 함수, 표현형 함수, 화살표 함수 등이 의미없이 섞여있어 문득 각각의 차이점을 정확히 이해하고 사용하고 있을까 라는 의문이 들었다. 이참에 나도 놓치고 있는부분이 있지는 않을까 짚고 넘어가기

ESLint는 EcmaScript(javascript) 와 Lint를 합친 것으로 여기서 Lint는 에러가 있는 코드에 표시를 달아놓는 것을 의미한다.즉 ESLint는 자바스크립트 문법에서 에러가 발생하면 표시해주는 도구이다.ES는 EcmaScript로서, Ecma라는

얼마 전 , 해외에서 우리 서비스를 접속 하였을 때 backend 에서 내려주는 데이터와 클라이언트에게 노출되는 날짜가 다르다는 이슈가 있었다. backend 에서 날짜 형식을 yyyy-MM-dd string 형식으로 내려주는데 해당 데이터를 new Date() 의

캐시 (cache) 란 데이터에 빠르게 접근하기 위해 자주 사용되는 데이터나 값을 미리 복사해 놓는 임시 장소를 의미한다. 웹 브라우저에서 네트워크를 통해 서버에 데이터를 요청하게 되면, 해당 서버가 응답을 반환할 때까지 페이지가 로드되지 않는다. 페이지 로딩에 필

브라우저에서 보이는 많은 데이터들은 HTTP 프로토콜에 의해 서버에서 브라우저로 데이터가 넘어오게 됩니다. 이때 요청(Request)을 보내고 응답(Response)를 받는다.HTTP 헤더에는 브라우저, 서버, 요청 데이터의 정보가 함께 들어있고 전달한다. 그렇다면

캐시(cache)란? 캐시(Cache)는 다운로드 받은 데이터나 값을 미리 복사해 놓는 임시 장소이다. 데이터에 접근하는 시간이 오래 걸리는 경우나 값을 다시 계산하는 시간을 절약하고 싶은 경우에 사용한다. 클라이언트와 서버가 요청과 응답을 주고 받을 때 브라우저 캐

hydration Hydrate는 Server Side 에서 Pre-Redering 렌더링 된 정적 페이지와 번들링된 JS파일을 클라이언트에게 보낸 뒤, 클라이언트 단에서 HTML 코드와 React인 JS코드를 서로 매칭 시키는 과정을 말한다.

SRP(Single Responsibility Principle): 단일 책임 원칙OCP(Open Closed Priciple): 개방 폐쇄 원칙LSP(Listov Substitution Priciple): 리스코프 치환 원칙ISP(Interface Segregatio

객체 지향 프로그래밍 (Object-Oriented Programming, OOP)은 프로그래밍에서 필요한 데이터를 추상화 시켜 상태와 행위를 가진 객체로 만들고, 객체들간의 상호작용을 통해 로직을 구성하는 프로그래밍 방법이다.객체는 프로그램에서 사용되는 데이터 또는

이진트리(Binary Tree)는 트리 중에서도 각 노드가 최대 2개의 자식노드를 가질 때 이진트리(Binary Tree)라고 한다.최대 2개이기 때문에 자식이 없을 수도 있고, 한개만 있을 수도 있다.이때 자식노드는 각각 왼쪽 자식노드와 오른쪽 자식노드로 표현을 한다