OpenAPI & Service Generator
swagger.json 한 파일에서 TypeScript paths, DTO type과 호출 service를 만듭니다.
1. 백엔드가 swagger.json을 제공
Swagger는 Springdoc, 다른 OpenAPI 도구 또는 직접 작성한 파일이어도 됩니다. 제가 사용하는 WebFlux functional endpoint 프로젝트에서는webflux-fe-dev-assistant가 router와 handler를 읽어/for-local/get-swagger에서 문서를 제공합니다.
2. 프론트에서 생성 script 실행
generateSwagger.cjs
jsHTTP로 문서를 받을 수 없는 환경에서는 같은 옵션으로generateSwaggerFromFile을 사용하면 됩니다.
3. 생성되는 파일
commonService.ts에 두고, 화면에서는 auto의 함수를 import하세요.파일명과 함수명 규칙
서비스 파일명은 URL의 앞 두 구간으로, 함수명은 세 번째 이후 구간으로 만듭니다. 그래서 파일 위치와 함수 이름을 endpoint만 보고 예측할 수 있습니다.
GET /api/business/workplaces/search
ApiBusinessService.ts → workplacesSearch({ params })
GET /api/business/workplaces/{id}
ApiBusinessService.ts → workplacesById({ path })
GET /api/court-case/detail/incidents/search
ApiCourtCaseService.ts → detailIncidentsSearch({ params })
POST /oauth2/login
Oauth2LoginService.ts → post({ body })
호출 인자 이름은 고정
GeneratedServiceUsage.tsx
tsxquery parameter는 param이 아니라params, path variable은path, request body는body를 사용합니다. 각 객체의 내부 타입은 Swagger에서 생성됩니다.