Pricing changes are coming in January. Contact our Sales team to secure the current price for your desired license.
All documentation
  • Introduction
  • Connecting to data source
    1. Supported data sources
    2. Connecting to other data sources
  • Browser compatibility
  • Documentation for older versions
  • Getting started with the MongoDB Connector

    To quickly and easily connect to a MongoDB database, Flexmonster recommends using our Flexmonster MongoDB Connector, which is based on our custom data source API.

    The Connector needs to be embedded into a middle-layer server that accepts requests from Flexmonster and passes them to the Connector. The Connector then fetches the required data and sends it back to the server, then finally the data reaches Flexmonster and gets displayed in your browser.

    To demonstrate how the Connector, the server, and Flexmonster cooperate, we have prepared a ready-to-use sample project. Using this project as a starting point, you can also connect to your MongoDB database.

    Prerequisites

    Run a sample GitHub project

    Step 1. To get our sample project, download it as ZIP or clone it with the following command:

    git clone https://github.com/flexmonster/pivot-mongo && cd pivot-mongo

    Step 2. Install the npm dependencies described in package.json:

    npm install

    Step 3. Run the server with the following commands:

    npm run build
    npm run start

    Now that the server is running and ready to accept Flexmonster’s requests, you can open client/index.html in the browser to see the Connector’s output.

    Note In this tutorial, you connected to Flexmonster’s sample database. To connect to your own database, follow the steps from the section below.

    Connect to your MongoDB database

    You can use the sample project as a starting point to connect to your MongoDB database. To accomplish this, complete the following steps:

    Step 1. Open src/controller/mongo.ts and replace the existing connection string with yours. For example:

    MongoClient.connect("mongodb://localhost:27017", {
    // ...
    });

    If you are using Node.js 17 or later, change localhost to 127.0.0.1 when connecting to your local MongoDB instance. For more information, see this thread.

    Step 2. Then replace the database name with yours:

    dbo = db.db("your_database_name");

    Step 3. optional If needed, you can configure caching and logging for the MongoDB Connector. Learn more about the Connector’s configurations.

    Step 4. In client/index.html, replace the index value with your collection’s name:

    report: {
      dataSource: {
        type: "api",
        url: "http://localhost:9204/mongo",
        index: "your-collection-name"
      }
    }

    Step 5. Run the server with the following commands:

    npm run build
    npm run start

    Now the data from your MongoDB database is displayed when you open the client/index.html file in a browser.

    You can take our sample project as a ready template and make it work for your application by adding your logic, improving, and expanding the project.

    To learn how to embed the Connector into your server, have a look at this tutorial:

    Display non-Latin characters correctly

    If your data contains non-Latin characters, ensure you have set UTF-8 encoding for your data and page so the data is displayed correctly in the component.

    What’s next?