{"id":46710,"date":"2022-07-15T00:00:00","date_gmt":"2022-07-15T07:00:00","guid":{"rendered":"https:\/\/griddb-linux-hte8hndjf8cka8ht.westus-01.azurewebsites.net\/blog\/gern-stack\/"},"modified":"2025-11-13T12:56:05","modified_gmt":"2025-11-13T20:56:05","slug":"gern-stack","status":"publish","type":"post","link":"https:\/\/www.griddb.net\/en\/blog\/gern-stack\/","title":{"rendered":"An Alternative to the MERN Stack: Create a Query Builder with the GERN Stack"},"content":{"rendered":"

This blog serves as a soft follow up to a previous blog<\/a> in which we used Facebook’s React<\/a>, paired with the GridDB Web API, to ingest a CSV file and then visualize said data. In this follow up, we will again use React, but this time we will be using the GridDB Node.js connector instead of the Web API to ingest and serve data to our frontend. You can think of this configuration as the GERN stack: GridDB, Express, React, and node.js; this is an obvious play on the hugely popular MERN stack <\/a><\/p>\n

The main and obvious difference between the MERN stack and the GERN Stack is of course the database being deployed. The original acronym stands for MongoDB, Express.js, React.js, and node.js. If you are unfamiliar with MongoDB, it is a document-based database which allows for quick prototyping as the NoSQL schema allows for very fluid ingestion of data without any sort of foresight or pre-planning. Using the GERN stack over the MERN stack depends solely on your use case — if you need much higher performance, if you need to store time series data, or if your data is from IoT sensors — you would opt to use GridDB over MongoDB.<\/p>\n

Project Overview<\/h2>\n

To showcase these products, we will create a simple query builder app that will display data that a user selects via dropdown menus. We will go through the process of installing the GridDB node.js client via npm, ingesting our open source data from Kaggle<\/a>, and then setting up a React frontend to work with a node.js server (backend) connected to GridDB. We will also set the project up to build out the static React assets and be able to deploy this sort of project onto a website (and to avoid using two running node.js servers).<\/p>\n

From there, we can move on to the frontend which will be simple: three dropdowns to allow a user to find some data points relating to the dataset which was ingested. We will then showcase sending query strings to our backend to run against our DB and then pushing the results back up to the frontend.<\/p>\n

Full Source Code Found Here<\/a><\/p>\n

Here is a quick example of the completed project:<\/p>\n

\n