Hi, I’m Swizec Teller. Over the years I've helped over 10,000 engineers hone their craft. 

With React+D3v4 you'll learn the basics of building fast data visualization components in about an hour. Get started immediately without installing anything.

I based React+D3v4 on 20 years of experience with learning how to code on my own, reading blogs and articles, listening to professors, and working with mentors.

Don't know React? React+D3v4 starts at the very beginning.

Struggling with D3? Every function is explained.

Christina

I bought your course Because D3.js is highly flexible, and writing a bunch of method chaining sucks for D3

Frontend Engineer

Francois

I'm a react veteran who has always wanted to learn D3. I know enough about it to know there will be some quirks integrating with react, so figured your book would save me and my team from having to figure those out on our own. 

I use React because it is the sane way of doing things. I use D3 because I have to. I want nice interactive charts. I want to stay sane.

Software Engineer

Amit

In my old age, I love having practical examples to help me learn new things faster.

D3's docs alone are okay but marrying them with React (as a react newbie) is not as straightforward as someone handholding you through the process. And, since I don't have hours after work or on weekends to hack on things like I used to before I was married (or had kids), I need to optimize my learning.

I already owned your previous version and know it would be worth my money to buy the updated version.

Thanks for all of the hard work!

Freelance Engineer

Become a data visualization engineer with React + D3v4

We're going to use a lot of buzzwords in this book. Hell, we've used some already. Most will get a thorough explanation further on, but let me give you a quick rundown.

- **Babel**, a JavaScript transpiler that makes your code work on all browsers.
- **ECMAScript2016**, official name for the part of ES7 we're getting in 2016
- **ES5**, any JavaScript features that existed before June 2015
- **ES6/ECMAScript2015**, any JavaScript features released as part of the new standard in June 2015 (think `=>` and stuff)
- **ES7**, the standard we got in 2016, but also a catch-all for future JavaScript features
- **ES6+**, an umbrella term for "modern JavaScript"; anything new since 2015
- **fat arrows**, a new way to define functions in ES6 (`=>`)
- **Git**, a version control system. It's pretty popular, you probably know it :)
- **H1B**, a popular type of work visa in the United States
- **JSX**, a language/syntax that lets you use `<a href="/example">` as a native part of JavaScript
- **Mustache**, a popular way to write HTML templates for JavaScript code. Uses `{{ ... }}` syntax.
- **npm**, most popular package manager for JavaScript libraries
- **props**, component properties set when rendering
- **state**, a local dictionary of values available in most components
- **functional stateless components**, React components expressed as pure functions that take props and return markup
- **Webpack**, a module packager for JavaScript. Makes it more convenient to organize code into multiple files. Provides cool plugins.

Introduction

The Meat Start

Simpler Environment

The New Meat

Animation

Animating React Redux

Speed Optimizations

Conclusion

Appendices

Buzzword soup explained