Written by Cody Lindley updated
A broad examination of the front-end developer profession.
Contribute content, suggestions, and fixes on github:
An individual typically enters into the field of front-end development by first learning to build a simple website using HTML and CSS. HTML or HyperText Markup Language is likened to the structural framing of a house, while CSS or Cascading Style Sheets can be considered the finishing touches one sees once a home is complete.
The web platform runtime is not just for web browsers. It can also be used by WebViews and Progressive Web App (aka PWA) techniques to create native-like applications that are installed on an operating system. This means that a front-end developer can take their knowledge of web technologies and the web platform run time associated with browsers and web development and use these skills to create native applications for popular operating systems like Windows, Mac OS X, iOS, Android, and Linux.
The most common solutions for WebView development are:
Some examples of these environments are:
As you can see, Front-end developers not only develop for web browsers but also for several other run time scenarios beyond web browsers. Being a front-end developer today could mean creating webpages and web applications that are accessed via web browsers, but it can also mean creating native applications that are installed on operating systems and run offline (e.g. Visual Studio Code is built using Electron).
Beyond being skilled at the technologies just mentioned, a front-end developer might also be skilled in one or more of the following areas:
Simultaneously, a trend has been occurring for several years now where websites and web applications are being built using a thick/fat client architecture (e.g., Single Page Applications or SPA's). Meaning, what was once mostly done on the server is now done in the client at runtime. In short, the application logic that runs a website or web application will today often run in the client instead of on the server. When this architecture is in use, the data that drives the website or web application is requested at runtime by the client using a data API (i.e., an interface that returns data only, typically in the form of JSON). What this means for the front-end developer profession is what was once consider back-end competencies are now becoming required competencies to do front-end development (e.g., Software Development, Web Application Development, Software Build Processes, State management, Application performance, etc).
Front-End Web Designer: When the word "Designer" is included in the job title, this will denote that the designer will possess front-end skills (i.e., HTML & CSS) but also professional design (Visual Design and Interaction Design) skills.
UI (User Interface) Developer/Engineer: When the word "Interface" or "UI" is included in the job title, this will denote that the developer should have interaction design skills in addition to front-end developer skills or front-end engineering skills.
Mobile/Tablet Front-End Developer/Engineer: When the word "Mobile" or "Tablet" is included in the job title, this will denote that the developer has experience developing front-ends that run on mobile or tablet devices (either natively e.g., React Native, or on the web platform, i.e., in a browser).
Front-End SEO Expert: When the word "SEO" is included in the job title, this will denote that the developer has extensive experience crafting front-end technologies towards an SEO strategy.
Front-End Accessibility Expert: When the word "Accessibility" is included in the job title, this will denote that the developer has extensive experience crafting front-end technologies that support accessibility requirements and standards.
Front-End Developer Operations Engineer: When the word "DevOps" is included in the job title, this will denote that the developer has extensive experience with software development practices pertaining to developer collaboration, tooling, integration, deployment, automation, and quality.
Front-End Testing/QA Engineer: When the word "Testing" or "QA" is included in the job title, this will denote that the developer has extensive experience testing and managing software that involves manual testing, unit testing, functional/integration testing, user testing, and A/B testing.
Note that each of these job titles could potentially be prefixed with the terms "Junior," "Mid-level," "Senior," "Lead," "Director," or "Principle".
A front-end developer will often work on a web development team containing the following roles:
The five roles just mentioned can overlap each other. For example, a front-end developer will typically have a good handle on UI/Interaction design as well as Back-end development. Additionally, it is not uncommon to find a Visual Designer who does Interaction Design and can also contribute to front-end coding efforts.
A larger web development team might include the following roles not mentioned above:
Of course, when you first enter into the profession, expect to enter the field at around 40k a year depending upon location and experience.
A lead/senior/principal front-end developer/engineer can potentially live wherever they want (i.e., work remotely) and make over $150k a year (visit angel.co, sign-up, review front-end jobs over $150k or examine the salary ranges on Stack Overflow Jobs).