Build beautiful forms effortlessly with drag & drop, AI, and real-time analytics 🚀

• 🧩 Drag & Drop Builder – Visually design forms using a modern drag-and-drop interface.

• 🤖 AI-Powered Generation – Type a prompt, and AI builds your form!

• 🧱 50+ Components – Use rich inputs like text fields, dropdowns, sliders, date pickers, and more.

• 🔗 Shareable Links – Publish your forms and share with the world instantly.

• 📊 Response Dashboard – Analyze submissions via charts and tables.

• 📤 Data Export – Download responses as CSV/JSON or print them.

• 🧬 JSON Templates – Export and import form structures easily.

• 🎨 Theming – Toggle between light and dark modes.

• 🖥️ Responsive – Optimized for all screen sizes.

• Framework: Next.js
• Language: TypeScript
• Styling: Tailwind CSS
• UI Components: Shadcn UI
• Drag & Drop: dnd-kit
• Charts: Recharts
• State Management: React Hooks
• Package Manager: npm
• Backend API: formflow-backend

• Node.js (v18+)
• npm

git clone https://github.com/Udhay-Adithya/formflow
cd form_builder
npm install

npm run dev

Then open http://localhost:3000 in your browser.

⚠️ The app connects to a backend running at http://127.0.0.1:8000.

/form_builder
├── app/               # Pages and routes using Next.js App Router
│   ├── (auth)/        # Authentication pages
│   ├── (dashboard)/   # Dashboard UI & pages
│   ├── api/           # API routes (e.g., AI generation)
│   ├── form/          # Form display and submission
│   └── layout.tsx     # Root layout
├── components/        # Reusable React components
│   ├── ui/            # Shadcn UI components
│   └── *.tsx          # Custom components
├── hooks/             # Custom hooks
├── lib/               # Utilities & types
│   ├── component-config.tsx
│   ├── component-types.ts
│   ├── render-component.tsx
│   └── utils.ts
├── public/            # Static assets
├── styles/            # Global/legacy styles
├── tailwind.config.ts # Tailwind configuration
├── tsconfig.json      # TypeScript config
└── ...

We welcome contributions! Please open issues or submit pull requests for improvements, bug fixes, or new features.

MIT