Getting started with Frontend Architecture and DivOps

divops Mar 31, 2021

Trying to understand the world of Frontend Software Development is like trying to solve a Rubix cube that automatically scrambles itself when you get close to solving it. You'll never fully understand it, and that's ok! What you can do though is maybe stop worrying about the entire cube, and focus on one side or even one row, and just be happy you solved that part of it.

My friend Cory House tweeted this a while ago, and I heard him give a talk on it as well...

Why specialize? Because the industry is changing faster than ever.

Today, the half-life of an engineering degree is between 2.5 and 5 years. You must study 10 - 20 hours a week just to keep up with the weekly changes.

Critical read for every dev: https://t.co/lDaDAYA1RH pic.twitter.com/869LlGzlJd
— Cory House (@housecor) March 19, 2018

Specializing in something can be just as if not more rewarding for your long term career growth. Sometimes it's ok to stop learning a little about a lot and learn a lot about a little.

The important point to make here is, you don't have to know everything there is to know about Frontend Development to be successful. In fact, you might be more successful if you simply pick the area of frontend you want to specialize in, and stick with that! Inside of the frontend world, as Brad Frost put it so well recently, there's the Front of the frontend, and the Back of the frontend. If you're reading this and you find yourself leaning more and more into the "Back of the frontend", aka things like bundlers, testing, CI, Docker, deployments, APIs, etc, then maybe you should consider specializing in Frontend Architecture aka DivOps.

A lot of folks who start to specialize in DivOps at one point were on the Front side of frontend, using jQuery, then into Backbone, require.js, maybe Angular, then React or Vue, etc etc. Along that journey a few folks might have decided that actually enjoyed spending time configuring all those different tools to work. As time has passed, it's become increasingly more and more difficult and tedious to manage all that configuration and infrastructure.

If the journey you're on feels like you've started venturing into the Divops world, then here are some great resources to get you started!

Weekly newsletters such as node, esnext, and JS Weekly are expertly curated with swaths of knowledge delivered to your inbox weekly
Ya know that node_modules folder? Actually try looking into it some times. You can spend a few minutes reading over some babel plugins and learn a ton about important topics like ASTs
Speaking of which, learn some ASTs! Start with the Babel Handbook, ASTs are how most modern tools work under the hood and can be extremely powerful in manipulating thousands of lines of code in seconds through things like babel plugins and "codemods". Codemods are a great way to update code consistently across a codebase. it is important for a DivOps role because we tend to focus on making wild scale changes
While yes, there are a TON of tools out there, you don't have to learn ALL of them at once, pick a few at a time, find out which one you like, try to learn the ins and outs of webpack vs rollup vs snowpack. In the end of the day, there are reasons why you might choose one over the other, but there's no technically wrong choice. Pick what works for your problem at that moment.
Learn about monorepo tools like yarn workspaces, lerna, bolt, rush, etc. Monorepos can be extremely useful in a large scale frontend architecture
Read code, like lots of it, particularly in code bases like Babel, Typescript ESLint, or just go through trending Github languages like... http://github.com/trending/javascript, http://github.com/trending/javascript.
Learn Docker. Docker is huge in the DivOps, and DevOps worlds alike.
Learn a CI tool, or a few... CircleCI, Travis CI, Github Actions, and Azure Pipelines are all good ones to get started with and basically all do the same thing, just slightly differently
Typescript is probably a good idea now. :)
Talk to people, engage, join a community, join Twitter to meet folks doing this same type of stuff, go to conferences, even virtual ones can offer you a chance to meet others
Write. Things. Down. This cannot be stressed this enough. Journal, blog, create a Notion blog, Evernote, etc. Write down everything, ideas, day to day work logs, tips and tricks, proposals that you can share with other engineers or leadership folks, etc. Our brains can hold a finite amount of information in them at once.