LalaForms - Powerful Form Builder Platform

LalaForms is a comprehensive form builder platform that allows users to create beautiful, customizable forms with drag & drop functionality and embed them easily on any website.

Features

• 🎨 Beautiful landing page with feature comparisons
• 🔄 Drag & drop form builder
• 🎯 Easy form embedding with a single line of code
• 🎨 Theme customization and branding options
• 📊 Powerful analytics dashboard
• 👥 Team collaboration features
• 🔒 Secure form submissions
• 💳 Subscription management with Stripe

Getting Started

1. Environment Setup:

   • Clone the repository
   • Run npm install to install dependencies
   • Make sure PostgreSQL is running
   • Copy .env.example to .env and fill in the required environment variables

2. Run the Application:

   npm run dev

   The application will be available at http://localhost:5000

Test Credentials

1. Admin User:

   • Username: admin
   • Password: admin123
   • Access admin panel at: /admin/dashboard

2. Test User:

   • Username: testuser
   • Password: test123

Form Embedding

To embed a form on your website:

1. Create and publish a form from the dashboard
2. Add this code to your website:

   <script src="https://your-domain.com/api/forms/[FORM_ID]/embed.js"></script>
   <div data-lalaform-id="[FORM_ID]"></div>

Features Overview

1. Form Builder:

   • Drag & drop interface
   • Multiple field types
   • Conditional logic
   • Custom themes and branding
   • Form templates

2. Admin Dashboard:

   • User management
   • Form analytics
   • Response tracking
   • Revenue monitoring
   • System status

3. User Dashboard:

   • Form management
   • Response analytics
   • Theme customization
   • Form embedding
   • Account settings

Pro Features

• Custom branding (remove LalaForms footer)
• Advanced analytics
• Team collaboration
• Custom domains
• Priority support
• More storage

Development Guidelines

1. Database:

   • Uses PostgreSQL with Drizzle ORM
   • Schema defined in shared/schema.ts
   • Migrations handled automatically

2. Frontend:

   • React with TypeScript
   • TanStack Query for data fetching
   • shadcn/ui components
   • Tailwind CSS for styling

3. Backend:

   • Express.js server
   • PostgreSQL database
   • Stripe integration for payments
   • Session-based authentication

Environment Variables

DATABASE_URL=postgresql://...
SESSION_SECRET=your-session-secret
STRIPE_SECRET_KEY=sk_test...
VITE_STRIPE_PUBLIC_KEY=pk_test...
STRIPE_PRICE_ID=price_...

Support

For any questions or issues, please contact [email protected]