DEV Community

Cover image for Data Visualization with D3, React, visx and Typescript: 1 - Introduction
Pedro Filho
Pedro Filho

Posted on • Edited on

Data Visualization with D3, React, visx and Typescript: 1 - Introduction

This is the first video of a series that I'm creating to teach you about data visualization using some technologies like D3, React, visx and Typescript. I hope you like it.

I'm creating this course because I heard a few times that professionals with data visualization skills are rare, and when they appear on the market, they get hired pretty quickly.

Data visualization is a way of telling a history with an image. It is important for humans, because that's the way we can actually understand the data that is presented to us.

One example I like to give is that we know, by common sense, that the life expectancy is going higher over time, but how do we quantify and prove it? How do we let other people know about it with just a few seconds of their time?

What if I showed you this data, would you be able to get the essence of it?

https://ourworldindata.org/grapher/life-expectancy?tab=table&time=1770..2019&country=Africa~Asia~Europe~OWID_WRL~Americas~Oceania

Now, if I give you this, you would probably get it really fast, right?

https://ourworldindata.org/grapher/life-expectancy?tab=chart&time=1770..2019&country=Africa~Asia~Europe~OWID_WRL~Americas~Oceania

This transformation is actually what we are going to learn! How to get RAW datasets and transform them in beautiful data visualizations using the power of D3.

By the way, this course is not for complete beginners, you should have previous knowledge of JavaScript, a little bit of Typescript, and React.

With this, we will create, by the end of this course, a beautiful chart, that you can customize and add to your portfolio!

Top comments (0)