1.7 KiB
1.7 KiB
type, status, page_id, related_pages, last_updated, source
| type | status | page_id | related_pages | last_updated | source | |||
|---|---|---|---|---|---|---|---|---|
| page-frontend-detail | stable | A02_ProgDetail |
|
2026-07-12 | 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와의 연동이 필요 없는 완전한 정적 소개 페이지임 |