드리프트의 뉴 코딩 이야기

AbortController, 아직 제대로 모르세요? - 숨겨진 기능부터 활용 꿀팁까지! 개발자라면 AbortController, 다들 한 번쯤 들어보셨을 텐데요.Fetch (fetch) 요청 취소하는 기본적인 기능만 알고 계신 분들이 많을 거예요.하지만 AbortController는 생각보다 훨씬 강력한 기능을 숨겨놓고 있다는 사실, 알고 계셨나요?Fetch (fetch) 요청 취소는 기본이고, 이벤트 리스너 (event listener) 관리, React Hooks (리액트 훅)에서도 유용하게 쓸 수 있다는데요.혹시 AbortController의 진짜 힘, 제대로 알고 계신가요?지금부터 AbortController의 숨겨진 기능과 활용법을 하나씩 파헤쳐 볼까요?AbortController로 Fetch..

Node.js Cluster (클러스터) 완벽 해부: 핵심 개념 파헤쳐보기 - Node.js (노드js) 성능 향상의 비밀, 알아볼까요? 혹시 PM2 (PM2)로 Node.js (노드js) 프로세스를 관리해 보신 적 있으신가요?PM2 (PM2)에는 클러스터 모드라는 기능이 있는데요.이 모드를 사용하면 Node.js (노드js)가 여러 개의 프로세스를 만들 수 있다는 사실, 알고 계셨나요?클러스터 모드에서 인스턴스 수를 max로 설정하면 PM2 (PM2)가 서버의 CPU (중앙처리장치) 코어 수에 맞춰서 Node (노드) 프로세스를 자동으로 생성해줍니다.정말 편리하죠?PM2 (PM2)가 이런 기능을 제공할 수 있는 건 바로 Node.js (노드js)의 Cluster (클러스터) 모듈 덕분인데요.Cluste..

안녕하세요!개발하다 보면 에러 때문에 머리 싸맬 때가 많으시죠?특히 에러의 원인을 찾는 건 정말 어려운 숙제인데요.오늘은 JavaScript (자바스크립트) 디버깅을 훨씬 수월하게 만들어주는 숨겨진 보석 같은 기능, 바로 error.cause에 대해 알아보려고 합니다.디버깅의 어려움디버깅하면서 가장 힘든 점이 뭘까요?저는 단연 에러의 근본 원인을 추적하는 거라고 생각하는데요.이런 상황을 한번 상상해보세요.const func = () => { doSth('A'); doSth('B');}; func 함수가 에러를 던졌을 때, 이 에러가 어느 단계에서 발생했는지 바로 알 수 있을까요?doSth('A') 때문인지, doSth('B') 때문인지, 아니면 func 함수 자체의 문제인지… 에러 메시지만 봐서는 도..

Node.js Event Loop 속속들이 파헤쳐보기: 싱글 스레드 모델의 비밀, 알아볼까요?Node.js (노드js)는 이벤트 기반에 비동기 I/O (입출력) 방식을 사용해서, 싱글 스레드인데도 엄청난 동시성을 자랑하는 JavaScript (자바스크립트) 실행 환경을 만들어냈습니다.싱글 스레드라고 하면 뭔가 하나씩 순서대로 처리해야 할 것 같은데, Node.js (노드js)는 어떻게 단 하나의 스레드로 높은 동시성과 비동기 I/O (입출력)를 가능하게 했을까요?오늘은 이 질문을 중심으로 Node.js (노드js)의 싱글 스레드 모델을 속속들이 파헤쳐보는 시간을 가져보겠습니다.높은 동시성을 위한 전략보통 높은 동시성을 구현하려면 멀티 스레드 모델을 사용하는 것이 일반적입니다.서버가 클라이언트 요청마다 스..

TypeScript 컴파일러, Go 언어로 갈아탄다고요?! 속사정 한번 알아볼까요?최근에 TypeScript (타입스크립트) 컴파일러와 도구를 Go (고) 언어로 새롭게 개발하고 있다는 소식, 혹시 들어보셨나요?이번 네이티브 버전으로 에디터 실행 속도가 엄청나게 빨라지고, 빌드 시간도 무려 10배나 단축될 거라고 하는데요.메모리 사용량까지 줄어든다고 하니 정말 기대되지 않으세요?이번 블로그 글에서는 이 소식에 숨겨진 자세한 이야기를 한번 풀어볼까 합니다.코드 기반: JavaScript (자바스크립트) vs. 네이티브혼란을 막기 위해 몇 가지 용어를 먼저 정리하고 넘어갈게요.JavaScript (자바스크립트) 코드 기반: 현재 TypeScript (타입스크립트)의 코드 기반을 말합니다. 놀랍게도 TypeS..

