본문 바로가기

전체보기

(43)
Apollo GraphQL custom plugin - 나만의 로그 만들기 import { ApolloServer } from '@apollo/server'; const server = new ApolloServer({ typeDefs, resolvers, // 여기! plugins: [loggerPlugin, errorHandlingPlugin], }); 클라이언트로부터 받는 모든 GraphQL 요청들에 대해서 로그를 남겨 모니터링해야하는 일이 있었다. 현재 Apollo GraphQL을 사용하고 있는데 공식 문서를 찾아보던중 custom plugin을 직접 만들어서 GraphQL의 라이프 사이클의 각 단계마다 원하는 동작을 추가할 수 있다는 것을 알게 되었다. 그래서 이번 글에서는 Apollo GraphQL custom plugin에 대한 글이다. Plugin의 기본 구조 P..
MongoDB Replica Set 구성하기 - Docker Swarm 회사에서 MongoDB를 사용하고있다. Stand alone DB로 이중화 구성이 되어있지 않은데 Replica Set 구성을 통해 이중화 구성하는 작업을 맡게 되었다. 구성하면서 찾아본 내용들이 너무 기본적인 내용들만 적혀있었는데, 본 글에서는 찾아본 내용들에 대해 최대한 많은 내용을 담아보려고 한다. 목차는 다음과 같다. 1. MongoDB의 Replica Set이란? 2. Replica Set 구성하는 방법 - with Docker Compose 3. DB 이중화하기 - with Docker Swarm 쿠버네티스가 아닌 도커 컴포즈와 스웜 환경으로 구성한 이유는 현재 업무에서 도커 스웜으로 서비스를 운영하고 있기 때문이다. MongoDB의 Replica Set이란? Replication이란 DB의 ..
애플리케이션 렌더링 전략 (CSR, SSR) 웹 개발을 할 때 고려해야하는 중요한 사항들 중 하나는 애플리케이션 어디에서 로직 및 렌더링을 구현할지이다. 웹사이트를 만드는데에는 여러 다른 방법들이 있으므로 각자 방식의 특성을 이해하고, 상황에 맞는 전략을 사용해야한다. 렌더링 서버 사이드 렌더링(Server Side Rendering - SSR) 서버 렌더링은 네비게이션의 응답으로 서버의 페이지에 대한 전체 HTML을 생성한다. 이렇게 할 경우 브라우저가 응답 받기 전에 처리되므로 클라이언트에서 데이터 가져오기 및 템플릿을 위한 추가 동작이 필요없다. 서버 렌더링은 보통 빠른 FP(First Paint)와 FCP(Fisrt Contentful Paint)를 생성한다. 서버에서 렌더링을 하게되면, 많은 JS코드들을 클라이언트에게 전송할 필요가 없어진..
'피플웨어'를 읽으면서, 결국 사람간의 관계가 중요하다. 새해가 되면서 나와의 약속을 한 것이 있다. IT직군, 프로그래머가 읽으면 좋은 책들을 한 달에 한 권씩 읽어보자. 그 목표를 처음으로 달성하게 된 책은 바로 '피플웨어(Peopleware)'이다. 회사 도서관에서 빌려서 3주 정도 시간 내서 읽어보았다. 책 구매는 여기서 할 수 있다. http://www.yes24.com/Product/Goods/13657193 책은 총 6부로 나뉘어져있다. [1부 인적 자원 관리], [2부 사무실 환경], [3부 우수한 인재를 확보하라], [4부 생산성이 높은 팀으로 양성하기],[5부 비옥한 토양], [6부 여기서는 일이 재미있어야 한다] 1부의 1장만 읽었을 때 든 생각이 있다. '아, 이 책은 관리자들이 읽어야 더 도움이 될 것 같다.' 실제로 책의 대부분 내용이..
프레임워크와 라이브러리의 차이 "프레임워크와 라이브러리의 차이점이 뭔가요?" 얼마 전에 받은 질문인데 명확하게 대답하지 못했다. 내가 아는 프레임워크의 대표적인 종류는 'Spring framework', 'Angular framework'이다. 반면 라이브러리는 'React library', 'jQuery' 대표적이다. 과연 프레임워크와 라이브러리는 어떻게 다른지, 어떨 때 써야 하는지 알아보자. 호출을 누가 하는가? "Who calls Whom" 누가 누구를 호출하는지? 가 프레임워크와 라이브러리의 차이점의 핵심이다. 코드를 작성하는 '우리'가 '라이브러리' 코드를 호출하고, '프레임워크' 코드가 '우리'가 작성한 코드를 호출한다. 조금 더 자세히 알아보자. 라이브러리 라이브러리는 특정 기능을 위해 동작하는 유용한 함수/객체/모듈들..
JavaScript의 Eventing이란? Eventing 전파를 막는 세 가지 기법 최근 동아리에서 FE 스터디를 진행하고 있다. web.dev 사이트에서 글을 하나 골라서 읽고 자료조사 후 설명하기가 스터디의 목적이다. 나의 발표 차례가 되었고, 어떤 내용을 공부해볼까? 하다가 흥미로운 글을 하나 발견했다. JavaScript의 eventing에 대한 글이었다. Eventing Style capturing, bubbling에 대해 알아보고 이벤트 전파를 막는 세 가지 기법 stopPropagation, stopImmediatePropagation, preventDefault에 대해 자세히 적혀있다. 이 글은 해당 내용을 다룬다. 아래 부분은 web.dev에 기재된 JavaScript eventing deep dive를 번역한 내용이다. (모든 내용을 번역하진 않았고, 핵심 내용만 진행..
[ESLint] imports/exports 구문의 순서 자동 정렬하기 이 글은 ESLint를 통해 typescript(혹은 javascript)의 imports/exports 구문을 정렬하는 방법에 대해 공부하며 작성한 글이다. ESLint에 관심이 있거나, imports를 자동으로 정렬하는 방법을 찾고 고민하고 계신 분들이 읽으면 좋을 글이다. 사건의 발단 여러 명이서 작업하고 있는 Angular 프로젝트가 있었다. 요즘에는 개발을 시작할 때, 초기 세팅(tsconfig, eslint, babel, webpack 등등)을 다 한 상태에서 작업을 하지만(심지어 boilerplate도 너무 잘 나와있다.) 사건의 발단이 된 프로젝트는 그렇지 않았다. Linter 설정이 되어있지 않아서 사람마다 코드 스타일도 달랐고, 무엇보다 코드 리뷰할 때 PR 작업과 전혀 관련없는 오로지..
AWS Solutions Architect Associate(SAA) C02 자격증 취득 후기 2월 6일! 드디어 Solutions Architect Associate(이하 SAA) 자격증을 취득했다. 까먹기 전에 후기를 올리고자 이렇게 글을 쓰게 되었다. 시험을 준비하게된 과정 AUSG 1기로 2017년에 활동을 시작하여 어느덧 4년 차가 되었다. 작년 하반기에 자격증 취득 스터디가 생겨서 같이 스터디 계획 공유하면서 취득하게 되었다. 원래는 자격증을 취득할 생각이 전혀 없었는데 AWS re:Invent 2019를 다녀와서 조금 마음이 바뀌었다. 정말 좋은 기회로 Community Leader Diversity Grant로 선정되어 다녀왔었는데 리인벤트에 AWS 자격증 소지자만 따로 출입할 수 있는 라운지가 있다는 걸 알게 되었다.(사실 미국가기전부터 알았으나 의욕만 앞서고 이래저래 하다가 시험..