typeScript8 [FP] Type Safe Pipe 함수 만들기 목차1. Pipe 함수 소개2. pipe(arg, f1, f2) vs pipe(f1, f2)(arg)3. Typescript 적용4. 마치면서 1. Pipe 함수 소개지난 curry 함수에 이어 이번엔 pipe 함수를 만들어보려고 한다. Pipe 함수는 여러 개의 함수를 왼쪽에서 오른쪽으로 순차적으로 실행하는 함수이다. 데이터 변환의 흐름이 명확하게 표현되어 코드의 동작 흐름을 더 직관적으로 볼 수 있고, 선언적 프로그래밍 스타일을 더 쉽게 적용할 수 있다. 다음 코드를 보자. const add = x => x + 1;const multiply = x => x * 2;const subtract = x => x - 3;const result = subtract(multiply(add(5)));console.. 2025. 2. 19. [FP] Type Safe Curry함수 만들기 0. 들어가며: 함수형 프로그래밍과 Curry요즘 함수형 프로그래밍(FP)을 공부하면서 "Currying"이라는 개념을 마주하게 되었다. 처음에는 단순히 복잡한 함수를 더 단순한 함수로 분해하는 기법으로만 보였는데, 깊이 들여다보니 Currying이 FP의 철학을 가장 잘 표현하는 기법 중 하나라는 생각이 들었다. 📌 FP의 핵심 철학FP는 다음과 같은 핵심 원칙들을 강조한다. - 함수를 일급 객체(First-Class Citizen)로 취급- 불변성(Immutability)- 순수 함수(Pure Function)- 선언형 프로그래밍(Declarative Programming)- 함수 합성(Composition), 모듈화(Modularity)- 높은 수준의 추상화(Abstraction) 이 원칙들은 .. 2025. 2. 1. [WebRTC] 다대다 화상회의: OpenVidu를 도입하기까지의 자료조사 목차- Short Review- 1:1 통신- 그럼 다대다 화상회의는?- Kurento- Openvidu - 디스코드 클론코딩 1. Short Review - 1:1 통신지난번엔 WebRTC로 1:1 화상회의가 구현되는 flow를 정리해 봤다. 간단하게 복습해 보자. WebRTC: 화상 회의를 구현하는 방법목차- 프롤로그- WebRTC의 동작 원리- Signaling Flow - 마치면서 1. 프롤로그채팅을 구현하기 위해서는 지속적인 연결을 유지하는 웹소켓을 사용한다. 웹소켓에서는 A가 B에게 채팅을 보낼 때 두 사hwanheejung.tistory.com 1.1. 연결이 수립되기까지의 Flow크게 SDP Offer/Answer 과정과 ICE Candidate 교환 과정으로 나눌 수 있다. 이 두 과정.. 2024. 7. 21. [DizzyCode] 디스코드 클론코딩, 시작! 목차 - 프로젝트의 시작 - 우리끼리의 용어 - 아키텍처 선정: FDA - 협업을 위한 프로젝트 기본 세팅 - 상태관리: React Query + Zustand 1. 프로젝트의 시작5월 말 황00씨로부터 간단하게 프로젝트 하나 할 건데 할래?라고 제안이 들어왔다. 7월은 절대 안 넘어갈 거고 6월까지 무조건 끝낼 수 있다고 했다. 심지어 6월에는 기말고사가 있는데 시험준비와 병행을 해도 충분히 끝낼 수 있을 정도로 간.단.한. 프로젝트라고 했다. 이 말을 믿어버렸다. (취업사기.. 오히려좋아?) 프로젝트는 디스코드를 클론코딩하는 건데, 안 그래도 채팅을 만들어보고 싶었어서 흥미롭게 시작할 수 있었다. 그리고 클론코딩이라 기획 단계를 스킵할 수 있어서 기술에만 집중할 수 있다는 점이 특히 마음에 들었다. .. 2024. 7. 2. TSC: 타입스크립트가 자바스크립트로 바뀌는 과정 목차- 프롤로그- TSC Architecture- Processing Overview- 에러 처리1. 프롤로그자바스크립트는 개발자가 실수를 해도 종종 에러를 명시적으로 표시하지 않는다. 아래 예시를 보자. let result = "5" + 1; // 결과: "51" let check = "5" == 5; // 결과: true (동등 연산자는 타입을 강제 변환함)let person = { name: "그냥하는거지뭐~" };console.log(person.age); // 결과: undefined (에러가 발생하지 않고 undefined 반환) 이처럼 예측 가능성이 너무 떨어진다. 특히 서버에서 클라이언트로 데이터를 전송할 때나 React에서 데이터 흐름을 설계할 때, 데이터의 타입을 정확히 관.. 2024. 4. 30. TypeScript 100% 활용하기 목차 - 프롤로그 - 1. 조건부 타입으로 타입 좁혀나가기 - 2. 매핑된 타입으로 깔꼼하게 - 3. 객체를 타입화할때 Record? Index Signature? - 4. 타입 가드 - 5. Redux + TS: configureStore.hooks.ts 프롤로그: 리액트와 타입스크립트의 케미 리액트의 렌더링 과정에서 데이터는 핵심적인 역할을 한다. 리액트의 동작 원리는 모두 데이터의 흐름을 기반으로 한다고 해도 과언이 아니다. 하지만 동적 타입 언어인 자바스크립트에서는 변수의 타입이 실행 시점에 결정되기 때문에, 개발자의 의도와 다르게 타입이 변환되어 예상치 못한 오류가 발생할 수 있다. 예를 들어, 숫자를 예상했지만 문자열이 전달될 경우, 불필요한 타입 변환으로 인한 성능 저하 또는 런타임 오류가 .. 2024. 4. 12. 이전 1 2 다음
