I’ve many a time asked myself the question: “What Makes a Great Front End Developer?” – it’s quite frankly a loaded question, even at first glance.

The position of front end developer is gradually becoming more and broader. In my own career alone, I’m constantly finding that I’m transitioning more and more to the back-end: Setting up virtual machines, updating Apache, configuring SSL certificates, the list goes on and never seems to get bored of itself. It can be really daunting.

So, now that the lines are blurred, how do you measure the skill-set and experience of a true front end developer? Are they specific to the front-end? Or should they maintain and nurture the skills required to understand important back-end functionality as well? That’s what I’m here to discuss, so let’s get into it!

A Great Front End Developer: An all rounder

I’ve always seen true back-end developers as incredibly knowledgeable. The more experience they have behind them, the more they tend to amaze you. That being said, they seem to be almost “stuck” on some level when it comes to being complete all-rounders – they shiver at the thought of HTML markup and CSS and the fact that it needs to be arranged and structured in such a way that makes for a pleasant user experience design. Forgive me if I seem to be generalizing here, but for the most part, back-end developers are only concerned with one thing: functionality.

As a front-end developer, I’ve always felt that I’ve had to account for aesthetic as well as functionality. Think about it for a minute. Building an AJAX contact form is about as functional as you can get. JS passing to PHP, passing back to JS etc, ItsetIt’snot there to make you feel like you’ve contributed to making the site aesthetically pleasing, more a way of introducing sleek and seamless interfacing and functionality to the user, thus contributing to the user experience. The example I’ve provided is just one occurrence of this.

Front end developers, having learnt HTML, CSS and JavaScript, are forced to take functionality into account when creating user experiences or making sure that the two disciplines work as one from a development perspective. They become all-rounders, having to understand what is actually happening between the AJAX data and the PHP file that’s sending off a mail or returning errors.

A good Front-end developer understands this relationship and can see functionality, interface and aesthetic as 3 different entities that combine to provide one great experience.

Conveyors of Meaning or Conveyors of Code?

Front end developers don’t quite seem to fit into the programming boat do they? Or do they? JavaScript is a programming language is it not? If you can program JavaScript does it make you a programmer? Well, I don’t know to be honest. The web world is changing. Knowing JavaScript now for interaction design, web apps, even databases has become possible very quickly. Isn’t it fascinating that now, a front-end developer with plenty of experience with JS can take his web projects / skills / ideas to life without the need of PHP or MySQL? One language that can suffice for the back-end and front-end for the development of sophisticated and light-weight web apps. I think that makes you a programmer. Its often said that HTML and CSS are not programming languages. They most certainly do not meet the functional specifications to be programming languages.

That being said, I’ve always thought that when it comes to semantics (HTML) and aesthetic / color / layout (CSS) – you are in fact programming on some higher level, after all, programming is about logical instructions to a computer that has no real way of understanding other than compiling that information into binary. With HTML and CSS we’re programming structure, scaffolding and meaning to a world of human beings that need to take from it the intended communication, the instructions and compute / compile that in their own minds which are filled with way more arbitrary information than a machine…food for thought.

I think what makes a great Front-End Developer is the fact that they can have deep programming experience, yet can still see where programming and user-experience meet. Its such a fine line, and the lines constantly blur, but being able to decipher those blurs is where true talent lies.

Automation

Programmers are nifty. A truly seasoned front end developer will know that having the choice of performing manual tasks compared to writing a script that will automate them is where the gold lies. We see it every day, from version control, continuous deployment and unit testing.

A good front end developer should take this into account with his own workflow. While using the Front-end Stack, developers haven’t had much to play with in terms of automating tasks as this usually happens on a server of some kind. With the addition of Node.js and NPM this has dramatically changed. Packages like Gulp, Grunt and Bower have made some huge automation changes to our workflows. Automatic browser refresh, SASS to CSS compilation, minifying, concatenating and more. It saves untold hours.

A great front-end developer knows what tasks take time, and find ways to optimize them. Most importantly the redundant ones like refreshing the browser after saving. This is especially important when it comes to Git and version control. I’ve seen Front-end developers build amazing scripts, frameworks and scaffolds that speed their projects along, whether its boilerplates, SASS variable guides or scripts that automatically fill in accessibility attributes.

The SEO-miser

I’ve seen plenty of front end developers get serious slack for this. Most of the time they are to blame for poor markup, and its really something to take into account when developing. The essential rules and principles of HTML are often forgotten. Semantics go out the window and front end developers get a mild case of laziness because who’s really looking at your code right? Well Google is, and Google doesn’t like you very much for being lazy. The semantics and information hierarchy of HTML is not to be taken for granted. Its a front end developers responsibility to make sure that meaning is conveyed in the most semantic way possible. If not, what are you really trying to do?

A great front-end developer can begin a project with a number of facets in mind:

– meaningful semantics

– A clear information hierarchy

– Easy, accessible content

You can see with in minutes when a lazy developer has taken charge. Great developers follow guidelines, follow structure, follow the purpose of HTML, create clear, semantic, structural information for both humans and robots alike.

A Great Front End Developer is a Forever Learner

Often, front end developers are left with more than their skill set even allows for. Sometimes moving a site over to a server doesn’t work? Maybe the .htaccess has a strange rewrite rule? What the hell is the .htaccess anyway? Its seemingly obvious, yet seemingly subtle issues like this is what determines your truly great front end developers. You spend hours researching concepts, functions, and more on topics that you didn’t even know existed. Acronyms popup all too often relating to server scripts and work-arounds. Its truly overwhelming. That being said, a great front-end developer doesn’t shy away from this. They put their most important organ into first gear: Their brain. That smart organ that has got them this far, allows them to look at the situation as not so much as problem but something to be learned, to be gained and to conquer, so that next time they won’t ask for help or spend hours on Stack Overflow looking for loosely related answers.

A truly great front end developer knows when not to quit, when not to give up, when to learn, when to conquer and when to persevere through a lot of uncharted territory that is constantly facing them.

This is a repost of this article with the permission of the blogger. Daine Mawer is a Web Developer, Blogger, WordPresser who likes to make cool stuffs for a living.

The makers of DebugMe hope that you like this post and would love it if you follow us on Twitter. We are tweeting about web design, UI/UX and development related topics multiple times a day. DebugMe is an issue tracking, project management and screenshot tool for every website project. Get visual feedback right away and solve front-end problems faster. Try it now for free.