Files
Aislo/docs/wiki/pages/A02_ProgDetail/A02_components.md
T
eomsangdonandClaude Opus 5 eb30b774f8 chore(docs): docs 폴더 git 추적 전환 · PLAN·OWNERS 최상위 이관
- `docs/` 를 .gitignore 에서 빼 git 추적 대상으로 전환 (위키·완료 이력·검증 기록)
- `docs/raw/PLAN.md` · `docs/raw/OWNERS.md` 를 저장소 최상위로 이동 후 .gitignore 에 등록
  — 창끼리 공유하되 저장소에는 안 올리는 장부
- 살아 있는 경로 참조 7개 파일 정정 (아카이브 107건은 그때 사실이라 그대로 둠)
- graphify 날짜별 산출물(`docs/wiki/graphify-out/20*/`) 제외 — `graphify update` 가 다시 만듦

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
2026-09-09 18:19:07 +09:00

39 lines
1.8 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
---
type: page-frontend-detail
status: draft
page_id: A02_ProgDetail
related_pages: ["[[A02_ProgDetail/A02_frontend]]", "[[ui_templates]]", "[[a00_app_shell_framework]]", "[[architecture/project_map]]", "[[architecture/public_admin_map]]"]
last_updated: 2026-07-12
source: A02_ProgDetail 코드 인제스트 보완 및 구조화 일관성 적용
---
# A02_ProgDetail — 세부 구현
## 스타일 (CSS)
| 항목 | 역할 |
|---|---|
| `.a02-prog-detail` | 페이지 루트 컨테이너 (gap: section-gap, padding-bottom: spacing-64) |
| `.a02-hero`, `.a02-hero__inner` | 히어로 영역 배경(라벤더 그라디언트) 및 콘텐츠 중앙 정렬 |
| `.a02-workflow-list`, `.a02-workflow-row` | 6단계 워크플로우 리스트(flex 열) 및 배지+텍스트 행 레이아웃 |
| `.a02-workflow-row__badge` | 40×40px 원형 배지 (primary 배경) |
| `.a02-tech-grid`, `.a02-tech-card` | 핵심 기술 소개 3열 카드 그리드 (900px 이하 대응) |
## 의존성
| 항목 | 역할 |
|---|---|
| [[a00_app_shell_framework]] | `navigateTo()` 라우팅 기능 활용 |
| `config_frontend.ts` | `ROUTES` 경로 상수 참조 |
| [[ui_templates]] | 공통 버튼(`createButton`) 및 카드(`createCard`) 엘리먼트 활용 |
| `ui_template_locale.ts` | 다국어 문구(`ui_locales`) 적용 |
## 데이터 흐름
| 단계 | 흐름 |
|---|---|
| 1 | `renderA02ProgDetail(root)` ➡️ `buildHero()` ➡️ `buildWorkflow()` ➡️ `buildTech()` 순서로 구성 요소를 렌더링하고 `root`에 추가 |
| 2 | 사용자가 히어로의 CTA 버튼 클릭 시 `onA02_ProgDetail_Start_Click()` 핸들러가 작동하여 `navigateTo(ROUTES.A07_REGISTER)` 호출 |
## 미해결 / 특이사항
| 항목 | 상태 |
|---|---|
| 정적 페이지 | 백엔드 API와의 연동이 필요 없는 완전한 정적 소개 페이지임 |