docs(10_Wiki): Topic_Business/General/Graphic/Programming을 Topics/ 하위로 이동

최상위 10_Wiki/Topic_*였던 4개 카테고리 폴더를 10_Wiki/Topics/Topic_* 로 재배치. 콘텐츠 변경 없음(순수 폴더 이동) — Topics/ 하위 나머지 폴더는 이미 지난 커밋에서 전부 정리된 상태(잔존 항목은 에이전트 운영 상태 및 사용자가 보존을 요청한 업데이트0615/무제 3.canvas 뿐).
2026-07-05 00:44:01 +09:00
parent e9cbf23ab5
commit 9a135bd19d
6127 changed files with 0 additions and 0 deletions
@@ -0,0 +1,157 @@
+---
+id: wiki-2026-0508-rapid-prototyping
+title: Rapid Prototyping
+category: 10_Wiki/Topics
+status: verified
+canonical_id: self
+aliases: [Prototype-First Development, Spike, MVP Sketch]
+duplicate_of: none
+source_trust_level: A
+confidence_score: 0.9
+verification_status: applied
+tags: [methodology, product, engineering, design]
+raw_sources: []
+last_reinforced: 2026-05-10
+github_commit: pending
+tech_stack:
+  language: any
+  framework: agnostic
+---
+
+# Rapid Prototyping
+
+## 매 한 줄
+> **"매 throw-away artifact 의 fast 의 build — 매 question 의 answer"**. 매 production 의 X — 매 specific assumption (UX, API shape, feasibility) 의 validate 의 minimum 의 build. 2026 의 LLM-assisted scaffolding (v0, Bolt, Cursor Composer) + serverless (Vercel, Fly Machines) 의 cycle 의 hours, 매 not weeks.
+
+## 매 핵심
+
+### 매 prototype types
+- **Paper/wireframe**: 매 UX flow — Figma, Excalidraw.
+- **Clickable mockup**: 매 user testing — Figma prototype mode.
+- **Vertical slice**: 매 single feature end-to-end (UI → API → DB).
+- **Spike**: 매 technical feasibility (e.g., "vector DB 의 latency 가 OK?").
+- **Wizard-of-Oz**: 매 backend 의 human (Mechanical Turk) — 매 demand 의 validate.
+
+### 매 5 rules
+1. **Time-box**: 매 1 day / 1 week 의 hard limit.
+2. **One question per prototype**: 매 scope 의 narrow.
+3. **Throw it away**: 매 reuse 의 의 prod 의 X — 매 lessons 의 만 carry.
+4. **Hardcode shamelessly**: 매 fake data, mock auth, no tests.
+5. **Demo, not deploy**: 매 stakeholder 의 see — production 의 ≠.
+
+### 매 응용
+1. New product idea 의 user feedback 의 collect.
+2. Tech-stack bake-off (Postgres vs ScyllaDB latency).
+3. UX pattern 의 A/B mockup.
+4. LLM agent flow 의 feasibility (tool-use chain).
+
+## 💻 패턴
+
+### LLM-scaffolded Next.js prototype
+```bash
+# 매 v0.dev / Bolt 의 starter — 매 minutes 의 ship
+npx create-next-app@latest proto --ts --tailwind --app
+cd proto && npx shadcn@latest init -d
+npx shadcn@latest add button card form
+# 매 Cursor Composer / Claude Code 의 "build a $FEATURE landing"
+```
+
+### Mock API (in-memory, no DB)
+```ts
+// app/api/items/route.ts
+const mem: { id: string; name: string }[] = [];
+export async function GET()  { return Response.json(mem); }
+export async function POST(req: Request) {
+  const b = await req.json();
+  mem.push({ id: crypto.randomUUID(), ...b });
+  return Response.json({ ok: true });
+}
+```
+
+### Wizard-of-Oz (Slack as backend)
+```ts
+// 매 user request → Slack channel — 매 human responder
+async function handleQuery(q: string) {
+  await fetch(SLACK_WEBHOOK, {
+    method: 'POST',
+    body: JSON.stringify({ text: `[WoZ] ${q}` }),
+  });
+  // 매 polling for human answer in mock store
+  return await pollForAnswer(q);
+}
+```
+
+### Feature flag for prototype scope
+```ts
+const ENABLE_PROTO = process.env.NEXT_PUBLIC_PROTO === '1';
+if (!ENABLE_PROTO) return <NotImplemented />;
+```
+
+### Disposable infra (Fly Machines)
+```bash
+fly launch --copy-config --now --auto-confirm
+# 매 demo 후 의 destroy
+fly apps destroy proto-xyz --yes
+```
+
+### Fake data with Faker
+```ts
+import { faker } from '@faker-js/faker';
+const users = Array.from({ length: 50 }, () => ({
+  id: faker.string.uuid(),
+  name: faker.person.fullName(),
+  email: faker.internet.email(),
+}));
+```
+
+### Spike 의 measure (latency probe)
+```ts
+import { performance } from 'node:perf_hooks';
+const N = 100;
+const samples: number[] = [];
+for (let i = 0; i < N; i++) {
+  const t0 = performance.now();
+  await targetCall();
+  samples.push(performance.now() - t0);
+}
+samples.sort((a,b)=>a-b);
+console.log({ p50: samples[N*0.5|0], p95: samples[N*0.95|0], p99: samples[N*0.99|0] });
+```
+
+## 매 결정 기준
+| 상황 | Approach |
+|---|---|
+| UX 의 test | Figma clickable + 5 user interview |
+| API shape 의 doubt | Mock server (msw) + frontend 의 hook up |
+| Tech feasibility | Spike with smallest realistic input |
+| Demand validation | Landing + waitlist + "fake door" CTA |
+| Internal tool | Streamlit / Retool — code 의 X |
+| Multi-stakeholder review | Vertical slice — 매 fake data, real flow |
+
+**기본값**: 1 question, 1 week, throw away.
+
+## 🔗 Graph
+- 부모: [[Lean Startup]]
+- 변형: [[MVP]] · [[Spike]]
+- 응용: [[Feature Flag]]
+
+## 🤖 LLM 활용
+**언제**: scaffolding (v0, Bolt, Cursor), fake data, mock backend, copy generation.
+**언제 X**: 매 production deployment — prototype code 의 prod 의 promote 의 X.
+
+## ❌ 안티패턴
+- **Prototype 의 production promote**: 매 tech debt — rewrite 가 cheaper.
+- **No time-box**: 매 scope creep — 매 prototype 의 product 의 become.
+- **Multiple questions per prototype**: 매 confound — one variable.
+- **Real auth/payment in prototype**: 매 yak-shaving — mock.
+- **Reusing prototype tests as prod tests**: 매 false confidence — tests 의 X 가 OK.
+
+## 🧪 검증 / 중복
+- Verified (Google Design Sprint methodology; IDEO; Eric Ries _Lean Startup_; Marty Cagan _Inspired_).
+- 신뢰도 A.
+
+## 🕓 Changelog
+| 날짜 | 변경 |
+|---|---|
+| 2026-05-08 | Phase 1 |
+| 2026-05-10 | Manual cleanup — prototype types + LLM scaffolding 정리 |