install
source · Clone the upstream repo
git clone https://github.com/ComeOnOliver/skillshub
Claude Code · Install into ~/.claude/skills/
T=$(mktemp -d) && git clone --depth=1 https://github.com/ComeOnOliver/skillshub "$T" && mkdir -p ~/.claude/skills && cp -r "$T/skills/TerminalSkills/skills/lovable" ~/.claude/skills/comeonoliver-skillshub-lovable && rm -rf "$T"
manifest:
skills/TerminalSkills/skills/lovable/SKILL.mdsource content
Lovable — AI Full-Stack App Generator with Supabase Backend
You are an expert in Lovable (formerly GPT Engineer), the AI app builder that generates production-ready full-stack applications from natural language descriptions. You help developers and non-technical founders create React + Supabase applications with authentication, database, file storage, and deployment — going from idea to production URL in under an hour.
Core Capabilities
App Generation
## Prompt → Full App Lovable generates: - React frontend with Tailwind CSS and shadcn/ui - Supabase backend (PostgreSQL, Auth, Storage, Realtime) - Database schema with Row Level Security policies - Authentication flows (email, Google, GitHub) - Full CRUD operations - Responsive design - Deployment to Lovable hosting or Netlify ## Example: SaaS Waitlist + Dashboard Prompt: "Build a SaaS waitlist app where: - Landing page with email signup form and social proof counter - Admin dashboard to view signups, export CSV, and send invite emails - Supabase auth for admin login - Track referrals: each signup gets a unique referral link - Leaderboard showing top referrers - Dark mode support" Lovable generates: ├── src/ │ ├── pages/Landing.tsx # Waitlist signup with counter │ ├── pages/Dashboard.tsx # Admin view of signups │ ├── pages/Leaderboard.tsx # Referral leaderboard │ ├── components/SignupForm.tsx # Email + referral tracking │ ├── components/DataTable.tsx # Sortable signups table │ ├── lib/supabase.ts # Supabase client config │ └── hooks/useSignups.ts # Data fetching hooks ├── supabase/ │ └── migrations/ │ └── 001_create_signups.sql # Schema + RLS policies
Supabase Integration
## Auto-Generated Database Lovable creates Supabase resources automatically: - Tables with proper column types and constraints - Row Level Security policies (users can only access their own data) - Foreign key relationships - Indexes on commonly queried columns - Realtime subscriptions for live updates - Storage buckets for file uploads - Edge functions for server-side logic ## Database Schema Example (auto-generated) CREATE TABLE signups ( id UUID DEFAULT gen_random_uuid() PRIMARY KEY, email TEXT NOT NULL UNIQUE, referral_code TEXT NOT NULL UNIQUE DEFAULT nanoid(), referred_by UUID REFERENCES signups(id), referral_count INTEGER DEFAULT 0, invited BOOLEAN DEFAULT false, created_at TIMESTAMPTZ DEFAULT now() ); ALTER TABLE signups ENABLE ROW LEVEL SECURITY; -- Admin can see all signups CREATE POLICY "Admin full access" ON signups FOR ALL TO authenticated USING (auth.jwt() ->> 'role' = 'admin'); -- Public can insert (signup) CREATE POLICY "Public signup" ON signups FOR INSERT TO anon WITH CHECK (true);
Iterative Editing
## Edit via Chat After generation, edit with natural language: - "Add a chart showing signups over time" - "Make the landing page hero section bigger with an animated gradient" - "Add email validation and show error messages" - "Connect Resend for sending invite emails" - "Add a /api/webhook endpoint for Stripe events" Lovable modifies the existing codebase, preserving your customizations.
Installation
# No installation — browser-based # https://lovable.dev # Free: 5 generations/day # Pro: $20/month (unlimited) # Teams: $25/user/month
Best Practices
- Detailed first prompt — Include all core features in the initial prompt; Lovable builds a cohesive architecture from the start
- Supabase for backend — Lovable is optimized for Supabase; leverages Auth, Database, Storage, and Realtime out of the box
- shadcn/ui components — Lovable uses shadcn/ui; request specific components by name ("use a DataTable with sorting and filtering")
- RLS from day one — Lovable generates Row Level Security policies; review them before going to production
- Export and own — Export to GitHub at any time; the generated code is standard React + Supabase, no vendor lock-in
- Iterate in chat — Use follow-up prompts to refine; "make the hero section more engaging" or "add error states to all forms"
- Connect to your Supabase — Link your own Supabase project for production; Lovable's built-in instance is for prototyping
- Combine with Cursor — Generate the scaffold with Lovable, export, then refine business logic with Cursor or Continue