BI tools are softwares that take huge amounts of data from all kinds of sources and process them to produce charts and graphs and other different types of visual media for easy understanding. There are many BI tools available on the market, both proprietary and open source, and one such tool is ChartBrew.
ChartBrew is an open source tool freely available to use. It’s licensed under MIT that means we can also modify it according to our needs. Chartbrew is a web based software, written in JavaScript. React is used to create the frontend and Node.Js framework for backend.
Let’s talk about the features offered in this tool. ChartBrew supports various data sources including major databases like MongoDB, MySql, and analytics sources such as Google, Simple, Plausible. It also has support for REST API giving us the opportunity to create a custom data source if needed.
ChartBrew has a query editor to write queries to our data sources giving us more freedom in fetching data in the shape of our need. Now with the data we can create different kinds of charts and graphs and also KPIs. These charts can be set to auto update themselves, meaning they will keep fetching data from source at regular intervals and present updated information.
Next ChartBrew provides the means to embed these charts as iframes wherever needed. If we don’t want to embed charts but just want to view them, we can create a public dashboard in it, which gives us a public facing URL, accessible from anywhere.
Now let’s install it and check it out. First clone the repo:
Next go to the chartbrew directory and run:
ChartBrew also requires mysql. So install that if you don’t already have it. Create a ‘chartbrewdev’ name database and then add the db username and password to the .env file, namely CB_DB_USERNAME_DEV and CB_DB_PASSWORD_DEV variables.
And finally start it by running:
for frontend, and for backend,
Let’s give it the name ‘BI Tools’.
Now we create a connection i.e., we choose our data source. I’m choosing MongoDB.
Fill in the usual db details for creating a db connection, test it and then save it.
Now we create a chart, first choose the chart name and click ‘Start Editing’. You can then follow the small walkthrough explaining what is what.
Now we are at the chart builder page. For our chart we need to create a dataset, so click on ‘Add the first dataset’ button choose the dataset name, save it and then select the datasource. I chose MongoDB before and saved the connections by ‘mongo-source’ name so I can see that in the list and I select it.
Now click on the ‘Make Request’ button, this will open the query editor and again a little walkthrough. In my database there is a collection ‘blogs’ which store details regarding a blog such as ‘title’, ‘author’, ‘likes’, and ‘comments’. So my query is:
connection.collection(‘blogs’).find()
On clicking ‘Test the query’, query’s response is displayed on the right side:
Next I save the query for future usage and click on the ‘Build the chart’ button. Then the chart builder page will open again, and now we choose what data should appear on the chart’s X and Y axis. I want to know t he number of likes on each blog so I choose ‘title’ for X-axis and ‘likes’ for Y-axis. And voila, our chart is ready!
As we can see there are other chart options we can choose from such as bar chart, pie chart, polar chart etc. There are some other features available here too like adding filters, modifying axis data, changing colors used on charts, exporting data to excel sheets.
Now we want to embed our chart somewhere else, so first we remove it from draft mode by toggling ‘Draft’ mode at the top of the chart. Next go to ‘Dashboard’ from the left side nav.
Toggle ‘Make Public’ and it’s done. As you can see we can also modify the URL to whatever we want.
Finally our BI tool is ready!
ChartBrew also has options to manage teams and a granular permission system for creating and modifying charts among other things.
This was a small tutorial on how to use ChartBrew. There are a lot of tools out there but I personally like ChartBrew because of its simplicity to use, its MIT licensing and that it’s coded in React and NodeJs. Your mileage may vary. Cheers!
