REST API Platform

💡 Postman 대체용 내부 테스트 도구 💡

📝 Project Overview (프로젝트 개요)

• 프로젝트 이름: REST API Platform - 통합문서뷰어 통합 테스트 개선
• 프로젝트 설명: 기존 통합 문서 뷰어의 변환 검사 문제를 개선하고, Postman을 대체할 수 있는 API 테스트 플랫폼을 개발했습니다.

⚙ Technology Stack (기술 스택)

Frotend

React	TypeScript	Vite	MUI

Backend

Node.js	Express

🧱 Project Structure (프로젝트 구조)

클린 아키텍처 및 DDD 적용 [리팩토링]

• 도메인 중심 설계: 각 기능을 독립적으로 관리, 비즈니스 로직은 domain/에서 처리.
• 기능 독립성: 각 기능(collections, folders, requests, workspaces)별로 모듈화.
• 상태 관리: 중앙 집중식 상태 관리 (stores/).
• 유지보수성: 기능별 독립적인 개발과 확장 용이.

src/
├── hooks/
├── stores/
├── features/
│   ├── collections/
│   │   ├── components/
│   │   │   ├── CollectionItem.tsx
│   │   │   ├── TheCollectionMenu.tsx
│   │   ├── NewCollection.tsx
│   │   ├── routes/
│   │   │   ├── CollectionRoutes.tsx
│   │   │   ├── routes.types.ts
│   │   ├── domain/
│   │       ├── CollectionEntity.ts
│   │       ├── service.ts
│   │       ├── config.ts
│   │       ├── config.types.ts
│   │       ├── CollectionLogic.ts
│   │       └── utils.ts
│   ├── folders/
│   │   ├── components/
│   │   │   ├── AddFolderMenuItem.tsx
│   │   │   ├── FolderTreeMenu.tsx
│   │   ├── routes/
│   │   │   └── FolderRoutes.tsx
│   │   ├── domain/
│   │       ├── FolderEntity.ts
│   │       ├── service.ts
│   │       ├── config.ts
│   │       ├── config.types.ts
│   │       ├── FolderLogic.ts
│   │       └── utils.ts
│   ├── requests/
│   │   ├── components/
│   │   │   ├── AddRequestMenuItem.tsx
│   │   │   ├── RequestTreeMenu.tsx
│   │   ├── routes/
│   │   │   └── RequestRoutes.tsx
│   │   ├── domain/
│   │       ├── RequestEntity.ts
│   │       ├── service.ts
│   │       ├── config.ts
│   │       ├── config.types.ts
│   │       ├── RequestLogic.ts
│   │       └── utils.ts
│   ├── workspaces/
│   │   ├── components/
│   │   │   ├── NewWorkspace.tsx
│   │   │   ├── WorkspaceTreeMenu.tsx
│   │   ├── routes/
│   │   │   └── WorkspaceRoutes.tsx
│   │   ├── domain/
│   │       ├── WorkspaceEntity.ts
│   │       ├── service.ts
│   │       ├── config.ts
│   │       ├── config.types.ts
│   │       ├── WorkspaceLogic.ts
│   │       └── utils.ts
├── utils/
│   ├── memoryRepository.test.ts
│   ├── memoryRepository.ts
│   └── NotFoundPage.tsx
├── app.tsx
└── main.tsx

📓 Document

• 완료 보고 자료 : REST_API_Platform_솔루션개발팀_공희진.pdf

• 아키텍처 설계 링크 : REST API Platform-Architecture

• 화면 디자인 가이드 링크 : REST API Platform-Design

🚀 리팩토링

리팩토링 전:

• 높은 의존성: 기능 추가/변경 시 많은 수정이 필요하고, 시스템 확장성 부족.
• 자바스크립트 사용: 안정성 낮고, 코드 오류 발생 가능성 큼.
• 상태 관리 비효율: 데이터 흐름 추적과 관리 어려움.
• 비즈니스 로직과 인프라 혼합: 시스템 수정 시 영향 범위 큼.
• 테스트 비효율: 테스트 작성 및 수정에 시간 소요.

리팩토링 후:

• 클린 아키텍처, DDD 적용: 기능별 분리로 확장성과 유지보수성 향상.
• 타입스크립트 도입: 정적 타입 체크로 코드 안정성 및 가독성 개선.
• 효율적인 상태 관리: Redux, Redux Persist로 상태 관리 최적화.
• 비즈니스 로직과 인프라 분리: 시스템 변경 시 다른 모듈 영향 최소화.
• 테스트 효율성 향상: 테스트 작성 및 유지보수 용이.