David Fox - BlogFox Forms
Overview
This project is a Full Stack Form Builder application designed to create, manage, and publish forms using modern web technologies. It leverages React with TypeScript for the frontend, Dnd-Kit for drag-and-drop functionality, Vercel PostgreSQL with Prisma for the database, and Tailwind CSS for styling.
Features
- Responsive Design: Fully responsive to ensure compatibility across various devices.
- Drag and Drop Form Builder: Create forms using an intuitive drag-and-drop interface.
- Layout Fields: Includes Title, SubTitle, Spacer, Separator, and Paragraph components.
- Form Fields: Supports Text, Number, Select, Date, Checkbox, and Textarea fields.
- Customizable Fields: Easily add and customize new fields.
- Form Preview Dialog: Preview forms before sharing or publishing.
- Shareable Form URL: Share forms via a unique URL.
- Form Submission and Validation: Handle form submissions and validations efficiently.
- Form Stats: Track form visits and submissions.
Technologies Used
- Frontend: Next.js (AppRouter), React, TypeScript, Dnd-Kit, Shadcn UI
- Backend: Node.js, Vercel PostgreSQL, Prisma
- Styling: Tailwind CSS
- Utilities: ESLint, Prettier, React Hook Form, Zod