Form Builder - The Ultimate Form-tastic Experience 🎉

📜 About This Project

Welcome to Form Builder – the most formidable form creation tool you'll ever lay your hands on! 🚀 This Next.js-powered application helps you create, share, and manage forms with style. No more boring Google Forms – this is form building, reimagined! 😎

✨ Features

• 📝 Form Creation – Easily create sleek, professional forms with a few clicks.
• 🛡️ Authentication – Secure signup and login system (because forms need guardians too!).
• 📊 Dashboard – Manage and track all your forms in one place.
• 📩 Form Sharing – Share your forms and gather responses effortlessly.
• 💅 Modern UI – Designed with Tailwind CSS and ShadCN for that extra touch of elegance.
• 🎭 Dark Mode Support – Because even forms deserve a bit of drama. 🌑

---

🌐 Live Demo 🌍

Check out the live version here: 🚀 Form Builder Website

🚀 Tech Stack

• Framework: Next.js (with TypeScript)
• Styling: Tailwind CSS
• State Management: React Hooks
• Backend: API Routes (Serverless)

📦 Installation

Want to test it out? Follow these steps:

# Clone the repo
$ git clone https://github.com/magi8101/form-builder.git

# Move into the project directory
$ cd form-builder

# Install dependencies
$ npm install  # or yarn install

# Run the development server
$ npm run dev  # or yarn dev

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

🛠️ Usage

1. Sign Up/Login – Because even forms need an identity.
2. Create a New Form – Add questions, customize fields, and make it look fancy.
3. Share the Link – Let the world (or just your team) fill it out.
4. View Responses – Get insights, laugh at typos, and analyze data.

🎨 File Structure

📂 form-builder
 ├── 📁 app/                  # Main application logic
 │   ├── 📁 dashboard/        # User dashboard pages
 │   ├── 📁 auth/             # Authentication pages
 │   ├── 📁 form/             # Form viewing and submission
 │   └── 📜 layout.tsx        # Global layout
 ├── 📁 components/           # Reusable UI components
 ├── 📁 hooks/                # Custom hooks for logic handling
 ├── 📁 public/               # Static assets
 ├── 📁 styles/               # Global styles
 ├── 📜 package.json          # Dependencies
 ├── 📜 tailwind.config.ts     # Tailwind CSS config
 └── 📜 tsconfig.json         # TypeScript settings

👨‍💻 Contributing

Found a bug? Have an idea? PRs are welcome! Open an issue, submit a pull request, or just send us a message.

📜 License

MIT License – because good code should be shared. 😇