---
type: page-frontend-detail
status: stable
page_id: A01_Home
related_pages: ["[[A01_Home/A01_frontend]]", "[[ui_templates]]", "[[a00_app_shell_framework]]"]
last_updated: 2026-07-12
source: 상위 프로젝트 A01_Home 코드 인제스트 보완 (2026-07-12)
---

# A01_Home — 세부 구현

## 스타일
| 항목 | 역할 |
|---|---|
| `.a01-home`, `.a01-hero` | 페이지 래퍼·히어로 배경 |
| `.a01-news-list`, `.a01-news-row` | 뉴스 목록과 행 레이아웃 |
| `.a01-feature-grid`, `.a01-feature-card` | 3열 기능 카드 그리드 |
| 900px 이하 | 기능 그리드 1열·히어로 제목 축소 |

## 의존성
| 항목 | 역할 |
|---|---|
| [[a00_app_shell_framework]] | `navigateTo()` 라우팅 |
| `config_frontend.ts` | `ROUTES` 상수 |
| [[ui_templates]] | 공통 버튼·카드·태그·다국어 |

## 데이터 흐름
| 단계 | 흐름 |
|---|---|
| 1 | `renderA01Home(root)` → `buildHero()`·`buildNews()`·`buildFeatures()` |
| 2 | `buildNews()`는 현재 `MOCK_NEWS` 사용 |
| 3 | CTA 클릭 → A07_Register 또는 A02_ProgDetail 이동 |

## 미해결
| 항목 | 상태 |
|---|---|
| `GET /api/a01/news` | 백엔드 미구현; 현재 뉴스는 하드코딩 |