WizForms is a powerful, user-friendly form builder with a stunning drag-and-drop interface, designed to help you create responsive, customizable forms effortlessly. Built with modern technologies like Next.js, TypeScript, and TailwindCSS, WizForms empowers users to design forms, validate submissions, and track real-time statistics seamlessly.
-
Drag-and-Drop Designer
Build beautiful forms effortlessly using an intuitive drag-and-drop interface. -
Rich Layout Options
Add customizable layout fields like:- Title
- SubTitle
- Spacer
- Separator
- Paragraph
-
Form Fields
Collect data using dynamic fields:- Text
- Number
- Select
- Date
- Checkbox
- Textarea
-
Preview & Publish
- Preview your forms before publishing.
- Share forms via unique URLs.
-
Submission Management
- Built-in validation for smooth workflows.
- Track form statistics, including visits and submissions.
-
Customizable
Easily add and modify new fields to suit your needs.
- Next.js with App Router
- Dnd-kit library
- ServerActions
- TypeScript
- TailwindCSS / Shadcn UI
- Vercel PostgreSQL
- Prisma as ORM
- Fully responsive design for all devices.
- Optimized for performance and scalability.
- Seamlessly manage form data and share forms with ease.
Ensure you have the following installed:
-
Clone the repository:
git clone https://github.com/tamal78/wizforms.git
-
Navigate to the project directory:
cd wizforms
-
Install dependencies:
npm install
-
Set up environment variables:
Create a.env
file in the root directory and configure the required variables, e.g.:DATABASE_URL=<your_database_url> NEXT_PUBLIC_API_URL=<your_api_url>
-
Run database migrations (if applicable):
npx prisma migrate dev
-
Start the development server:
npm run dev
-
Open the app in your browser:
http://localhost:3000
Contributions are welcome! Please feel free to submit a pull request or open an issue for suggestions and improvements.
Check out the live demo here