jopemachine. dev blog

개발 관련 개인적인 일상, 후기, 생각, 스터디, 문서 번역 등 각종 포스팅을 정리하고 공부하고, 공유합니다.

DOM, BOM 개념 정리

Frontend

DOM, BOM 개념 정리 BOM (Browser Object Model) 브라우저 객체 모델 location, history, navigator, screen, document 등등.. BOM이 DOM을 포함하는 개념이다. DOM과 달리 표준적인 정의가 없어 브라우저 별 구현에 ...

CSS 레이아웃

CSS 세부사항

CSS 레이아웃 Element의 크기는 Content box, padding, border, margin으로 구성됨 margin border와 외부 엘리먼트들 사이의 여백 border 엘리먼트의 가장자리. margin과 padding의 경계. padding 콘텐츠 박스와 border 사이의 여백. cont...

Rest API, Restful

웹 프로그래밍

Rest API, Restful REST (Representational State Transfer). Http method에 동사, URL엔 명사로 구성해 의미 체계를 구성해서 이 둘만으로 어떤 일을 하는 API인지 알게 하자. 즉, self-descriptive한 API를 구축하자는 것. Rest...

Http2

웹 프로그래밍

Http2 기존 HTTP 1.x 표준, 의미 체계을 대체하는 게 아니라 확장함. Http 1.x 클라이언트로 Http2 서버를 이용할 수 없음, 반대도 마찬가지. 주요 목표는 다중화, 헤더의 더 효율적인 압축, 서버 푸시, 요청의 우선순위 지정 기능 추가 라고 함. HTTP 1.x가...

Http 1.1

웹 프로그래밍

Http 1.1 keep-alive 옵션 Http는 비연결성 프로토콜로 상태를 갖지 않음. 즉, 매번 Handshake의 불필요한 오버헤드를 감당 해야함 그래서 Http 1.1에서 Keep-alive가 생겼다. Http 연결을 끊지 않고 유지해 놓는 것으로, Handshake의 오버 헤드를 없애준다. 파이프...

Typescript utility types

Typescript

Typescript utility types 타입스크립트는 타입 변환에 자주 사용되는 유틸리티 타입들을 global로 제공함. Partial 모든 프로퍼티 Optional로 만든다. 1 2 3 4 5 6 7 8 9 10 11 12 interface Todo { title: string; description: string;...

웹 소켓과 서버센트 이벤트 (Web socket vs Server sent event)

웹 프로그래밍

웹 소켓과 서버센트 이벤트 (Web socket vs Server sent event) 웹 소켓 양방향 통신, 단방향 통신인 Http와 구별됨. HTTP 풀링을 통한 구현보다 낮은 부하로 클라이언트와 서버 사이의 양방향 통신을 가능하게 하여 채팅 프로그램 등에 사용 가능함. 웹 소켓 handshak...

TLS, SSL

웹 프로그래밍

TLS, SSL 서버와 클라이언트 사이의 데이터를 암호화 하여 인터넷 보안을 유지. TLS, SSL은 암호화 유형을 결정하는 절차이지, 그 자체로 암호화를 나타내는 건 아님. TLS (Transport Layer Security) https 특성 상 http 보다 느릴 수 밖에 없지만 TLS ...

CORS, option method, preflight request

웹 프로그래밍

CORS, option method, preflight request CORS (Cross origin resource policy) 다른 도메인에 요청을 날리는 것은 브라우저에서 보안 상 허용하지 않음. 그러나 웹 서비스 구현 시 거의 반드시 필요한 작업. preflight의 response he...

Node.js stream에 대해

Node.js

Node.js Stream Types Readable Writable Duplex Transform 모두 EventEmitter를 상속해 이벤트 emit으로 구현하거나 다른 스트림에 파이프 시켜 구현할 수 있다. Readable 스트림의 경...