CarpicK_Admin은 차량 공유 플랫폼 CarpicK의 관리자 웹 애플리케이션입니다.
차량 등록 관리, 승인/거절 처리, 상세 정보 조회 등 운영자의 핵심 기능을 지원합니다.
물건은 더이상 ‘소유’의 개념이 아닌 서로 대여해 주고 차용해 쓰는 ‘공유’의 개념이 되고 있습니다.
잘 사용하지 않는다면 기꺼이 대여하여 자신과 남 모두 win win 하며, 불필요한 재화의 재생산을 막아주는 공유경제 개념이 자동차에 접목 되었습니다.
CarpicK_Admin은 아래와 같은 운영 기능을 제공합니다:
- 관리자 로그인 시스템
- 차량 등록 요청 목록 확인
- 차량 상세 정보 열람 (위치, 연료, 차량 옵션 등)
- 차량 등록 승인 / 거절
- 차량 리스트 페이지네이션 관리
| 영역 | 사용 기술 |
|---|---|
| Frontend | React, TypeScript, JavaScript, styled-components |
| Backend 연동 | GraphQL |
| 상태 관리 | useState, useEffect 기반 React 상태 관리 |
| 기타 | Kakao Maps API (위치 기반 차량 위치 표시) |
CarpicK_Admin/
├── .vscode/ # VSCode 설정
├── pages/ # Next.js 라우팅 페이지
├── public/ # 정적 파일
├── src/
│ ├── commons/ # 공통 유틸리티 및 토큰 관련 함수
│ │ ├── breakPoints.tsx
│ │ ├── generated/
│ │ ├── libraries/
│ │ │ └── getAccessToken.ts
│ │ ├── store/
│ │ ├── styles/
│ │ ├── types.ts
│ │ └── globalStyles.ts
│
│ ├── components/ # 재사용 가능한 컴포넌트
│ │ ├── commons/
│ │ ├── apollo/
│ │ ├── kakao-map/
│ │ └── pagination/
│ │ ├── Pagination.container.tsx
│ │ ├── Pagination.presenter.tsx
│ │ ├── Pagination.styles.ts
│ │ └── Pagination.types.ts
│
│ ├── units/ # 기능 단위 페이지 구성
│ │ ├── Admin/
│ │ ├── AdminDetail/
│ │ ├── AdminDetailCar/
│ │ ├── AdminDetailRegistration/
│ │ ├── AdminLogin/
│ │ ├── Intro/
│ │ └── Terms/
│
├── styles/ # 글로벌 스타일 설정
├── docker-compose.yml # Docker 설정 파일
├── Dockerfile
├── tsconfig.json # TypeScript 설정
├── package.json
├── yarn.lock
├── README.md
└── 기타 설정 파일들 (eslint, prettier 등)