SurveyJS + Next.js Quickstart Template

SurveyJS is a set of JavaScript components that allow you and your users to build surveys / forms, store them in your database, and visualize survey results for data analysis. This quick start template uses Next.js and the following SurveyJS components:

• SurveyJS Form Library
• Survey Creator / Form Builder
• SurveyJS PDF Generator
• SurveyJS Dashboard

Run the application

git clone https://github.com/surveyjs/surveyjs-nextjs.git
cd surveyjs-nextjs
npm i
npm run dev

Open http://localhost:3000/ in your web browser.

Template structure

This template covers most basic use cases. You can find code examples for them in the following files:

• Create a standalone survey
  • data/survey_json.js
  • src/components/Survey.tsx
• Add Survey Creator to a page
  • src/components/SurveyCreator.tsx
• Export a survey to a PDF document
  • src/app/pdf-export/page.tsx
• Visualize survey results
  • As charts
    • data/dashboard_data.js
    • src/components/Dashboard.tsx
  • As a table
    • data/dashboard_data.js
    • src/components/DashboardTabulator.tsx

Building Docker image

docker build \
  --platform linux/amd64 \
  --secret id=google_creds,src="your Google Cloud Service Account JSON file full path" \
  --build-arg MONGO_URI="your_mongo_uri" \
  --build-arg GOOGLE_BUCKET_NAME="your_bucket_name" \
  -t recruitment-form:latest .

Save Docker image

Save the image

docker save recruitment-form:latest -o recruitment-form.tar

Or save with compression

docker save recruitment-form:latest | gzip > recruitment-form.tar.gz