모범 사례

knowledge 파일, Plan mode, 비주얼 편집, 버전 관리를 효과적으로 사용하여 더 빠르게 빌드하고 일반적인 함정을 피하세요.

이 가이드는 모든 사용자 — 신규 또는 경험자 — 가 빠르게 시작하고 Lovable에서 빌드할 때 일반적인 함정을 피하는 데 도움이 됩니다.

1. 기초 설정: Knowledge 파일 사용하기

왜 중요한가: Knowledge 파일은 프로젝트의 두뇌입니다. 모든 프롬프트와 함께 전송되며 AI가 전체 컨텍스트를 이해하는 데 도움이 됩니다.

포함할 내용:

• 제품 비전 (PRD처럼 생각하세요)
• 사용자 여정 및 페르소나
• 주요 기능 및 기능성
• 디자인 시스템 및 UI 가이드
• 역할별 동작 (예: Admin, User, Investor)

이미 구현한 기능을 기반으로 T=0에서 프로젝트의 knowledge를 생성해 주세요.

2. 프롬프팅 모범 사례

명확하고 장황한 프롬프트 = 더 나은 출력. AI를 엔지니어링 파트너라고 생각하세요 — 당신이 말하는 것만 알고 있습니다.

프롬프팅 팁:

• 구체적으로: 정확한 페이지(예: /dashboard)와 예상 동작을 언급하세요.

• 자연어 사용

  Investor 역할을 가진 사용자가 이 컴포넌트에 접근하도록 하고 싶지만, Admin은 안 됩니다.

• 스크린샷 추가: 버그나 UX 문제를 설명할 때 특히 유용합니다.

• 가드레일 추가: AI에게 건드리지 말아야 할 것을 알려주세요. 예:

  /shared/Layout.tsx를 편집하지 마세요.

• 중요한 지침을 프롬프트 간에 반복하세요. AI의 메모리는 제한적일 수 있습니다.

• 한 번에 5가지를 구현하려고 하지 마세요. 작업을 더 작고 테스트 가능한 청크로 분할하세요. 각 블록 사이에 Plan mode를 사용하여 다음으로 이동하기 전에 검증하세요.

  **기능 분해 템플릿:**
  새 페이지 만들기
  UI 레이아웃 추가
  데이터 연결
  로직 + 엣지 케이스 추가
  역할별 테스트

• 앱에 여러 역할(예: Admin, Investor, Startup)이 있는 경우 항상 프롬프트가 어떤 역할에 적용되는지 정의하세요. 이것은 공유 로직/컴포넌트로 인한 버그를 피하는 데 도움이 됩니다.

  Investor로서 회사 대시보드를 볼 수 있지만 편집할 수는 없어야 합니다. 이 기능을 Investor 역할에만 격리해 주세요.

3. Plan mode를 일찍 자주 사용하기

Plan mode = AI 부조종사입니다. 코드를 편집하지 않고 디버그, 브레인스토밍, 구현 계획을 도와줍니다 — 준비가 될 때까지.

Plan mode로 전환할 때:

• 2-3번의 "Try to Fix" 시도 실패 후

• 복잡한 로직이나 데이터베이스 문제를 디버깅할 때

• 새로운 기능을 계획할 때

  X를 구현하는 3가지 방법을 제안해 주세요

/settings 페이지에서 [기능]을 구현하세요. 예상 동작은 [XYZ]입니다. 필요하지 않으면 컴포넌트 A, 레이아웃 B 또는 공유 로직을 건드리지 마세요. Tailwind / Supabase / X의 모범 사례를 따르세요.

조사하되 아직 코드를 작성하지 마세요.

아무것도 변경하지 않고 이것을 해결하는 3가지 방법을 제안해 주세요.

4. Supabase의 일반적인 함정 피하기

주의: Supabase는 깔끔하게 되돌리지 않습니다. 버전을 되돌리면 데이터베이스 스키마가 망가질 수 있습니다.

모범 사례:

• frontend가 안정된 후에 Supabase 연결

• 되돌려야 하는 경우 AI에게 프롬프트:

  T=0에서 SQL 스키마를 검증하고 breaking changes가 발생하지 않았는지 확인해 주세요.

• 게시 전에 항상 데이터베이스 연결 기능 테스트

5. 빠른 UI 수정을 위해 Visual Edit 사용하기

Visual Edit 도구는 무료이고 빠릅니다. 다음을 위해 프롬프트 대신 사용하세요:

• 텍스트, 색상, 폰트, 레이아웃 조정 변경
• 여러 작은 요소를 한 번에 편집
• 안전한, 크레딧 없는 커밋 (실행 취소 가능)

6. GitHub + 버전 관리 현명하게 사용하기

• 모든 편집은 커밋입니다. 피닝을 사용하여 안정적인 버전을 표시하세요. 작동하는 모든 기능 후: Pin하세요

• 모든 버그 후: 버전을 시각적으로 비교하세요. 다음으로 프롬프트할 수 있습니다:

  T-1과 T-0 버전을 비교하세요. 무엇이 변경되었나요? 무엇이 망가뜨릴 수 있나요?

• AI가 너무 많은 것을 망가뜨렸다고 느끼면 안정적인 버전으로 돌아가세요.

• GitHub 브랜칭은 자기 책임 하에 사용하세요. Lovable에서 main으로 다시 전환하기 전에 브랜치를 삭제하면 프로젝트 동기화 문제가 발생할 수 있으므로 피하세요.

7. 모든 것이 실패하면 리믹스하기

많은 사용자가 깨닫습니다: 두 번째에는 처음부터 다시 하는 것이 더 빠릅니다.

• Remix는 T=0에서 프로젝트의 깨끗한 복사본을 만듭니다.
• 더 나은 프롬프팅 + 더 명확한 knowledge로 재빌드
• 이전 프로젝트는 참조용으로만 사용

사용 사례:

• 버그 루프에 갇혀 있을 때
• 보존된 히스토리로 깨끗하게 재시작하고 싶을 때
• Supabase를 연결 해제하고 새로운 경로를 시도해야 할 때

8. 인내하고 차분하게

혼자가 아닙니다. AI는 한 순간 마법 같고 다음 순간 좌절스러울 수 있습니다. 모든 빌드의 마지막 5%가 종종 가장 느리지만 — 가장 중요합니다.

9. 문서를 사용하고 도움 요청하기

• 문서에는 워크스루, 템플릿, SEO 팁, 통합 등이 포함되어 있습니다. doc AI 어시스턴트에서 직접 질문할 수 있습니다.
• 피어 지원을 위해 Discord 커뮤니티에 가입하세요.

10. 보너스 팁

• 긴 프롬프트를 위해 받아쓰기를 사용한 음성 메모 프롬프트 추가하기 (예: Mac에서 마이크를 사용하여 긴 프롬프트 받아쓰기). 더 나은 입력을 더 빨리 작성할 수 있습니다 — 좌절하거나 피곤할 때 특히 유용합니다.

• 더 나은 AI 집중을 유도하기 위해 "답답해요…" 프롬프트 패턴 사용

• 주요 편집 후 항상 여러 역할과 그 동작을 다시 확인하세요 (특히 조건부 로직에서)

• 빠른 디버깅을 위한 폴백으로 안정적인 버전 저장

• 예상치 못한 부작용이 보이면, 이것은 지나치게 일반적인 로직으로 인한 버그를 피하는 데 도움이 됩니다.

  [역할 X]를 위한 컴포넌트를 특별히 만들고 명확하게 범위가 지정되지 않는 한 공유 컴포넌트를 재사용하지 마세요.