Book Image

Building Data-Driven Applications with Danfo.js

By : Rising Odegua, Stephen Oni
Book Image

Building Data-Driven Applications with Danfo.js

By: Rising Odegua, Stephen Oni

Overview of this book

Most data analysts use Python and pandas for data processing for the convenience and performance these libraries provide. However, JavaScript developers have always wanted to use machine learning in the browser as well. This book focuses on how Danfo.js brings data processing, analysis, and ML tools to JavaScript developers and how to make the most of this library to build data-driven applications. Starting with an overview of modern JavaScript, you’ll cover data analysis and transformation with Danfo.js and Dnotebook. The book then shows you how to load different datasets, combine and analyze them by performing operations such as handling missing values and string manipulations. You’ll also get to grips with data plotting, visualization, aggregation, and group operations by combining Danfo.js with Plotly. As you advance, you’ll create a no-code data analysis and handling system and create-react-app, react-table, react-chart, Draggable.js, and tailwindcss, and understand how to use TensorFlow.js and Danfo.js to build a recommendation system. Finally, you’ll build a Twitter analytics dashboard powered by Danfo.js, Next.js, node-nlp, and Twit.js. By the end of this app development book, you’ll be able to build and embed data analytics, visualization, and ML capabilities into any JavaScript app in server-side Node.js or the browser.

Related Content you might be interested in

Current Title:

Small book image
Building Data-Driven Applications with Danfo.js
Rising Odegua | Stephen Oni
Sep, 2021 | 476 pages
No titles found
Table of Contents (18 chapters)
Preface
Preface
Who this book is for
What this book covers
To get the most out of this book
Download the example code files
Download the color images
Conventions used
Get in touch
Share Your Thoughts
1
Section 1: The Basics
Section 1: The Basics
Free Chapter
2
Chapter 1: An Overview of Modern JavaScript
Chapter 1: An Overview of Modern JavaScript
Technical requirements
Understanding the difference between let and var
Destructuring
Spread syntax
Overview of scopes and closures
Understanding Array and Object methods
Understanding the this property
Arrow functions
Promises and async/await
Object-oriented programming and JavaScript classes
Setting up a modern JavaScript environment with transpilers
Unit testing with Mocha and Chai
Summary
3
Section 2: Data Analysis and Manipulation with Danfo.js and Dnotebook
Section 2: Data Analysis and Manipulation with Danfo.js and Dnotebook
4
Chapter 2: Dnotebook - An Interactive Computing Environment for JavaScript
Chapter 2: Dnotebook - An Interactive Computing Environment for JavaScript
Technical requirements
Introduction to Dnotebook
Setup and installation of Dnotebook
Basic concepts behind interactive computing in Dnotebook
Writing interactive code
Working with Markdown cells
Saving notebooks
Summary
5
Chapter 3: Getting Started with Danfo.js
Chapter 3: Getting Started with Danfo.js
Technical requirements
Why you need Danfo.js
Installing Danfo.js
Introducing Series and DataFrames
Essential functions and methods in Danfo.js
Data loading and working with different file formats
Summary
6
Chapter 4: Data Analysis, Wrangling, and Transformation
Chapter 4: Data Analysis, Wrangling, and Transformation
Technical requirements
Transforming data
Combining datasets
Series data accessors
Calculating statistics
Summary
7
Chapter 5: Data Visualization with Plotly.js
Chapter 5: Data Visualization with Plotly.js
Technical requirements
A brief primer on Plotly.js
Fundamentals of Plotly.js
Creating basic charts with Plotly.js
Creating statistical charts with Plotly.js
Summary
8
Chapter 6: Data Visualization with Danfo.js
Chapter 6: Data Visualization with Danfo.js
Technical requirements
Setting up Danfo.js for plotting
Creating line charts with Danfo.js
Creating scatter plots with Danfo.js
Creating box and violin plots with Danfo.js
Creating histograms with Danfo.js
Creating bar charts with Danfo.js
Summary
9
Chapter 7: Data Aggregation and Group Operations
Chapter 7: Data Aggregation and Group Operations
Technical requirements
Grouping data
Iterating through grouped data
Using the .apply method
Data aggregation of grouped data
Summary
10
Section 3: Building Data-Driven Applications
Section 3: Building Data-Driven Applications
11
Chapter 8: Creating a No-Code Data Analysis/Handling System
Chapter 8: Creating a No-Code Data Analysis/Handling System
Technical requirements
Setting up the project environment
Structuring and designing the app
App layout and the DataTable component
Creating different DataFrame operation components
Implementing the chart component
Summary
12
Chapter 9: Basics of Machine Learning
Chapter 9: Basics of Machine Learning
Technical requirements
Introduction to machine learning
Why machine learning works
Machine learning problems/tasks
Machine learning in JavaScript
Applications of machine learning
Resources to understand machine learning in depth
Summary
13
Chapter 10: Introduction to TensorFlow.js
Chapter 10: Introduction to TensorFlow.js
Technical requirements
What is TensorFlow.js?
Installing and using TensorFlow.js
Tensors and basic operations on tensors
Building a simple regression model with TensorFlow.js
Summary
14
Chapter 11: Building a Recommendation System with Danfo.js and TensorFlow.js
Chapter 11: Building a Recommendation System with Danfo.js and TensorFlow.js
Technical requirements
What is a recommendation system?
The neural network approach to creating a recommendation system
Building a movie recommendation system
Summary
15
Chapter 12: Building a Twitter Analysis Dashboard
Chapter 12: Building a Twitter Analysis Dashboard
Technical requirements
Setting up the project environment
Building the backend
Building the frontend
Summary
16
Chapter 13: Appendix: Essential JavaScript Concepts
Chapter 13: Appendix: Essential JavaScript Concepts
Technical requirements
Quick overview of JavaScript
Understanding the fundamentals of JavaScript
Summary
Why subscribe?
17
Other Books You May Enjoy
Other Books You May Enjoy
Packt is searching for authors like you
Share Your Thoughts

Building the frontend

For our frontend design, we will use the default UI that comes with Next.js, as shown in Figure 12.3. We will implement the following set of components for our frontend:

  • The Search component: Creates a search box to search for Twitter users.
  • The ValueCount component: Obtains the count of unique values and plots it using a bar chart or pie chart.
  • The Plot component: This component is used to plot our sentiment analysis in the form of a bar chart.
  • The Table component: This is used to display the obtained user data in table form.

In the following sections, we'll implement the preceding list of components. Let's get started by implementing the Search component.

Creating the Search component

The Search component is the main component for setting the app in action. It provides the input field in which a Twitter user's name can be inputted and then searched for. The search component enables us to make a call to the two...

Previous Section
End of Section 5
Next Section