Today a link came across in Front-end Focus called the Front-End Developer Handbook 2017.
Here is the description from the email:
“Cody Lindley’s popular guide to the practice of front-end engineering, how to learn it, and what tools to use, has been updated for 2017.”
If you want to grab a free copy, you can do so here.
But before you do, let me give you a quick warning: this book is a huge list of curated links to free online tutorials.
There is nothing wrong with that, but in this case, it is supported by Front-end Masters (more or less a coding boot camp). They have an interest in taking you through the forest to see the trees, so that you will see the value in an intense curated experience AKA the boot camp.
I am sure they are aware at the massive time required to consume every tutorial linked in this book. Immense amounts of time.
There is certainly value in programs like Front-end Masters, but it is not a one size fits all approach. My experience doing several workshops for other boot camps is while students get an overwhelming overview approach (much like this free ebook) they end up not being able to translate visual designs into responsive websites. Not good.
This handbook highlights the largest distinction between the front-end engineer and the design systems engineer.
The former focuses on frameworks and technology (kind of like the back-end world of business logic thrown into the front-end of today) but fundamentally does not understand how to translate visual designs. They might be familiar with a framework like Bootstrap but when push comes to shove, they are just pushing other people’s buttons on the page. They can do it, but they have little to know understanding of how to change things. Matching a design precisely is likely out of the question.
Compare this with the role of the design systems engineer. An individual trained to translate the visual nature of today’s websites and apps into a fantastic experience. They are an advocate for the user, advocates for the design team, but they are also advocates for the engineering team that will have build on the systems they create.
Marc Otto, the famous creator of Bootstrap, even suggests himself that we should be building our own Bootstraps. This is in 2013. That is like 50 years ago in web time.
This is what I aim to do in my new course, Responsive Design Translation. I will teach you my process on how to build your own design systems. It is the perfect training for the aspiring design systems engineer on your team. Basically, as Marc Otto says, to build your own Bootstrap.
Now I want to explore the handbook more. Here you will find only one table of contents listing for HTML + CSS. This shows you the level of importance the author placed on the subject.
I took a quick look at this chapter and it provides a single link to a free box model tutorial. Super disappointing.
I have talked before how many tutorials covering the box model fail by telling you every single option, not telling you why you would use said opinion, and pretty much zero real world examples of how to use this.
Just skimming the table of contents of this box model tutorial, I can see that this tutorial also misses the sweet spot.
Its no wonder if you don’t have a solid design systems engineer or team on your project you can be thrown to the wolves.
This handbook does not give you a good understanding of what it is like to actually build modern sites, nor give you the tools to be visually accurate in your approach.
In addition, it provides too much information in the wrong areas. It has no less than six CSS architecture’s that they target at the aspiring front-end engineer. This information alone, without a strong understanding of how a site has to be structured or built can lead to many problems down the road.
We are talking huge technical debt before a single line of code has been written. Avoid this like the plague.
Scouring the internet for a bunch of loosely connected articles is not the most efficient path from point A to point B. Nor is grabbing a free ebook that will send you on a similar wild goose chase through the inter webs.
If you are looking to train your next DSE that is something I can help with. I can also assist if you are struggling to scale as you expand to more and more platforms or web properties and don’t have time to keep up.
Did you enjoy this post?
My name is James Stone and I am a Senior Software Developer at Futurice in Helsinki, Finland. I typically give talks and write about Design Systems (especially with React), React, TypeScript and how to become a better developer. If you would like for me to send you an email every time I publish a new article or talk, please join my email list. I also will occasiounally send out some secret list only information or offers. I expect the frequency to be about one or two times per week.