Skip to content

This demo illustrates how easy it is to set up a client-server interaction of the SurveyJS client-side form builder component with any backend. By following the steps below you can run a sample React app with an integrated form builder. As a backend, the application uses NodeJS that stores form data in a MongoDB database.

License

Notifications You must be signed in to change notification settings

surveyjs/surveyjs-nodejs-mongodb

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

9 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

SurveyJS + NodeJS + MongoDB Demo Example

This demo shows how to integrate SurveyJS components with a NodeJS backend using a MongoDB database as a storage.

View Demo Online

Disclaimer

This demo must not be used as a real service as it doesn't cover such real-world survey service aspects as authentication, authorization, user management, access levels, and different security issues. These aspects are covered by backend-specific articles, forums, and documentation.

Run the Application

  1. Install NodeJS and Docker Desktop on your machine.

  2. Run the following commands:

    git clone https://github.com/surveyjs/surveyjs-nodejs-mongodb.git
    cd surveyjs-nodejs-mongodb
    docker compose up -d
  3. Open http://localhost:9080 in your web browser.

Client-Side App

The client-side part is the surveyjs-react-client React application. The current project includes only the application's build artifacts in the public directory. Refer to the surveyjs-react-client repo for full code and information about the application.

Integrate SurveyJS with MongoDB

SurveyJS communicates with any database using JSON objects that contain either survey schemas or user responses. A MongoDB database should have two collections to store these objects: surveys and results. You can refer to the following file to view a code example of how to create them: surveyjs-init.js. The diagram below shows the structure of these collections:

SurveyJS: The structure of database collections

To modify data in the surveys and results collections, you need to implement several JavaScript functions. According to the tasks they perform, these functions can be split into three modules:

  • Query builder
    JS functions that construct CRUD queries (see the nosql-crud-adapter.js file).

  • Query runner
    JS functions that establish connection with a database to run the queries (see the mongo.js file).

  • Survey storage
    JS functions that provide an API for working with survey schemas and user responses (see the survey-storage.js file). This API is used by the NodeJS application router (see the index.js file).

These modules interact with each other as shown on the following diagram:

SurveyJS MongoDB Integration

If you want to integrate SurveyJS with other databases, you can modify or replace the query builder and query runner without changing the survey storage module. This approach is applied to PostgreSQL integration in the following repository: surveyjs-nodejs-postgresql.

About

This demo illustrates how easy it is to set up a client-server interaction of the SurveyJS client-side form builder component with any backend. By following the steps below you can run a sample React app with an integrated form builder. As a backend, the application uses NodeJS that stores form data in a MongoDB database.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published