TypeScript 객체 타입 Union과 Intersection안녕하세요!오늘은 TypeScript (타입스크립트)에서 객체 타입의 Union (유니온)과 Intersection (인터섹션)을 어떻게 활용할 수 있는지 쉽고 재미있게 알아보는 시간을 가져볼까 합니다.이번 글에서 ‘객체 타입’이라는 용어는 다음과 같은 타입들을 의미합니다.객체 리터럴 타입 (Object literal type)인터페이스 타입 (Interface type)Mapped 타입 (Mapped type) (예: Record (레코드))객체 타입 Union (유니온)에서 Discriminated Union (디스크리미네이티드 유니온)으로객체 타입의 Union (유니온)은 하나의 타입이 여러 가지 모습으로 표현될 수 있을 때 유용하게 ..

제가 타입스크립트(TypeScript)를 강력 추천하는 이유대략적으로, 타입스크립트(TypeScript)는 자바스크립트(JavaScript)에 타입(Type) 정보를 더한 것이라고 볼 수 있는데요.이 추가된 타입 정보는 타입스크립트(TypeScript) 코드가 자바스크립트 엔진(JavaScript Engine)에 의해 실행되기 전에 제거됩니다.그렇기 때문에 타입스크립트(TypeScript)를 작성하고 배포하는 것은 순수한 자바스크립트(JavaScript)보다 조금 더 손이 가는 일이긴 한데요.'과연 이렇게 추가적인 노력이 들 만큼 가치가 있을까?' 하고 의문이 드실 수 있습니다.이번 글에서 저는 '네, 그럴 가치가 있습니다!'라고 힘주어 말씀드리려고 하는데요.타입스크립트(TypeScript)에 대해 아직..

타입스크립트(TypeScript)가 뭔가요? 자바스크립트(JavaScript) 개발자를 위한 간단 소개혹시 자바스크립트(JavaScript)는 좀 다뤄봤는데, 타입스크립트(TypeScript)는 어떤 느낌일지 궁금하신가요?그렇다면 이 글이 딱인데요.(더 자세히 배우기 전에, '아~ 이런 거구나' 하고 감을 잡는 첫 단계라고 생각하시면 좋습니다.) 이 글을 읽으시면 아래 질문들에 대한 답을 얻으실 수 있습니다.타입스크립트(TypeScript) 코드는 자바스크립트(JavaScript) 코드와 어떻게 다른가요?타입스크립트(TypeScript) 코드는 어떻게 실행되나요?타입스크립트(TypeScript)는 IDE(통합 개발 환경)에서 코드를 편집할 때 어떻게 도움이 되나요?기타 등등...잠깐! 이 글은 타입스크립..

타입스크립트(TypeScript)에서 타입(Type) 검사하기: 복잡한 것도 문제없어요!이번 글에서는 조금 까다로울 수 있는 타입스크립트(TypeScript)의 '타입(Type)'들이 우리가 생각한 대로 잘 작동하는지 어떻게 똑똑하게 '검사'할 수 있는지 함께 알아볼 건데요.이걸 제대로 하려면, 코드 실행 단계가 아닌 '타입' 그 자체를 다루는 레벨(Type Level)에서 '이건 이거다!'라고 확실히 말해주는 '단언(Assertion)'과 몇 가지 도구들이 필요합니다.1. 타입 레벨(Type Level)에서 단언(Asserting)한다는 건 뭘까요?복잡한 타입을 짜는 건, 마치 우리가 아는 프로그래밍과는 다른 차원에서 코딩하는 것과 비슷한데요.프로그램 레벨(Program Level): 우리가 보통 코드..

안녕하세요!오늘은 코딩할 때 실수를 줄여주는 고마운 친구, 타입스크립트(TypeScript)에 대한 재미있는 이야기를 해볼까 하는데요.특히 타입스크립트(TypeScript)가 코드 속 데이터의 종류(타입)를 확인하는 방법 중 하나인 '조건부 타입'이라는 기능에 숨겨진 비밀을 함께 알아볼까 합니다.타입스크립트(TypeScript) 설명서에는 이런 말이 있습니다."조건부 타입으로 뭔가를 확인하면, 우리는 새로운 정보를 얻을 수 있어요.마치 탐정이 단서를 찾아 범위를 좁혀가듯, 조건부 타입의 '참(true)' 결과는 우리가 다루는 데이터(제네릭)의 종류를 더 정확하게 알려줍니다."이게 무슨 말일까요?생각보다 더 신기한 방식으로 작동하는데요, 한번 쉽게 풀어볼까요?1. 데이터 종류(타입) 알아맞히기 기초: '범..