WebSocket은 무엇인가클라이언트와 서버 간의지속적인 전이중 연결을 제공하는 통신 프로토콜입니다. HTTP 프로토콜과 달리, WebSocket은 한번 연결이 설정되면 양방향으로 데이터를 자유롭게 교환할 수 있습니다. 이는 실시간 업데이트와 즉각적인 데이터 전송을 필요로 하는 애츨리케이션에 이상적입니다.WebSocket의 원리OSI 7계층과 WebSocketOSI 모델은 네트워크 통신을 7계층으로 나눈 모델입니다. WebSocket은 주로 전송계층(TCP)과 응용계층(HTTP/HTTPS)에서 작동합니다. 초기 연결설정은 HTTP/HTTPS 프로토콜을 통해 이루어지고, 연결이 설정되면 전송계층의 TCP를 통해 양방향 통신이 이루어집니다. WebSocket의 동작 원리핸드쉐이크: 클라이언트는 HTTP 요청..

rebase rebase는 merge와 함께 다른 브랜치로 합칠 때 사용됩니다. rebase는 말 그대로 base를 변경하는 것입니다.   main 브랜치인 C1에서 bugFix 브랜치를 분기했습니다. bugFix의 base는 C1이 됩니다. base란 현재 브랜치(bugFix)가 다른 브랜치 위로 이동되기 전의 공통 조상을 의미합니다. 즉, bugFix와 main의 공통 조상은 C1이 되는겁니다.   이제 `git rebase main`을 질의하면, bugFix의 커밋들을 main의 마지막 커밋으로부터 재적용하는 작업입니다. 이 과정에서 base가 변경됩니다. bugFix의 base가 C1에서 C7로 변경됩니다. 반대로 이번에는 main 브랜치에서 `git rebase bugFix`를 해보겠습니다. m..

Node.js를 공부하다가 보니 문득 헷갈렸습니다. Javascript에서 모든 객체는 Object를 상속합니다. 그럼 window, global과 같은 전역객체도 Object 객체를 상속하는걸까요. 위의 이미지와 같이 Object와 EventTarget과 window객체가 프로토타입 체인상에 존재한다는 것을 확인할 수 있습니다. 그런데 document는 window에 속한 객체이니까 Node가 window일까요? 그렇지 않습니다. 그렇다고 Node를 상속하지도 않습니다. 그럼 window는 어디에 있고 Node는 뭘까요. 분명 이 사이에 window객체가 있을거 같은데요. 모던 자바스크립트 Deep Dive의 20장 '실행 컨텍스트'에서 정답을 찾을 수 있었습니다. 전역 객체는 전역 코드가 평가되기 이..

자바스크립트 딥 다이브를 읽다가 문득 궁금해졌습니다. 함수는 호출될 때마다 실행 컨텍스트가 생성됩니다. 이에 반해 클래스는 인스턴스가 생성될 때 생성되는 메소드를 제외하고, 생성된 클래스 객체 자체가 재사용됩니다. 그렇다면, 매번 새롭게 만들어지는 함수형 컴포넌트보다 클래스형 컴포넌트가 메모리 사용 측면에서 더 뛰어난게 아닐까요. 그런데 왜 React에서는 클래스형 컴포넌트보다 함수형 컴포넌트의 사용을 장려하는 것 일까요. import React, { useState } from 'react'; function FunctionalComponent() { const [count, setCount ] = useState(0); function handleButtoClick() { setCount(count ..

new Error()와 new Promise.reject()는 모두 예외를 발생시키는 메소드입니다. 그러나 사용 용도가 다르므로, 주로 다른 상황에서 사용됩니다. new Error()는 예외 상황이 발생했을 때, 개발자가 사용하기 위한 에러 객체를 생성합니다. 이 객체는 예외 발생 원인, 위치, 스택 트레이스 등을 포함할 수 있으며, 개발자가 디버깅을 할 때 유용합니다. 일반적으로, throw new Error() 구문을 사용하여 예외를 발생시키며, try...catch 문을 사용하여 예외를 처리합니다. 반면에 new Promise.reject()는 Promise 객체에서 거부(reject) 상태를 생성합니다. 이는 비동기 작업이 실패한 경우, 해당 Promise 객체가 거부 상태를 가지게 됩니다. Pr..

어떤 블로그에서 `return Error()`와 `return new Error()`를 혼용해서 사용하는 것을 보았다. `Error()`와 `new Error()`는 무슨 차이가 있을까. `new Error()`는 `Error` 객체의 새 인스턴스를 만듭니다. `Error` 객체는 예외를 나타내는데 사용됩니다. 이 객체는 `name` 프로퍼티와 `message`프로퍼티를 가지며, `stack` 프로퍼티도 포함할 수 있습니다. `new Error()`를 호출하면 새로운 `Error` 객체가 생성되고, 해당 객체는 반환됩니다. 반면에 `Error()`는 `new Error()`와 다른 방식으로 사용됩니다. `Error()`를 호출하면 `new Error(message)`와 같은 결과가 나옵니다. 즉, `ne..

`return new Error()`와 `throw new Error()`는 모두 `Error` 객체를 생성하여 함수 호출자에게 오류를 알리는 방법입니다. 그러나 이 두가지 방법은 약간 다른 결과를 가져옵니다. return new Error() `return new Error()`는 함수의 실행을 중지하지 않습니다. `Error` 객체를 반환하며, 이 객체는 함수 호출자에게 전달됩니다. 호출자는 반환된 `Error` 객체를 처리허가나, 그냥 무시할 수 있습니다. throw new Error() `throw new Error()`는 함수의 실행을 즉시 중지하고 `Error` 객체를 throw합니다. 이것은 호출자에게 예외를 발생시키는 것입니다. 호출자는 예외를 처리해야 합니다. 예를 들어봅시다. throw..

https://gist.github.com/qutek/ab19318960c7ee72b7dcc5ef34ef01f6 Axios interceptor for refresh token when you have multiple parallel requests. Demo implementation: https://github.com/Godofbrows Axios interceptor for refresh token when you have multiple parallel requests. Demo implementation: https://github.com/Godofbrowser/axios-refresh-multiple-request - axios.refresh_token.1.js gist.github.com h..