FormPulse

Full-stack web app for creating and sharing forms, built with Next.js, TypeScript, and Tailwind CSS.

Features

• Drag-and-Drop Form Builder:
  • Layout fields: Title, subtitle, paragraph, spacer, separator
  • Input fields: Text, number, select, date, checkbox, textarea
• Share Forms: Generate a unique URL for easy sharing
• View Responses: Access form submissions in a tabular format
• Analytics: Track form views and submissions

Technologies

Technology	Purpose
Next.js	Full-stack React framework
TypeScript	Language
Clerk	Authentication
Prisma	ORM
PostgreSQL	Database
Tailwind CSS	CSS framework
Shadcn/ui	UI components

Setup

1. Prerequisites:

   • Node.js (v18 or later)
   • PostgreSQL database
   • Clerk account

2. Clone the repository:

   git clone https://github.com/tariqs26/form-pulse.git
   cd form-pulse

3. Install dependencies:

   npm i

4. Setup environment variables:

   Create a .env file in the root directory, with the following variables:

   # Clerk
   NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=
   CLERK_SECRET_KEY=
   CLERK_WEBHOOK_SIGNING_SECRET=
   
   # Clerk Custom Routing
   NEXT_PUBLIC_CLERK_SIGN_IN_URL=/sign-in
   NEXT_PUBLIC_CLERK_SIGN_UP_URL=/sign-up
   
   NEXT_PUBLIC_CLERK_SIGN_IN_FALLBACK_REDIRECT_URL=/dashboard
   NEXT_PUBLIC_CLERK_SIGN_UP_FALLBACK_REDIRECT_URL=/dashboard
   
   # Prisma with Vercel Postgres
   POSTGRES_PRISMA_URL=
   POSTGRES_URL_NON_POOLING=

Available Commands

Command	Description
npm run dev	Start the development server (localhost:3000)
npm run lint	Lint the project
npm run format	Format the code
npm run build	Build the app for production
npm run start	Run the production build