@daawoonkim/create-arch-app 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +267 -0
- package/TESTING.md +224 -0
- package/bin/cli.js +4 -0
- package/create-arch-app_mvp_faa8b53b.plan.md +454 -0
- package/dist/commands/create.d.ts +2 -0
- package/dist/commands/create.d.ts.map +1 -0
- package/dist/commands/create.js +63 -0
- package/dist/commands/create.js.map +1 -0
- package/dist/generators/index.d.ts +3 -0
- package/dist/generators/index.d.ts.map +1 -0
- package/dist/generators/index.js +221 -0
- package/dist/generators/index.js.map +1 -0
- package/dist/generators/nextjs.d.ts +3 -0
- package/dist/generators/nextjs.d.ts.map +1 -0
- package/dist/generators/nextjs.js +253 -0
- package/dist/generators/nextjs.js.map +1 -0
- package/dist/generators/react.d.ts +3 -0
- package/dist/generators/react.d.ts.map +1 -0
- package/dist/generators/react.js +210 -0
- package/dist/generators/react.js.map +1 -0
- package/dist/index.d.ts +3 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +14 -0
- package/dist/index.js.map +1 -0
- package/dist/prompts/projectSetup.d.ts +3 -0
- package/dist/prompts/projectSetup.d.ts.map +1 -0
- package/dist/prompts/projectSetup.js +110 -0
- package/dist/prompts/projectSetup.js.map +1 -0
- package/dist/types.d.ts +22 -0
- package/dist/types.d.ts.map +1 -0
- package/dist/types.js +2 -0
- package/dist/types.js.map +1 -0
- package/dist/utils/dependencies.d.ts +5 -0
- package/dist/utils/dependencies.d.ts.map +1 -0
- package/dist/utils/dependencies.js +90 -0
- package/dist/utils/dependencies.js.map +1 -0
- package/dist/utils/fileSystem.d.ts +5 -0
- package/dist/utils/fileSystem.d.ts.map +1 -0
- package/dist/utils/fileSystem.js +23 -0
- package/dist/utils/fileSystem.js.map +1 -0
- package/package.json +51 -0
|
@@ -0,0 +1,454 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: create-arch-app MVP
|
|
3
|
+
overview: DDD, Clean Architecture, Atomic Design을 지원하는 React/Next.js 보일러플레이트 CLI 도구를 개발하고 npm에 배포합니다. MVP는 4개 아키텍처 패턴과 핵심 라이브러리 선택 기능을 포함합니다.
|
|
4
|
+
todos:
|
|
5
|
+
- id: setup-project
|
|
6
|
+
content: 프로젝트 초기화 및 TypeScript 설정, 필수 의존성 설치
|
|
7
|
+
status: completed
|
|
8
|
+
- id: cli-structure
|
|
9
|
+
content: CLI 진입점 및 Commander.js 명령어 구조 구현
|
|
10
|
+
status: completed
|
|
11
|
+
- id: prompts
|
|
12
|
+
content: inquirer.js 대화형 프롬프트 구현 (프레임워크, 아키텍처, 라이브러리 선택)
|
|
13
|
+
status: completed
|
|
14
|
+
- id: templates-ddd
|
|
15
|
+
content: DDD 아키텍처 템플릿 작성 (React, Next.js)
|
|
16
|
+
status: completed
|
|
17
|
+
- id: templates-clean
|
|
18
|
+
content: Clean Architecture 템플릿 작성 (React, Next.js)
|
|
19
|
+
status: completed
|
|
20
|
+
- id: templates-default
|
|
21
|
+
content: Default 기본 구조 템플릿 작성 (React, Next.js)
|
|
22
|
+
status: completed
|
|
23
|
+
- id: templates-atomic
|
|
24
|
+
content: Atomic Design 템플릿 작성 (React, Next.js)
|
|
25
|
+
status: completed
|
|
26
|
+
- id: file-generator
|
|
27
|
+
content: 파일 시스템 로직 구현 (템플릿 복사, 동적 파일 생성)
|
|
28
|
+
status: completed
|
|
29
|
+
- id: package-json-gen
|
|
30
|
+
content: 선택한 라이브러리에 따른 package.json 동적 생성
|
|
31
|
+
status: completed
|
|
32
|
+
- id: config-files
|
|
33
|
+
content: 설정 파일 생성 로직 (tsconfig, tailwind.config 등)
|
|
34
|
+
status: completed
|
|
35
|
+
- id: testing
|
|
36
|
+
content: 32가지 주요 조합 테스트 및 검증
|
|
37
|
+
status: pending
|
|
38
|
+
- id: documentation
|
|
39
|
+
content: README.md, LICENSE 작성 및 npm 메타데이터 설정
|
|
40
|
+
status: completed
|
|
41
|
+
- id: git-setup
|
|
42
|
+
content: GitHub 저장소 설정 및 첫 커밋 푸시
|
|
43
|
+
status: completed
|
|
44
|
+
- id: npm-publish
|
|
45
|
+
content: npm 배포 및 v0.1.0 릴리즈
|
|
46
|
+
status: pending
|
|
47
|
+
isProject: false
|
|
48
|
+
---
|
|
49
|
+
|
|
50
|
+
# create-arch-app CLI 도구 개발 및 배포 계획
|
|
51
|
+
|
|
52
|
+
## 프로젝트 개요
|
|
53
|
+
|
|
54
|
+
**패키지명**: `create-arch-app`
|
|
55
|
+
|
|
56
|
+
**목표**: DDD, Clean Architecture, Atomic Design을 지원하는 대화형 React/Next.js 프로젝트 생성 CLI
|
|
57
|
+
|
|
58
|
+
**MVP 범위**: 4개 아키텍처 패턴 + React/Next.js + 핵심 라이브러리 5가지
|
|
59
|
+
|
|
60
|
+
## 아키텍처 결정
|
|
61
|
+
|
|
62
|
+
### 지원할 아키텍처 패턴 (MVP)
|
|
63
|
+
|
|
64
|
+
1. **DDD (Domain-Driven Design)**
|
|
65
|
+
- 폴더 구조: `domain/`, `application/`, `infrastructure/`, `presentation/`
|
|
66
|
+
- 엔터프라이즈급 애플리케이션에 적합
|
|
67
|
+
|
|
68
|
+
2. **Clean Architecture**
|
|
69
|
+
- 폴더 구조: `core/`, `features/`, `shared/`, `app/`
|
|
70
|
+
- 의존성 규칙과 레이어 분리 중심
|
|
71
|
+
|
|
72
|
+
3. **Atomic Design**
|
|
73
|
+
- 폴더 구조: `atoms/`, `molecules/`, `organisms/`, `templates/`, `pages/`
|
|
74
|
+
- UI 컴포넌트 중심 개발에 최적화
|
|
75
|
+
|
|
76
|
+
4. **Default (기본 구조)**
|
|
77
|
+
- 폴더 구조: `components/`, `pages/`, `hooks/`, `utils/`, `styles/`
|
|
78
|
+
- 빠른 시작을 원하는 개발자용
|
|
79
|
+
|
|
80
|
+
### 지원할 라이브러리 (MVP)
|
|
81
|
+
|
|
82
|
+
- **TypeScript**: 기본 활성화 (모든 프로젝트에 기본 포함)
|
|
83
|
+
- **번들러**: Vite (React 프로젝트용, Next.js는 자체 번들러 사용)
|
|
84
|
+
- **스타일링**: Tailwind CSS / CSS Modules
|
|
85
|
+
- **상태관리**: Zustand / Context API / None
|
|
86
|
+
- **폼 관리**: React Hook Form / None
|
|
87
|
+
- **테스팅**: Vitest + Testing Library / None
|
|
88
|
+
|
|
89
|
+
## 기술 스택
|
|
90
|
+
|
|
91
|
+
### CLI 도구 개발
|
|
92
|
+
|
|
93
|
+
- **언어**: TypeScript
|
|
94
|
+
- **CLI 프레임워크**: Commander.js (명령어 파싱)
|
|
95
|
+
- **대화형 프롬프트**: inquirer.js
|
|
96
|
+
- **파일 시스템**: fs-extra
|
|
97
|
+
- **템플릿 엔진**: Handlebars (동적 파일 생성)
|
|
98
|
+
- **패키지 관리자 감지**: which-pm-runs, which-pm
|
|
99
|
+
|
|
100
|
+
### 생성되는 프로젝트 기술 스택
|
|
101
|
+
|
|
102
|
+
- **TypeScript**: 모든 프로젝트에 기본 포함
|
|
103
|
+
- **React 번들러**: Vite (빠른 개발 서버 및 빌드)
|
|
104
|
+
- **Next.js 번들러**: 내장 번들러 (Turbopack/Webpack)
|
|
105
|
+
|
|
106
|
+
### 프로젝트 구조
|
|
107
|
+
|
|
108
|
+
```
|
|
109
|
+
create-arch-app/
|
|
110
|
+
├── bin/
|
|
111
|
+
│ └── cli.js # CLI 진입점
|
|
112
|
+
├── src/
|
|
113
|
+
│ ├── commands/
|
|
114
|
+
│ │ └── create.ts # 프로젝트 생성 명령
|
|
115
|
+
│ ├── prompts/
|
|
116
|
+
│ │ └── projectSetup.ts # 대화형 질문
|
|
117
|
+
│ ├── generators/
|
|
118
|
+
│ │ ├── react.ts # React 프로젝트 생성
|
|
119
|
+
│ │ └── nextjs.ts # Next.js 프로젝트 생성
|
|
120
|
+
│ ├── templates/
|
|
121
|
+
│ │ ├── react/
|
|
122
|
+
│ │ │ ├── ddd/ # DDD 구조 템플릿
|
|
123
|
+
│ │ │ ├── clean/ # Clean Architecture 템플릿
|
|
124
|
+
│ │ │ ├── atomic/ # Atomic Design 템플릿
|
|
125
|
+
│ │ │ └── default/ # 기본 구조 템플릿
|
|
126
|
+
│ │ └── nextjs/
|
|
127
|
+
│ │ ├── app-router/ # App Router 기반
|
|
128
|
+
│ │ │ ├── ddd/
|
|
129
|
+
│ │ │ ├── clean/
|
|
130
|
+
│ │ │ ├── atomic/
|
|
131
|
+
│ │ │ └── default/
|
|
132
|
+
│ │ └── pages-router/ # Pages Router 기반
|
|
133
|
+
│ │ ├── ddd/
|
|
134
|
+
│ │ ├── clean/
|
|
135
|
+
│ │ ├── atomic/
|
|
136
|
+
│ │ └── default/
|
|
137
|
+
│ ├── utils/
|
|
138
|
+
│ │ ├── fileSystem.ts # 파일 복사/생성
|
|
139
|
+
│ │ ├── packageManager.ts # npm/yarn/pnpm 감지
|
|
140
|
+
│ │ └── dependencies.ts # package.json 생성
|
|
141
|
+
│ └── index.ts
|
|
142
|
+
├── package.json
|
|
143
|
+
├── tsconfig.json
|
|
144
|
+
└── README.md
|
|
145
|
+
```
|
|
146
|
+
|
|
147
|
+
## 구현 단계
|
|
148
|
+
|
|
149
|
+
### Phase 1: CLI 기본 구조 (1-2일)
|
|
150
|
+
|
|
151
|
+
**핵심 파일 구성**:
|
|
152
|
+
|
|
153
|
+
- `package.json`: bin 필드에 CLI 진입점 설정
|
|
154
|
+
- `bin/cli.js`: Shebang(#!/usr/bin/env node) 추가
|
|
155
|
+
- `src/index.ts`: Commander.js로 명령어 정의
|
|
156
|
+
- `src/prompts/projectSetup.ts`: inquirer.js로 대화형 질문 구현
|
|
157
|
+
|
|
158
|
+
**주요 프롬프트 항목**:
|
|
159
|
+
|
|
160
|
+
```typescript
|
|
161
|
+
// 예시 코드
|
|
162
|
+
{
|
|
163
|
+
projectName: string,
|
|
164
|
+
framework: 'react' | 'nextjs',
|
|
165
|
+
router?: 'app' | 'pages', // Next.js만 해당
|
|
166
|
+
architecture: 'ddd' | 'clean' | 'atomic' | 'default',
|
|
167
|
+
// typescript: true (기본값, 프롬프트에서 제외)
|
|
168
|
+
styling: 'tailwind' | 'css-modules',
|
|
169
|
+
stateManagement: 'zustand' | 'context' | 'none',
|
|
170
|
+
formLibrary: 'react-hook-form' | 'none',
|
|
171
|
+
testing: boolean
|
|
172
|
+
}
|
|
173
|
+
```
|
|
174
|
+
|
|
175
|
+
### Phase 2: 템플릿 작성 (3-4일)
|
|
176
|
+
|
|
177
|
+
각 아키텍처별로 템플릿 폴더 구조 생성:
|
|
178
|
+
|
|
179
|
+
**템플릿 구분**:
|
|
180
|
+
|
|
181
|
+
- React (Vite): 단일 템플릿
|
|
182
|
+
- Next.js: App Router / Pages Router 각각 별도 템플릿
|
|
183
|
+
|
|
184
|
+
**Next.js 라우터별 차이점**:
|
|
185
|
+
|
|
186
|
+
- App Router: `app/` 디렉토리, Server Components 기본, `layout.tsx`, `page.tsx`
|
|
187
|
+
- Pages Router: `pages/` 디렉토리, `_app.tsx`, `_document.tsx`, `index.tsx`
|
|
188
|
+
|
|
189
|
+
**DDD 템플릿 구조**:
|
|
190
|
+
|
|
191
|
+
```
|
|
192
|
+
domain/
|
|
193
|
+
├── entities/ # 비즈니스 엔티티
|
|
194
|
+
├── repositories/ # 리포지토리 인터페이스
|
|
195
|
+
└── services/ # 도메인 서비스
|
|
196
|
+
application/
|
|
197
|
+
├── usecases/ # 유스케이스
|
|
198
|
+
└── ports/ # 포트 인터페이스
|
|
199
|
+
infrastructure/
|
|
200
|
+
├── api/ # API 클라이언트
|
|
201
|
+
└── persistence/ # 데이터 영속성
|
|
202
|
+
presentation/
|
|
203
|
+
├── components/ # UI 컴포넌트
|
|
204
|
+
└── pages/ # 페이지
|
|
205
|
+
```
|
|
206
|
+
|
|
207
|
+
**Clean Architecture 템플릿**:
|
|
208
|
+
|
|
209
|
+
```
|
|
210
|
+
core/
|
|
211
|
+
├── entities/
|
|
212
|
+
├── usecases/
|
|
213
|
+
└── interfaces/
|
|
214
|
+
features/
|
|
215
|
+
└── [feature-name]/
|
|
216
|
+
├── domain/
|
|
217
|
+
├── data/
|
|
218
|
+
└── presentation/
|
|
219
|
+
shared/
|
|
220
|
+
├── components/
|
|
221
|
+
└── utils/
|
|
222
|
+
```
|
|
223
|
+
|
|
224
|
+
**Atomic Design 템플릿**:
|
|
225
|
+
|
|
226
|
+
```
|
|
227
|
+
components/
|
|
228
|
+
├── atoms/ # 가장 작은 UI 단위 (Button, Input, Label)
|
|
229
|
+
├── molecules/ # atoms 조합 (SearchBar, FormField)
|
|
230
|
+
├── organisms/ # molecules 조합 (Header, Footer, Form)
|
|
231
|
+
├── templates/ # 페이지 레이아웃
|
|
232
|
+
└── pages/ # 실제 페이지 구현
|
|
233
|
+
hooks/
|
|
234
|
+
utils/
|
|
235
|
+
styles/
|
|
236
|
+
types/
|
|
237
|
+
```
|
|
238
|
+
|
|
239
|
+
**Default 템플릿**:
|
|
240
|
+
|
|
241
|
+
```
|
|
242
|
+
components/
|
|
243
|
+
hooks/
|
|
244
|
+
pages/ (또는 app/)
|
|
245
|
+
utils/
|
|
246
|
+
styles/
|
|
247
|
+
types/
|
|
248
|
+
```
|
|
249
|
+
|
|
250
|
+
**React 프로젝트 추가 설정 파일**:
|
|
251
|
+
|
|
252
|
+
- `vite.config.ts`: Vite 설정
|
|
253
|
+
- `index.html`: Vite 진입점
|
|
254
|
+
- `src/main.tsx`: 애플리케이션 진입점
|
|
255
|
+
|
|
256
|
+
**Next.js 프로젝트 설정 파일**:
|
|
257
|
+
|
|
258
|
+
- `next.config.js`: Next.js 설정
|
|
259
|
+
|
|
260
|
+
**App Router (Next.js 13+)** 사용 시:
|
|
261
|
+
|
|
262
|
+
- `app/layout.tsx`: 루트 레이아웃
|
|
263
|
+
- `app/page.tsx`: 홈 페이지
|
|
264
|
+
- `app/globals.css`: 전역 스타일
|
|
265
|
+
|
|
266
|
+
**Pages Router (Next.js 12 이하)** 사용 시:
|
|
267
|
+
|
|
268
|
+
- `pages/_app.tsx`: 앱 래퍼
|
|
269
|
+
- `pages/_document.tsx`: 문서 구조
|
|
270
|
+
- `pages/index.tsx`: 홈 페이지
|
|
271
|
+
- `styles/globals.css`: 전역 스타일
|
|
272
|
+
|
|
273
|
+
**공통 TypeScript 설정**:
|
|
274
|
+
|
|
275
|
+
- `tsconfig.json`: 모든 프로젝트에 포함
|
|
276
|
+
- `tsconfig.node.json`: Vite 프로젝트용 (Node 환경)
|
|
277
|
+
|
|
278
|
+
Handlebars 템플릿 예시 (모든 파일이 TypeScript):
|
|
279
|
+
|
|
280
|
+
```handlebars
|
|
281
|
+
export interface Props { title: string; } export const Component = ({ title }:
|
|
282
|
+
Props) => { return
|
|
283
|
+
<div>{title}</div>; };
|
|
284
|
+
```
|
|
285
|
+
|
|
286
|
+
### Phase 3: 파일 생성 로직 (2-3일)
|
|
287
|
+
|
|
288
|
+
**핵심 기능**:
|
|
289
|
+
|
|
290
|
+
1. 선택한 아키텍처에 맞는 폴더 구조 생성
|
|
291
|
+
2. 선택한 라이브러리에 따라 `package.json` 동적 생성
|
|
292
|
+
3. 설정 파일 생성 (tsconfig.json, tailwind.config.js 등)
|
|
293
|
+
4. README.md 자동 생성 (선택한 옵션 기반)
|
|
294
|
+
|
|
295
|
+
**의존성 매핑**:
|
|
296
|
+
|
|
297
|
+
```typescript
|
|
298
|
+
const dependencies = {
|
|
299
|
+
react: {
|
|
300
|
+
react: "^18.2.0",
|
|
301
|
+
"react-dom": "^18.2.0",
|
|
302
|
+
},
|
|
303
|
+
reactDev: {
|
|
304
|
+
vite: "^5.0.0",
|
|
305
|
+
"@vitejs/plugin-react": "^4.2.0",
|
|
306
|
+
typescript: "^5.3.0",
|
|
307
|
+
"@types/react": "^18.2.0",
|
|
308
|
+
"@types/react-dom": "^18.2.0",
|
|
309
|
+
},
|
|
310
|
+
nextjs: {
|
|
311
|
+
next: "^14.0.0",
|
|
312
|
+
react: "^18.2.0",
|
|
313
|
+
typescript: "^5.3.0",
|
|
314
|
+
"@types/react": "^18.2.0",
|
|
315
|
+
"@types/node": "^20.0.0",
|
|
316
|
+
},
|
|
317
|
+
tailwind: {
|
|
318
|
+
tailwindcss: "^3.4.0",
|
|
319
|
+
autoprefixer: "^10.4.0",
|
|
320
|
+
postcss: "^8.4.0",
|
|
321
|
+
},
|
|
322
|
+
zustand: { zustand: "^4.4.0" },
|
|
323
|
+
// ...
|
|
324
|
+
};
|
|
325
|
+
```
|
|
326
|
+
|
|
327
|
+
### Phase 4: 테스트 및 검증 (1-2일)
|
|
328
|
+
|
|
329
|
+
1. 각 조합별 프로젝트 생성 테스트 (모두 TypeScript 기본)
|
|
330
|
+
- React + Vite + DDD + Tailwind
|
|
331
|
+
- Next.js + App Router + Clean + Zustand
|
|
332
|
+
- Next.js + Pages Router + DDD + CSS Modules
|
|
333
|
+
- React + Vite + Atomic + CSS Modules
|
|
334
|
+
- 총 32가지 주요 조합 검증 (Next.js 라우터 2가지 × 4 아키텍처 = 8가지 추가)
|
|
335
|
+
|
|
336
|
+
2. 생성된 프로젝트가 정상 실행되는지 확인
|
|
337
|
+
- `npm install` 성공
|
|
338
|
+
- `npm run dev` 실행 (React: Vite 개발 서버, Next.js: Next.js 개발 서버)
|
|
339
|
+
- TypeScript 컴파일 오류 없음
|
|
340
|
+
- 빌드 오류 없음 (`npm run build`)
|
|
341
|
+
|
|
342
|
+
### Phase 5: npm 배포 (1일)
|
|
343
|
+
|
|
344
|
+
**배포 전 체크리스트**:
|
|
345
|
+
|
|
346
|
+
- [ ] package.json 메타데이터 작성
|
|
347
|
+
- name, version, description
|
|
348
|
+
- keywords, author, license
|
|
349
|
+
- repository, bugs, homepage
|
|
350
|
+
- [ ] README.md 작성
|
|
351
|
+
- 설치 방법
|
|
352
|
+
- 사용 예시
|
|
353
|
+
- 지원하는 옵션
|
|
354
|
+
- 예시 스크린샷
|
|
355
|
+
- [ ] LICENSE 파일 (MIT 권장)
|
|
356
|
+
- [ ] .npmignore 설정 (불필요한 파일 제외)
|
|
357
|
+
|
|
358
|
+
**npm 계정 및 배포**:
|
|
359
|
+
|
|
360
|
+
```bash
|
|
361
|
+
npm login
|
|
362
|
+
npm publish --access public
|
|
363
|
+
```
|
|
364
|
+
|
|
365
|
+
**버전 관리**:
|
|
366
|
+
|
|
367
|
+
- 초기 릴리즈: v0.1.0 (MVP)
|
|
368
|
+
- Semantic Versioning 적용
|
|
369
|
+
|
|
370
|
+
## 실행 플로우
|
|
371
|
+
|
|
372
|
+
```mermaid
|
|
373
|
+
flowchart TD
|
|
374
|
+
Start[npx create-arch-app my-app] --> CheckName{프로젝트명 유효?}
|
|
375
|
+
CheckName -->|No| AskName[프로젝트명 입력]
|
|
376
|
+
CheckName -->|Yes| Framework[프레임워크 선택]
|
|
377
|
+
AskName --> Framework
|
|
378
|
+
|
|
379
|
+
Framework --> Router{Next.js?}
|
|
380
|
+
Router -->|Yes| RouterType[라우터 선택: App/Pages]
|
|
381
|
+
Router -->|No React| Arch[아키텍처 패턴 선택]
|
|
382
|
+
RouterType --> Arch
|
|
383
|
+
Arch --> Style[스타일링 도구 선택]
|
|
384
|
+
Style --> State[상태관리 선택]
|
|
385
|
+
State --> Form[폼 라이브러리 선택]
|
|
386
|
+
Form --> Test[테스팅 도구 선택]
|
|
387
|
+
|
|
388
|
+
Test --> Generate[파일 생성]
|
|
389
|
+
Generate --> Install[의존성 설치]
|
|
390
|
+
Install --> Success[완료 메시지 출력]
|
|
391
|
+
|
|
392
|
+
Success --> End[프로젝트 준비 완료]
|
|
393
|
+
```
|
|
394
|
+
|
|
395
|
+
## 예상 사용 시나리오
|
|
396
|
+
|
|
397
|
+
### 사용자 실행 예시
|
|
398
|
+
|
|
399
|
+
```bash
|
|
400
|
+
npx create-arch-app my-enterprise-app
|
|
401
|
+
|
|
402
|
+
# 대화형 프롬프트
|
|
403
|
+
? 프레임워크를 선택하세요: Next.js
|
|
404
|
+
? Next.js 라우터를 선택하세요: App Router (권장)
|
|
405
|
+
? 아키텍처 패턴을 선택하세요: DDD (Domain-Driven Design)
|
|
406
|
+
? 스타일링 도구를 선택하세요: Tailwind CSS
|
|
407
|
+
? 상태관리 라이브러리를 선택하세요: Zustand
|
|
408
|
+
? 폼 라이브러리를 선택하세요: React Hook Form
|
|
409
|
+
? 테스팅 도구를 포함하시겠습니까? Yes
|
|
410
|
+
|
|
411
|
+
✨ 프로젝트 생성 중...
|
|
412
|
+
📦 TypeScript 프로젝트로 설정됩니다 (기본값)
|
|
413
|
+
🚀 Next.js App Router 사용
|
|
414
|
+
✅ 폴더 구조 생성 완료
|
|
415
|
+
✅ 의존성 설치 완료
|
|
416
|
+
|
|
417
|
+
🎉 프로젝트가 성공적으로 생성되었습니다!
|
|
418
|
+
|
|
419
|
+
다음 명령어로 시작하세요:
|
|
420
|
+
cd my-enterprise-app
|
|
421
|
+
npm run dev
|
|
422
|
+
```
|
|
423
|
+
|
|
424
|
+
## MVP 이후 확장 가능성
|
|
425
|
+
|
|
426
|
+
1. **추가 아키텍처 패턴**
|
|
427
|
+
- Feature-Sliced Design
|
|
428
|
+
- Modular Architecture
|
|
429
|
+
- Hexagonal Architecture
|
|
430
|
+
|
|
431
|
+
2. **더 많은 라이브러리 옵션**
|
|
432
|
+
- UI: shadcn/ui, MUI, Ant Design
|
|
433
|
+
- 상태관리: Redux Toolkit, Jotai, Recoil
|
|
434
|
+
- 인증: NextAuth, Supabase
|
|
435
|
+
- ORM: Prisma, Drizzle
|
|
436
|
+
|
|
437
|
+
3. **고급 기능**
|
|
438
|
+
- 컴포넌트 생성기 (rorg 처럼)
|
|
439
|
+
- CI/CD 설정 자동화
|
|
440
|
+
- Docker 설정 포함
|
|
441
|
+
- Monorepo 지원 (Turborepo)
|
|
442
|
+
|
|
443
|
+
## 성공 지표
|
|
444
|
+
|
|
445
|
+
- npm 다운로드 수
|
|
446
|
+
- GitHub 스타 수
|
|
447
|
+
- 커뮤니티 피드백 및 이슈
|
|
448
|
+
- 실제 프로덕션 사용 사례
|
|
449
|
+
|
|
450
|
+
## 참고 리소스
|
|
451
|
+
|
|
452
|
+
- **유사 프로젝트 분석**: rorg, CleanNextBoilerplateCLI
|
|
453
|
+
- **템플릿 참고**: nextjs-clean-architecture-starter
|
|
454
|
+
- **CLI 개발 가이드**: Commander.js, inquirer.js 공식 문서
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"create.d.ts","sourceRoot":"","sources":["../../src/commands/create.ts"],"names":[],"mappings":"AAOA,wBAAsB,aAAa,CAAC,WAAW,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAsEvE"}
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
import path from 'path';
|
|
2
|
+
import fs from 'fs-extra';
|
|
3
|
+
import chalk from 'chalk';
|
|
4
|
+
import ora from 'ora';
|
|
5
|
+
import { promptProjectSetup } from '../prompts/projectSetup.js';
|
|
6
|
+
import { generateProject } from '../generators/index.js';
|
|
7
|
+
export async function createProject(projectName) {
|
|
8
|
+
console.log(chalk.bold.cyan('\n🚀 create-arch-app\n'));
|
|
9
|
+
try {
|
|
10
|
+
// 1. 현재 디렉토리 사용 여부 확인
|
|
11
|
+
const useCurrentDir = projectName === '.';
|
|
12
|
+
const cwd = process.cwd();
|
|
13
|
+
// 2. 프로젝트 설정 프롬프트
|
|
14
|
+
const config = await promptProjectSetup(projectName);
|
|
15
|
+
let projectPath;
|
|
16
|
+
let actualProjectName;
|
|
17
|
+
if (useCurrentDir) {
|
|
18
|
+
projectPath = cwd;
|
|
19
|
+
actualProjectName = path.basename(cwd);
|
|
20
|
+
// 현재 디렉토리가 비어있는지 확인
|
|
21
|
+
const files = await fs.readdir(projectPath);
|
|
22
|
+
const filteredFiles = files.filter(file => !file.startsWith('.') &&
|
|
23
|
+
file !== 'node_modules');
|
|
24
|
+
if (filteredFiles.length > 0) {
|
|
25
|
+
console.log(chalk.red('\n❌ 오류: 현재 디렉토리가 비어있지 않습니다.'));
|
|
26
|
+
console.log(chalk.yellow('빈 디렉토리에서 실행하거나 프로젝트 이름을 지정해주세요.\n'));
|
|
27
|
+
process.exit(1);
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
else {
|
|
31
|
+
projectPath = path.join(cwd, config.projectName);
|
|
32
|
+
actualProjectName = config.projectName;
|
|
33
|
+
// 디렉토리 존재 여부 확인
|
|
34
|
+
if (await fs.pathExists(projectPath)) {
|
|
35
|
+
console.log(chalk.red(`\n❌ 오류: 디렉토리 "${config.projectName}"가 이미 존재합니다.`));
|
|
36
|
+
process.exit(1);
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
// 3. 프로젝트 생성
|
|
40
|
+
const spinner = ora('프로젝트 생성 중...').start();
|
|
41
|
+
spinner.text = '📦 TypeScript 프로젝트로 설정됩니다 (기본값)';
|
|
42
|
+
if (config.framework === 'nextjs' && config.router) {
|
|
43
|
+
spinner.text = `🚀 Next.js ${config.router === 'app' ? 'App Router' : 'Pages Router'} 사용`;
|
|
44
|
+
}
|
|
45
|
+
// 실제 프로젝트 이름으로 업데이트
|
|
46
|
+
const finalConfig = { ...config, projectName: actualProjectName };
|
|
47
|
+
await generateProject(finalConfig, projectPath);
|
|
48
|
+
spinner.succeed(chalk.green('✅ 프로젝트 생성 완료!'));
|
|
49
|
+
// 4. 완료 메시지
|
|
50
|
+
console.log(chalk.bold.green('\n🎉 프로젝트가 성공적으로 생성되었습니다!\n'));
|
|
51
|
+
console.log(chalk.cyan('다음 명령어로 시작하세요:\n'));
|
|
52
|
+
if (!useCurrentDir) {
|
|
53
|
+
console.log(chalk.white(` cd ${config.projectName}`));
|
|
54
|
+
}
|
|
55
|
+
console.log(chalk.white(` npm install`));
|
|
56
|
+
console.log(chalk.white(` npm run dev\n`));
|
|
57
|
+
}
|
|
58
|
+
catch (error) {
|
|
59
|
+
console.error(chalk.red('\n❌ 오류가 발생했습니다:'), error);
|
|
60
|
+
process.exit(1);
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
//# sourceMappingURL=create.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"create.js","sourceRoot":"","sources":["../../src/commands/create.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/generators/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAM5C,wBAAsB,eAAe,CACnC,MAAM,EAAE,aAAa,EACrB,WAAW,EAAE,MAAM,GAClB,OAAO,CAAC,IAAI,CAAC,CAoCf"}
|