#api
노트 34개
Frontend › JavaScript
자바스크립트에서 타임존 다루기타임존은 오프셋이 아니라 한 지역의 표준시·서머타임 변경 이력 전체이고, 표준은 IANA tz database다. JS의 Date는 OS의 로컬 타임존에 묶여 있어 오프셋을 더하고 빼는 방식으로는 다른 타임존의 날짜 연산을 정확히 할 수 없다.
Frontend › JavaScript
JSON: stringify와 parseJSON은 언어와 무관한 데이터 교환용 텍스트 형식이다. 문법 규칙(큰따옴표, 주석 없음), JSON.stringify가 빠뜨리거나 바꾸는 값(undefined·함수·Symbol·NaN·Date·Map)과 순환 참조·BigInt 오류, replacer·space·toJSON으로 직렬화를 조절하는 법, JSON.parse의 reviver로 Date를 되살리는 법, 큰 정수를 지키는 source 접근과 JSON.rawJSON, 깊은 복사용으로는 structuredClone을 쓰는 이유까지 정리한다.
Frontend › React
React에서 음성 녹음하고 파일로 보내기getUserMedia로 마이크 권한을 얻고 MediaRecorder로 녹음해 Blob을 만든 뒤, 다운로드 링크로 저장하거나 FormData(multipart/form-data)로 서버에 보내는 흐름. react-media-recorder로 간단히 쓰는 방법까지.
Frontend › React
TanStack Query(React Query)서버에서 가져온 데이터의 캐싱·재요청·로딩/에러 상태를 훅 하나로 다루게 해 주는 서버 상태 라이브러리. QueryClientProvider 설정, query key 설계, 캐시의 fresh·stale·inactive 생명 주기와 isPending·isFetching, 다시 가져오는 시점(mount·focus·reconnect·interval), select·enabled·의존 쿼리·useQueries, 페이지네이션과 useInfiniteQuery, useMutation 뒤 무효화·setQueryData·낙관적 업데이트, SSR(dehydrate·HydrationBoundary)까지.
Frontend › Testing
API 모킹: MSW와 json-server백엔드 API가 없거나 불안정할 때 프론트엔드가 가짜 응답으로 개발·테스트하는 방법. 코드 속 가짜 데이터, json-server 같은 가짜 REST 서버, 네트워크 단에서 요청을 가로채는 MSW를 비교하고, MSW 2의 핸들러(http·HttpResponse)와 브라우저(Service Worker)·Node(setupServer) 설정, 테스트에서 핸들러를 바꿔 끼우는 법을 정리한다.
Frontend › Web
권한 모델과 기기 API브라우저가 기기 기능을 여는 방식. 보안 컨텍스트·Permissions-Policy·사용자 동작·권한 프롬프트를 묶어 보여 주는 Permissions API의 query()와 granted·denied·prompt 상태, 그리고 권한이 걸린 기기 API인 위치, 기기 방향·움직임(iOS의 requestPermission), 게임패드(폴링), 음성 합성·인식, 진동의 쓰임과 지원 범위를 정리한다.
Frontend › Web
미디어 캡처와 Web Audio API브라우저에서 카메라·마이크·화면을 받아 다루는 Media Capture and Streams(MediaStream·MediaStreamTrack의 소스와 소비자, getUserMedia·getDisplayMedia, enumerateDevices)와, 소리를 노드 그래프로 만들고 가공하는 Web Audio API(AudioContext, 소스·효과·분석·출력 노드, 정밀한 예약 재생, 자동 재생 정책과 resume, AudioWorklet)를 정리한다.
Backend
클라이언트의 요청을 받아 비즈니스 로직을 처리하고 데이터를 저장·제공하는 서버 쪽 개발 지식 모음.
Backend › Architecture
개발자 머피의 법칙: 백엔드 방어 체크리스트잘못될 수 있는 것은 결국 잘못된다. 클라이언트 값 불신, 서버 재계산, 인증과 권한 분리, 입력 범위 제한, 운영 권한 통제, 배치·로그·알림 분리, SPOF 제거처럼 감당할 수 없는 사고는 이미 일어난 것으로 보고 먼저 막는다.
Backend › Architecture
마이크로서비스 아키텍처큰 시스템을 비즈니스 기능 단위의 작은 서비스로 나누고, 서비스마다 데이터와 배포를 따로 갖게 하는 구조다. 운영에는 API 게이트웨이, 서비스 레지스트리, 인증 서버, 비동기 메시징, 메트릭·로그 수집이 따라붙는다. 서비스 협업은 오케스트레이션과 코레오그래피 두 방식이 있고, 지연에 민감하거나 상태를 메모리에 둬야 하는 시스템에는 모놀리스가 낫다.
Backend › Architecture
아키텍처와 API 계층의 진화: 모놀리스에서 페더레이션까지대규모 서비스가 모놀리스 → 서비스 분리(SOA·마이크로서비스) → 매크로서비스로 옮겨 가는 이유와, 그에 맞춰 API 계층이 직접 호출 → 게이트웨이 집계 → BFF → GraphQL 페더레이션으로 바뀌는 흐름을 정리했다. 반대로 모놀리스와 단순한 백엔드로 큰 트래픽을 감당하는 사례와 여러 SaaS API를 묶는 통합 플랫폼도 다룬다.
Backend › Architecture
장애 확산을 막는 복원력 패턴작은 오류가 연쇄 장애로 번지지 않게 하는 여덟 가지 패턴(타임아웃, 재시도, 서킷 브레이커, 속도 제한, 부하 차단, 벌크헤드, 배압, 크래시 허용), 속도 제한 알고리즘의 개요, 벌크헤드 격리 방식과 배압 전략, 재시도를 안전하게 만드는 백오프·지터 전략, 4xx·5xx별 재시도 규칙, 재시도의 전제 조건인 멱등성을 적용해야 하는 곳을 정리했다.
Backend › Architecture
API 게이트웨이클라이언트와 백엔드 서비스 사이의 단일 입구인 API 게이트웨이. 라우팅·인증·레이트 리밋·요청 변환·응답 조합·캐시 같은 기능, 요청 하나가 게이트웨이를 지나는 순서, 생태계·마켓플레이스·다중 플랫폼 같은 쓰임, 그리고 리버스 프록시·로드 밸런서·서비스 메시·공통 라이브러리와의 차이와 함께 쓰는 배치를 정리했다.
Backend › Django
DRF Serializer와 관계 표현Django REST Framework의 Serializer로 모델을 JSON으로 바꾸고, 중첩 Serializer로 1:N·M:N 관계를 응답에 담으며, api_view로 CRUD를 구현하는 방법.
Backend › Express
Express 라우팅과 CRUD APIExpress로 서버를 띄우고 Router로 경로를 분리해 REST 방식의 CRUD API를 만드는 방법.
Backend › NestJS
NestJS 파일 업로드(Multer)multipart/form-data 요청을 Multer와 FileInterceptor로 받아 이미지·영상 같은 미디어 파일을 저장하는 방법.
Backend › NestJS
NestJS Controller들어오는 요청을 경로·메서드별로 받아 파라미터를 꺼내고 응답을 반환하는 NestJS의 라우팅 계층.
Backend › NestJS
NestJS DTO와 Validation요청 바디를 DTO 클래스로 정의하고 class-validator와 ValidationPipe로 자동 검증하는 패턴, 회원가입 구현 예.
Backend › NestJS
Swagger로 API 문서화@nestjs/swagger로 코드의 데코레이터에서 OpenAPI 문서를 자동 생성하고, 운영 환경에서는 Basic Auth로 문서 접근을 막는 방법.
Backend › Web Basics
웹훅과 폴링다른 서비스의 변화를 알아내는 두 방법. 폴링은 내가 주기적으로 묻고, 웹훅은 상대가 이벤트가 생길 때 내 엔드포인트를 호출한다. 동작 흐름과 장단점, 고르는 기준, 웹훅을 받는 쪽이 갖춰야 할 서명 검증·빠른 응답·멱등 처리·재시도 대비를 정리했다.
Backend › Web Basics
API 보안 체크리스트API를 공개하기 전에 점검할 보안 항목을 전송·입력·인증과 인가·노출 범위·운영 단계로 묶었다. 한 가지 방어에 기대지 말고 여러 겹을 쌓는 게 핵심이다.
Backend › Web Basics
API 아키텍처 스타일: SOAP·REST·GraphQL·gRPC·WebSocket·WebhookAPI는 시스템끼리 기능과 데이터를 주고받는 약속이다. 대표적인 여섯 가지 스타일(SOAP, REST, GraphQL, gRPC, WebSocket, Webhook)을 통신 방향·데이터 형식·잘 맞는 곳으로 비교하고, REST·GraphQL·gRPC를 계약·응답 모양·전송·스트리밍·오류 처리·캐시·브라우저 지원·버전 관리 등 축별로 나란히 놓았다. API와 SDK의 차이, 공개 범위에 따른 API 종류, API를 배울 때 거치는 주제 지도도 정리했다.
Backend › Web Basics
API 키와 HMAC 요청 서명서버끼리 호출하는 API에서 요청마다 '누가 보냈고 중간에 바뀌지 않았나'를 증명하는 HMAC 요청 서명. 앱 ID·액세스 키·시크릿 키의 역할, 서명할 문자열을 만드는 법, 타임스탬프와 논스로 재전송을 막는 법, 서버의 검증 순서, 토큰 방식과의 비교를 정리했다.
Backend › Web Basics
API 테스트의 종류API를 검증하는 아홉 가지 테스트(스모크, 기능, 통합, 회귀, 부하, 스트레스, 보안, UI, 퍼즈)가 각각 어떤 질문에 답하는지, 개발에서 배포까지 어느 단계에서 돌리는지, 부하와 스트레스의 차이와 퍼즈 테스트가 찾는 것을 정리했다.
Backend › Web Basics
API 페이지네이션큰 목록을 나눠 내려 주는 API 페이지네이션의 여섯 가지 방식(오프셋, 페이지 번호, 커서, 키셋, 시간 기반, 혼합)을 요청 모양·DB 쿼리·장단점으로 비교한다. 깊은 페이지에서 오프셋이 느려지는 이유, 데이터가 바뀔 때 생기는 중복·누락, 정렬 키에 동점 깨기를 넣는 규칙, 응답에 다음 페이지 정보를 싣는 법까지.
Backend › Web Basics
Base64 인코딩바이너리 데이터를 ASCII 문자 64개만으로 바꿔 텍스트용 채널로 안전하게 보내는 인코딩. 6비트씩 끊어 변환하는 원리, 패딩, 약 33% 커지는 비용, 이미지를 API에 보내는 예를 정리한다.
Backend › Web Basics
GraphQLGraphQL은 타입 스키마 위에서 클라이언트가 필요한 필드를 골라 질의하는 API 질의 언어이자 런타임이다. 쿼리·뮤테이션·구독, REST 대신 고를 때의 기준, N+1·캐시·악성 쿼리 같은 약점과 대책, 클라이언트 래핑·BFF·모놀리식·페더레이션 네 가지 도입 패턴, 등록된 쿼리로 운영하는 방식을 정리했다.
Backend › Web Basics
gRPC: Protocol Buffers로 정의하는 RPCgRPC는 .proto 파일로 서비스 계약을 정의하고, 생성된 스텁으로 원격 메서드를 로컬 함수처럼 부르는 HTTP/2 기반 이진 RPC 프레임워크다. Protocol Buffers의 태그·varint 직렬화와 JSON 비교, 네 가지 호출 방식, Node.js 예제, 브라우저 제약과 도입 판단 기준을 정리했다.
Backend › Web Basics
REST API 설계자원을 URI로 표현하고 HTTP 메서드로 행위를 나타내는 API 설계 방식과 그 규칙. REST의 여섯 제약과 균일한 인터페이스(자기 서술적 메시지·HATEOAS), PUT·PATCH·POST 고르기, URI 규칙과 자원 원형, 상태 코드 선택과 오류 응답(RFC 9457), 멱등 키·버전 관리 방식·비동기 요청·조건부 요청·응답 모양 같은 실무 설계 팁까지.
Backend
백엔드 개발자가 알아야 할 것인터넷·DNS·HTTP부터 데이터베이스, 언어와 웹 프레임워크, API 스타일(REST·GraphQL·gRPC), 버전 관리, 인증, 리눅스, CI/CD·도커·클라우드, 보안, 아키텍처까지 백엔드 개발자의 지식 지도. 다 외우는 것이 아니라 필요할 때 찾아 쓸 수 있을 만큼 아는 것이 목표다.
Computer Science › Network
RFC와 요구 수준 키워드인터넷 표준 문서인 RFC가 무엇이고 어떻게 읽는지, 그리고 명세에서 MUST·SHOULD·MAY가 정확히 무엇을 뜻하는지 정한 RFC 2119·8174의 요구 수준 키워드를 정리한다.
AI & Data
네이버 블로그 크롤링네이버 검색 API로 키워드별 블로그 글 URL·제목·작성일을 모으고, iframe 안의 본문은 PostView 주소나 Selenium으로 받아 BeautifulSoup으로 추출해 CSV로 저장하는 흐름. API 한도, iframe 구조, 선택자 변경, 예외 처리 함정을 정리한다.
Tools
유의적 버전(SemVer)MAJOR.MINOR.PATCH 세 숫자로 변경의 성격(호환 깨짐, 기능 추가, 버그 수정)을 알리는 버전 규칙. 각 자리를 올리는 기준과 예시 흐름, 0.x 단계의 의미, 프리릴리스와 빌드 메타데이터, 버전 비교 순서, npm의 ^·~ 범위가 SemVer에 기대는 방식을 정리했다.
Career › Work
소프트웨어 문서화: 네 가지 문서 유형과 코드에서 문서 만들기소프트웨어 문서는 목적에 따라 튜토리얼·하우투 가이드·레퍼런스·해설의 네 유형으로 나뉘고(Diátaxis), 한 문서는 한 유형만 따른다. 레퍼런스는 코드 구조를 따라 주석에서 자동 생성해 코드와 어긋나지 않게 한다. 무엇은 이름으로, 왜는 기록으로 남긴다. 프로젝트의 입구인 README에 담을 것과 README를 먼저 쓰는 README 주도 개발도 다룬다.