Introduction

Hello new friend! 👋

This is me, speaking at Write The Docs Prague in 2015

Welcome to what I hope is the best and most fun React and D3 learning resource on the internet. No TODO apps here, just fun interactive stuff that makes you look great at a dinner party.

After an hour with React for Dataviz, you’ll know how to make React and D3.js play together. You’ll know how to create composable data visualizations. Understand why that’s a good idea, and you will have the tools to build your own library of interactive visualization components. Or use and understand somebody else's.

It's going to be fun!

I believe learning new tech should be exciting, so I did my best to inject joy whenever I could.

250+ pages as a book, 8 example apps, near 8 hours of video, a bunch of skill building blocks. 👌

Going through this course you will:

build a bunch of reusable visualization components
build an interactive data dashboard
learn about reusable animation components
learn the basics of D3.js
master React
learn the basics of Redux and MobX
look into rendering rich animations on canvas
learn about server-side rendering
learn a few basics of data science
learn some WebGL and 3D rendering

You might be thinking "How the hell does this all fit together to help me build interactive graphs and charts?". They're building blocks!

First I will show you the basics. Stuff like how to make React and D3 like each other, how to approach rendering, what to do with state.

Then you'll build a big project to see how it all fits together.

When you're comfortable with React and D3 working together, I will show you animation. Cool things like how to approach updating components with fine grained control and how to do transitions. I'll show you how tricks from the gaming industry work on the web.

Short on time? Don't worry.

The initial examples work in CodeSandbox, a web-based IDE. Read the explanation, run the code, master enough React to be dangerous. You won't even have to leave the browser.

In about an hour, you'll know React and D3 well enough to explore on your own, to sell the tech to your boss and your team, and to assess if the React+D3 combination fits your needs.

I believe learning new tech should be exciting.

Foreword

I wrote the first version of React+D3 in Spring 2015 as a dare. Can I learn a thing and write a book in a month? Yes.

That first version was 91 pages long and sold a few hundred copies. Great success!

You are reading, and watching, the pinnacle of how this material has evolved over 5 years. 5 years I've been working on this. Not every day, not all the time.

Little experiments here and there, launches and relaunches about once a year. Learning how to do video, exploring new approaches, hosting in-person workshops.

A lot has changed.

React isn't what it used to be. The internals are different, the API is easier to use. Hooks flipped everything on its head all over again. Suspense and async rendering are coming soon.

D3 has seen less change, but still went through major improvements. It's easier to use now. Easier to understand. More modern.

It feels like the web development world is a different place in late 2020 than it was in early 2015. It really does. Look at my code from 5 years ago and I think "What!? We used to live like this? This is horrible"

Almost 200 people bought this version of React+D3 in preorders alone. It started as a book update and grew into a proper online course.

If you're one of those early supporters, thank you! You are the best. Without you this never would have happened. 🙏🏻