Material UI Dashboard with React

Material UI is the most popular React UI framework. Created with inspiration from Google’s Material Design, Material UI provides a lot of ready-to-use components to build web applications, including dashboards, fast and easy.In this tutorial, we’ll learn how to build a full-stack dashboard with KPIs, charts, and a data table. We’ll go from data in the...

21h

React Highcharts Example with Cube.js

Started as a simple charting tool for monitoring a snow depth near the owner’s country house in Norway, Highcharts quickly became one of the most popular visualization libraries. It provides a lot of great built-in interactive features and is easy to use.In this tutorial we are going to build a simple e-commerce dashboard with Cube.js and Highcharts....

2w

Comparing Data over Different Time Periods

Comparing a single metric over different time periods is a quite common procedure in data analytics. You can evaluate your company’s performance by comparing this year’s revenue with the previous year’s. You can understand which are the low and high sales months in your market, and furthermore, you can predict customer behavior and figure out seasonal...

2w

Introducing a Drill Down Table API in Cube.js

Since the release of drill down support in version 0.19.23, you can build interfaces to let users dive deeper into visualizations and data…Continue reading on Cube Dev »

Jul 2020

D3 Dashboard Tutorial with Cube.js

In this tutorial, I’ll cover building a basic dashboard application with Cube.js and the most popular library for visualizing data — D3.js. Although Cube.js doesn’t provide a visualization layer itself, it is very easy to integrate with any existing charting library. Additionally, you can use Cube.js Templates to scaffold a frontend application with...

May 2020

Real-Time Dashboard with MongoDB

This is an excerpt from the guide on building real-time dashboards with React and Cube.js. You can check the full guide here.A real-time dashboard is a dashboard that contains charts that are automatically updated with the most current data available. The typical use case is to load a chart with some historical data first and then live update it as...

Dec 2019

React Dashboard Ultimate Guide. Part 1: Overview and Analytics Backend

This is the first part from a guide on building dynamic analytics dashboards and applications with React, GraphQL, and Cube.js You can find the full guide hereAlso, below you can see the demo of the final application. An online demo is available here.https://medium.com/media/16afd27897c79d847d0453e62991e6c2/hrefNowadays, we see analytics dashboards...

Nov 2019

Chart.js Example with Dynamic Dataset

I’ve already covered building a static dashboard with Cube.js and Chart.js in this tutorial. Now, I’m going to show you how to dynamically change the underlying chart’s data based on the user’s input. We’ll let the user pick a date range and based on that, reload the chart. When a user picks a new set of dates, a new request will be sent to the Cube.js...

Sep 2019

Using MySQL as a Cache Layer for BigQuery

BigQuery is great at handling large datasets, but will never give you a sub-second response, even on small datasets. It leads to a wait time on dashboards and charts, especially dynamic, where users can select different date ranges or change filters. It is almost always okay for internal BIs, but not for customer-facing analytics. We tolerate a lot...

Sep 2019

Design Decisions for the First Embedded Analytics Open-Source Framework

Design Decisions for the First Embedded Analytics Open-Source FrameworkFor the last couple of years, we’ve been working on Cube.js, an analytics framework built specifically for customization and embedding. There are a lot of great tools data engineers can use to build internal data infrastructure. But there is a lack of tools for software engineers...

Sep 2019