My Library Docs

Multi-root Sidebar

flex-layout

  • Getting Started

  • Guides

  • Reference

typed-rx-http

  • Getting Started

  • Guides

  • Reference

global-rx-state

  • Getting Started

  • Guides

  • Reference

webflux-fe-dev-assistant

reactive-mongo-dsl

시작하기

먼저 typed-rx-http Core client 자체의 사용법을 설명하고, 그 다음 필요한 프로젝트에서만 프로젝트 소유 공용 HTTP adapter와 Swagger 자동 생성 service를 연결하는 방식을 설명합니다.


1. 설치
bash
2. 자동 생성 없이 Core client 직접 사용

먼저 가장 기본적인 사용법은 createHttpClient<Paths>()로 client를 한 번 만들고, 그 client의 callApi를 호출하는 것입니다. Paths는 OpenAPI에서 생성한 paths 타입이 일반적이지만, 같은 구조와 호환되는 직접 정의한 타입도 사용할 수 있습니다.

httpClient.ts
ts
3. 선택: rxjsHttpService/commonService는 무엇인가

문서에서 rxjsHttpService.ts 또는 commonService.ts라고 부르는 것은 라이브러리가 자동 생성하는 고정 파일명이 아닙니다. 프로젝트가 직접 소유하는 HTTP adapter 파일입니다. 자동 생성 REST service 여러 개가 createHttpClient를 각각 만들지 않고, 이 파일이 export하는 callApi/callApiStream/cache 함수를 공통 진입점으로 사용합니다.

가장 작은 형태는 아래 전체 코드처럼 headerStore와 createHttpClient를 한 번 만들고 라이브러리의 메서드를 프로젝트 함수로 다시 export하는 것입니다. 자동 생성 service에서 cache 기능을 사용하지 않는다면 이 정도 구성만으로도 구조를 이해할 수 있습니다.

rxjsHttpService.ts
ts

실제 Next.js 프로젝트에서 세션 인증, SSR 요청별 Cookie/Authorization, CSR cache와 SSR cache까지 한 파일에서 공통 처리하려면 아래처럼 확장할 수 있습니다. 이 파일도 자동 생성물이 아니라 프로젝트 코드입니다.

rxjsHttpService.ts
ts
4. 선택: Swagger 자동 생성 service를 사용하는 경우

OpenAPI service 생성기를 연결한 뒤에는 화면에서 URL과 response type을 다시 작성하지 않습니다. 생성된 함수를 import하고 필요한 path, params, body만 넘깁니다.

MemberSearchPage.tsx
tsx
© 2026 Byeolnaerim. All rights reserved.소개개인정보처리방침