#teamagami

In the fast-paced world of business, staying ahead requires more than just innovation—it demands a seamless integration of cutting-edge tools. An effective client management is crucial for success in the quickly changing modern company environment. The need for a strong Customer Relationship Management (CRM) system grows as companies navigate the pursuit of a competitive edge.

Say goodbye to cumbersome CRMs hindering your client relationships!

Customer Relationship Management — Agami's CRMstock

Try Agami’s CRMstock, the game-changer to foster efficient CRM system... Read more

To explore more Agami blogs

Embark on a Networking Odyssey with Nediaz: Your Professional Wingman! In the challenging ascent of your career mountain, forging meaningful connections is your secret weapon. Navigating the intricate world of networking requires finesse and strategy. Fear not, for Nediaz is your unseen ally, your trusty sherpa in the realm of professional networking. Unveil the art of authentic connections, hone soft skills, and master the elevator pitch with Nediaz's user-friendly interface. To real the full article: https://nediaz.com/blog-preview/networking-made-easy-nediaz---your-professional-wingman

What is Axios

Axios is a promise based HTTP client for browser and node.js; it can be used on server side and client side (Browser) to interact with API (Application Programming Interface to send request from the browser and node.js server to other API and get a response).

On client side(Browser) Axios uses XMLHttpRequests and On server-side it uses http module

Installing Axios in your node.js project

$ npm install axios

How to use axios get request

const axios = require(‘axios’); let userID = ‘123456’; axios.get(`/userInfo?id=${userID}`). then(response=>{ console.log(response) }).catch(error=>{ console.log(error) });

Using async/await

async function getUserInfo(){ try{ let userInfo = await axios.get(““/userInfo?id=${userID}`); }catch(error){  console.log(error) } }

How to use axios post request

axios.post(‘/userInfo’, {    firstName: ‘FName’,    lastName: ‘LName’,    dob: ‘06/15/2001’ }).then(response=> {    console.log(response); }).catch(error=> {    console.log(error); });

How to use axios delete request.

axios.delete(‘/userInfo/’+{userID}).then(response=>{ console.log(response); }).catch(error=>{ console.log(error); });

Axios get request for remote image in node.js.

axios({   method: ‘get’,   url: ‘https://images.app.goo.gl/3g4ez2auLnyoYG1u8’,   responseType: ‘stream’ }).then(response=> {     response.data.pipe(fs.createWriteStream(‘forest.jpg’)) }).catch(error=>{   console.log(error) });

To send a file with Axios in node.js.

To send file with Axios in node.js

let url = `API_URL` //API URl where you post filelet fileRecievedFromClientSide = req.file;  let buffer = fs.readFileSync(fileRecievedFromClientSide.path); let form = new FormData();

form.append(‘xlsx’, buffer, fileRecievedFromClientSide.originalname); Axios.post(url, form, {     ‘maxContentLength’: Infinity,     ‘maxBodyLength’: Infinity,     headers: {     ‘Content-Type’: `multipart/form-data, boundary=${form._boundary}`, } }).then(response => {     console.log(response) }).catch(error => { console.log(error) });

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. 

Features

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.

Installation

Now let’s install it and check it out. First clone the repo:

git clone [email protected]:chartbrew/chartbrew.git

Next go to the chartbrew directory and run:

npm run setup

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:

npm run client 

for frontend, and for backend,

npm run server

Creating a Project

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.

Creating a Chart

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. 

Embedding Charts

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.

Public Dashboard

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!

Final thoughts

ChartBrew also has options to manage teams and a granular permission system for creating and modifying charts among other things.