AI 기반 랜딩 페이지 자동 생성 서비스를 개발하기 시작했을 때, 어떻게 계획하고 기술적으로 접근해야 할지 막막함을 느꼈습니다. 처음부터 문서를 작성하지 않으면 나중에 반드시 후회할 것 같다는 직감이 들었습니다. 그래서 이 글은 제가 겪었던 과정과 그 결과를 공유하는 내용입니다.

시행착오와 함정

처음에는 단순히 기능 구현에만 집중했습니다. AI 모델을 통합하고 API를 통해 결과를 출력하는 방법을 어떻게든 관리할 수 있을 것이라고 생각했죠. 하지만 개발을 시작하면서, 이 기능을 어떻게 관리해야 할지, 그리고 사용자에게 어떻게 보여줘야 할지에 대해 충분히 고민하지 못했다는 것을 깨달았습니다.

핵심 기능 자체는 어느 정도 형태를 갖추었지만, 이를 설명하는 문서가 부족하여 혼란이 발생했습니다. 관리자 페이지에 이 새로운 기능에 대한 정보가 없으니 아무도 사용 방법을 알지 못했습니다.

원인

궁극적으로 가장 큰 문제는 새로운 기능을 개발할 때 기획 및 기술 문서를 작성하는 것을 간과했다는 것입니다. 단순히 빠르게 기능을 구축하는 것만이 문제가 아니었습니다. 그 목적을 명확히 정의하고, 작동 방식과 사용 방법을 설명하는 과정 자체가 빠져 있었습니다. 또한, 관련 UI 컴포넌트와 페이지를 고려하여 관리자 페이지에 통합하는 것도 놓친 부분이었습니다.

해결책

이를 해결하기 위해, AI 기반 랜딩 페이지 자동 생성 서비스의 기획 및 기술 문서를 처음부터 다시 작성했습니다. 전체 서비스 흐름, AI 모델과의 인터페이스, 그리고 API 사양을 구체적으로 정의했습니다.

# AI-Powered Landing Page Auto-Generation Service Technical Documentation

## 1. Overview
...

json
{
"prompt": "AI-based service introduction landing page, concise and professional design",
"userId": "user123"
}

- **Response Body**:

### 3.2. 생성된 랜딩 페이지 가져오기
- **엔드포인트**: `/api/v1/landingpages/{landingPageId}`
...
이와 함께, 이 기능과 통합될 UI 컴포넌트 및 페이지를 추가하고 접근성을 높이기 위해 관리자 페이지에 해당 기능을 위한 문서화 탭을 생성했습니다.

## 결과
-   AI 기반 랜딩 페이지 자동 생성 서비스의 구현 및 문서화가 완료되었습니다.
-   관련 UI 컴포넌트와 페이지가 추가되어 사용자 경험이 개선되었습니다.
-   관리자 페이지에 해당 기능을 위한 문서화 탭이 추가되어 정보 접근성이 향상되었습니다.
-   현재 이 기능은 소유자에게만 독점적으로 제공됩니다.

## 시사점 — 같은 함정을 피하기 위해
-   [ ] 새로운 기능을 개발할 때는 기획 및 기술 문서 작성 생성을 초기 단계부터 필수 단계로 포함합니다.
-   [ ] 기능 구현과 병행하여 관련 UI 컴포넌트와 페이지를 동시에 설계하고 개발합니다.
-   [ ] 관리자 페이지와 같은 내부 시스템과의 통합 계획을 사전에 고려하고 설계합니다.
-   [ ] 문서화할 때는 API 명세, 아키텍처, 사용법 등을 명확하게 지정합니다.

💬 _이 내용은 제가 혼자서 공개적으로(실패도 포함) 구축하는 전체 AI 제품인 *_[Riel](https://aicoreutility.com/)\*의 일부입니다. [더 많은 빌드 로그 읽기 →](https://aicoreutility.com/en/blog) · [제품 보기 →](https://aicoreutility.com/)*