Engineering For The Web: A Primer

It has been an interesting journey over the last decade or so building software for the web. The skills and techniques needed to get the job done have evolved drastically along with the platform itself. What used to be a solo “web master” role describing someone who put up a five page site on a shared hosting provider has now expanded into professional team sport with a much broader spectrum of roles comprising of font-end, back-end, devops, full-stack, among many others.

Given that evolution, it's interesting to think about what the underlying skills & technologies are that make up those roles and where do we draw the domain boundaries for each of them.

So let's start at the top of the stack with front-end developer's role. What are some of the skills they are expected to have?

Front-end

Generally I've come across two types of front-end developers. Ones who are more focused on the UI/UX design aspects of the front-end vs the ones who are more focused on making those elements function. Of course then there are those who do both but they are a rare breed.

Design focus

• UI design & wire-framing – PhotoShop, Illustrator, Sketch, etc
• HTML and related templating engines – HAML, Jade, Mustache, etc
• CSS and it's preprocessors – SASS or LESS
• Accessibility & browser compatibility quirks

Development focus

• JavaScript and it's supersets – ClojureScript, CoffeeScript, TypeScript, etc
• Performance & optimization concepts pertaining to the browser and DOM rendering
• NodeJS to interface with package managers & build tools – npm, Gulp, WebPack, etc

With the last bullet point, the lines are already starting to blur as we transition to the back-end

Back-end

• Software design patterns & practices
• Object Oriented / Functional programming
• Data modeling
• API design – REST/HATEOAS
• SDK/3rd party service integration – Stripe, SendGrid, Twilio, etc
• Software security – XSS, SQL Injection, etc
• Software scalability & performance

Again the last bullet point bleeds into DevOps as it involves some understanding of networking fundamentals, memory management, processes/threads, etc

DevOps

• Cloud & PaaS environments – AWS, Heroku, etc
• Virtualization & containerization – Docker, Vagrant, OpenStack, etc
• Provisioning & orchestration – Chef, Puppet, Ansible, etc
• Continuous integration & delivery – Jenkins, TeamCity, etc
• Logging & monitoring – Nagios, Monit, NewRelic, ELK, etc
• Security & hardening – Tripwire, Snort, Netcat etc

Full-stack

That covers some common skills that are part of that holy trinity of the web stack although its by no means a exhaustive list. Now of course not everyone can see their skills perfectly fitting in one or more of those buckets. Depending on the organization & project, roles tend to vary slightly.

Engineers who can transcend those three role boundaries fall in the full-stack category. They are able to learn and keep up with most of the major developments in those areas with varying degree of focus depending on the task at hand.

With the rise of NodeJS and isomorphic application architecture this is something that will become more and more common.

10x / Ninja / RockStar

There are some skills that are shared between the those roles which are not usually explicitly required but probably end up determining if an engineer is given the mythical 10x / Ninja / RockStar label. Of course those labels are thrown around quite loosely and even an existence of such a thing is hotly debated but let's say that's a thing, what would or should it mean? Maybe some of these skills would be a start:

• Proficiency in source management with modern DVCSs like git, hg, etc
• Leveraging text editors/IDEs such as Vi, Emacs, SublimeText, Atom, etc to maximize their efficiency
• Ability to smartly prioritize and manage their tasks
• Ability to gather requirements from relevant stake holders and ask the right questions
• Project planning and estimation
• Continuing education
• Soft skills / people skills

That's all for now. Would love to hear your thoughts about this. Is this is a good primer or is it missing some more basics? What has been your experience in the industry?

This post was originally published on my blog. If you liked this post, please share it on social media and follow me on Twitter!