A form builder application built with Next.js and Prisma, enabling users to configure forms, share them with others, and collect data seamlessly. Inspired by the functionality of Google Forms, this app is designed for simplicity, flexibility, and scalability.
- Dynamic Form Builder: Create and customize forms with various input types.
- Shareable Forms: Generate shareable links for your forms.
- Data Collection: Collect and manage form submissions efficiently.
- Real-time Results: View responses in real-time.
- Secure Storage: Store form data securely using Prisma and a relational database.
- Authentication: User authentication for form creation and data access.
- Framework: Next.js - React-based framework for building server-side rendered and static web applications.
- Database: Prisma - Type-safe database client for seamless database interaction.
- Authentication: NextAuth.js - Authentication for Next.js.
- Styling: Tailwind CSS for responsive and modern UI design.
- Deployment: Vercel for fast and reliable hosting.
- Node.js (>= 16.x)
- npm or yarn
- A relational database (PostgreSQL, MySQL, or SQLite recommended)
-
Clone the repository:
git clone [email protected]:sahariardev/formBuilder.git cd formBuilder
-
Install dependencies:
npm install # or yarn install -
Set up the database:
- Create a
.envfile in the root of your project. - Add the following environment variables:
POSTGRES_PRISMA_URL=your-database-connection-string CLERK_SECRET_KEY=your-nextauth-secret
- Create a
-
Run Prisma migrations:
npx prisma migrate dev
-
Start the development server:
npm run dev # or yarn devThe app will be available at http://localhost:3000.
.
├── prisma/ # Prisma schema and migrations
├── public/ # Static assets
├── app/ # Routes and business logic
│
├── .env # Environment variables
├── package.json # Project metadata and dependencies
└── README.md # Project documentation
-
Create a Form:
- Log in to your account.
- Use the form builder interface to configure your form fields (text, multiple choice, checkboxes, etc.).
-
Share the Form:
- Generate a unique link for your form and share it with others.
-
View Responses:
- Access the dashboard to view collected data and analyze submissions.
- Add analytics for form submissions.
- Enable file upload fields in forms.
- Support for themes and styling customization.
- Export responses as CSV or Excel.
- Add admin role for managing multiple users.
Contributions are welcome! To get started:
- Fork the repository.
- Create a new branch for your feature or bugfix.
- Commit your changes and open a pull request.
This project is licensed under the MIT License. See the LICENSE file for details.
- Inspired by Google Forms.
- Built with love using Next.js and Prisma.