Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

YouTube

Avoiding D3 Spaghetti With React

React Conferences by GitNation via YouTube

Overview

Discover how to create reusable, animated visualization components using React and D3 in this 20-minute conference talk from React Amsterdam. Learn to overcome the challenges of combining D3's animation performance with React's declarative nature to efficiently build any imaginable visualization. Explore the process of decoupling visualization elements, understand the criteria for a good approach, and see how to effectively integrate React with D3 using the "Layout then Interpolate" method. Examine a practical example using a Pie chart and learn about React Native support through component injection. Gain insights into the speaker's experience of coding 450 charts and the need for a robust charting graphics library. Follow along as the talk covers current DataViz libraries, compares D3 and React, and outlines a roadmap for future developments in this field.

Syllabus

Intro
Challenge: coding 450 charts Needed a charting graphics library
Current DataViz Libs
D3 vs React
Detour: decoupling visualization elements
Criteria for good approach
React + D3: Layout then Interpolate
Why it works well
Example: Pie
React Native Support Component injection-inject the Expo Swg components
Roadmap

Taught by

React Conferences by GitNation

Reviews

Start your review of Avoiding D3 Spaghetti With React

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.