Repolode
chihebnabil

chihebnabil/lovable-boilerplate

shadcn/ui, Tailwind, Supabase와 Copilot 및 Cursor용 AI 어시스턴트 지침을 갖춘 React + Vite + TypeScript 보일러플레이트입니다.

스타
66
포크
31
열린 이슈
7
마지막 커밋
그저께

어떤 프로젝트인가요?

Lovable의 AI 앱 빌더에서 영감을 받은 React 스타터 프로젝트입니다. Vite, React 19, TypeScript, Tailwind CSS와 shadcn/ui 컴포넌트를 제공해, 생성된 UI든 직접 작성한 UI든 개발자가 코드를 바로 읽고 수정하고 확장할 수 있습니다.

Supabase 클라이언트 파일과 생성된 데이터베이스 타입을 통해 Supabase를 바로 사용할 수 있으며, 쿼리, 실시간 구독, 이메일/비밀번호 인증 호출 예제도 포함되어 있습니다. 로컬 개발을 위한 Supabase CLI 설정과 migrations 폴더도 제공됩니다. 데이터 페칭에는 TanStack Query를, 폼 처리에는 React Hook Form과 Zod를 사용합니다.

저장소에는 .github/instructions 아래에 GitHub Copilot과 Cursor용 전역 지침 파일이 있습니다. 레이아웃, 스타일링, 컴포넌트 작성 규칙을 다뤄 AI 어시스턴트가 프로젝트의 패턴을 따르도록 합니다.

핵심 기능

  • 01개발 및 빌드를 위한 TypeScript 기반 Vite와 React 19.
  • 02src/components/ui에 미리 설정된 shadcn/ui 컴포넌트 40개 이상.
  • 03백엔드 작업을 위한 Supabase 클라이언트, 생성된 타입, migrations 폴더.
  • 04데이터 페칭을 위한 TanStack Query와 폼 처리를 위한 React Hook Form 및 Zod.
  • 05프로젝트 규칙을 설명하는 Copilot 및 Cursor 지침 파일.

활용 사례

  • shadcn/ui 디자인 시스템과 Supabase 백엔드를 사용하는 React 웹 앱 시작하기.
  • 생성된 UI를 대폭 수정할 프로토타입 만들기.
  • AI 코딩 어시스턴트가 일관된 스타일 규칙을 따르도록 프로젝트 설정하기.

빠른 시작

  1. 1

    저장소를 클론합니다

    git clone https://github.com/chihebnabil/lovable-boilerplate.git
  2. 2

    프로젝트 폴더로 이동합니다

    cd lovable-boilerplate
  3. 3

    종속성을 설치합니다

    npm install
  4. 4

    개발 서버를 시작합니다(http://localhost:8080에서 실행)

    npm run dev

사용 전 알아둘 점

  • Supabase 기능을 사용하려면 직접 만든 Supabase 프로젝트와 .env 파일의 인증 정보가 필요합니다.
  • 로컬 Supabase 명령을 실행하려면 Docker가 필요합니다.

토픽

자주 묻는 질문

lovable-boilerplate은(는) 무엇인가요?
shadcn/ui, Tailwind, Supabase와 Copilot 및 Cursor용 AI 어시스턴트 지침을 갖춘 React + Vite + TypeScript 보일러플레이트입니다. Lovable의 AI 앱 빌더에서 영감을 받은 React 스타터 프로젝트입니다. Vite, React 19, TypeScript, Tailwind CSS와 shadcn/ui 컴포넌트를 제공해, 생성된 UI든 직접 작성한 UI든 개발자가 코드를 바로 읽고 수정하고 확장할 수 있습니다.
lovable-boilerplate은(는) 무료로 사용할 수 있나요? 라이선스는 무엇인가요?
lovable-boilerplate은(는) MIT 라이선스의 오픈소스입니다. 상업용 제품에 사용하기 전에 라이선스 조건을 확인하세요.
lovable-boilerplate은(는) 아직 유지보수되고 있나요?
활발히 유지보수 중. lovable-boilerplate의 마지막 커밋은 2026년 11월 4일입니다.
lovable-boilerplate은(는) 어디에 사용할 수 있나요?
shadcn/ui 디자인 시스템과 Supabase 백엔드를 사용하는 React 웹 앱 시작하기. 생성된 UI를 대폭 수정할 프로토타입 만들기. AI 코딩 어시스턴트가 일관된 스타일 규칙을 따르도록 프로젝트 설정하기.
lovable-boilerplate는 어떻게 설치하나요?
저장소를 클론합니다: git clone https://github.com/chihebnabil/lovable-boilerplate.git 프로젝트 폴더로 이동합니다: cd lovable-boilerplate 종속성을 설치합니다: npm install 개발 서버를 시작합니다(http://localhost:8080에서 실행): npm run dev
lovable-boilerplate은(는) 어디서 받을 수 있나요?
소스 코드와 설치 방법은 GitHub에 있습니다: https://github.com/chihebnabil/lovable-boilerplate

요약은 프로젝트 README를 바탕으로 AI가 작성했습니다. GitHub 통계는 매일 갱신됩니다.

관련 프로젝트