Skip to content
Nago edited this page Apr 21, 2025 · 5 revisions

📘 FE 가계부 서비스 설계 Wiki

🎯 프로젝트 목적

이 프로젝트는 단순한 가계부 웹 애플리케이션을 만드는 것이 아니라,
설계 중심 개발 프로세스를 체계화하고, 이를 기반으로 AI와의 협업을 실험하는 데 목적이 있습니다.


✅ 1. 설계 기반 구현 자동화 실험

"AI가 설계 문서만 보고 코드를 구현할 수 있는가?"

  • 명확한 설계 문서를 기반으로 구현 요청
  • AI에게 수정 없는 구현을 유도하는 문서 구조 설계
  • 실제 코드 생성 자동화 실험

✅ 2. 프론트엔드 아키텍처 사고 체계화

"요구사항을 구조와 흐름으로 바꾸는 설계자(Architect)로의 훈련"

  • 디렉토리 구조, 상태 흐름, 컴포넌트 설계, 스타일 전략까지 설계 중심 사고 훈련
  • 설계 명확화 → 구현 자동화 → 유지보수 용이성 실험

🧭 현재 작업 흐름

[ ChatGPT와의 설계 대화 진행 ]
       ↓
[ 설계 가이드 또는 템플릿 선택 ]
       ↓
[ GitHub Wiki에 문서 작성 ]
       ↓
[ 문서를 기반으로 구현 또는 AI 자동 생성 실험 ]

기존에는 Notion도 활용할 계획이었지만,
실제로는 설계 과정 전체를 ChatGPT와 대화로 해결한 뒤
Wiki에 바로 정리하는 구조로 바뀌었습니다.


📁 문서 분류 체계

Wiki는 다음과 같이 카테고리별로 명확히 분류되어 있습니다:

카테고리 목적
🧭 설계 가이드 설계자가 구조를 판단하기 위한 기준 문서
🧰 설계 템플릿 실제 설계 문서를 작성할 때 사용하는 서식
📂 설계 문서 템플릿 기반으로 작성된 실제 기능/컴포넌트의 설계 문서
📚 학습 문서 구조/개념/문제 해결 등을 정리한 학습용 문서

📌 향후 설계 문서 계획

현재는 가이드와 템플릿 중심으로 문서화되어 있으며,
설계 문서는 앞으로 실제 기능 구현 흐름에 맞춰 작성 예정입니다.

  • InputBar, MonthNavigator, TransactionList 등 주요 컴포넌트 단위 설계
  • Transactions, Calendar, Statistics 등 기능 단위 설계
  • 위 설계 문서들은 설계 가이드와 템플릿을 기반으로 작성되며,
    AI가 바로 구현 가능한 수준의 문서 품질을 목표로 합니다.

💡 문서 구조 팁

  • 접두어 사용으로 카테고리 명확히 구분
    예: 설계-, 학습-, 컴포넌트-, 기능-, 페이지-

  • 문서 제목은 사람과 AI가 모두 이해할 수 있도록 구체적이고 일관되게 작성
    예: 컴포넌트 설계 문서 템플릿, 상태 설계 가이드

📘 FE 가계부 서비스 설계 Wiki

🎯 프로젝트 개요

🧭 설계 가이드

🧰 설계 템플릿

📂 설계 문서

📂지침서

📂사양서

📚 학습 문서

🛠️ 문제 해결

TIL

Clone this wiki locally