How d3.js changed the way I think about the frontend
Like a lot of developers when they first start, I used to think of frontend programming as being almost synonymous with design and user experience. If you asked me what frontend meant at that point I would have replied by saying something like “it’s everything you see as a user, it’s the layout of a page, the colours and the fonts.”
In September 2020 I started and completed the Data Visualization course on freeCodeCamp. It’s a course in the d3.js library with five capstone projects.
I didn’t envisage this course being particularly useful as I didn’t see myself ever programming bar charts for a living, but I wanted the Full Stack Certificate and part of it was the d3 course so I decided to spend a few days on it.
I learned that with d3.js you’re essentially translating data points in a JSON dataset into SVG shapes. The value of the datapoint itself determines how it will appear in the visualization. You write the JavaScript file that translates the data into shapes.
This course forced me to think about frontend in terms of pulling and representing data, rather than focussing on colours, buttons and layouts. After completing the five d3 projects in that course my view of the frontend subsequently became more focussed around data.
That’s how I think about frontend development now. At the core you’re fetching and displaying data; translating data points into UI components.
It moved my focus from design to data.
I guess another lesson is to just keep building, and keep trying new things. You never know in what way it will change your perspective on development in general.
My d3 projects from this course:
