I loosely follow various topics on Quora.com. Unlike many social media sites, I find that most of the answers to serious questions are respectful, well though-out, and cite references. Most of the questions I follow and answer are related to my role as an icon designer and web developer. I admit to occasionally getting sucked into a debate on religion or politics, but most of the time I successfully avoid these. A recent question piqued my interest. The question was, “What do I need to learn to build a site like Alibaba”?
If you wish to make an apple pie from scratch, you must first invent the universe. — Carl Sagan
I couldn’t help but think of Carl Sagan’s quote, shown above, about how to make an apple pie. The fact that the question implies some fundamentally flawed assumptions aside, the question prompted me to think about what qualifications a senior-level web developer or tech lead should have. The list below is what I came up with.
I have answered the question from a PHP point-of-view, but the list should be easily adaptable to any language base. What is important is the problem each of the technologies solves. You may have other suggestions for the list or disagree with some of the items I have included. Feel free to add to or correct my list in the comments following the post. I am happy to engage in a discussion as well as to learn from others.
So You Want to be a Senior Web Developer?
I recently started working as an independent consulting web developer again after ten years working for corporations, government, and startups. My first two projects stretched me professionally, and allowed me to use all of the skills covered in this article. I will share my experiences and what I learned from those projects in a couple of upcoming articles, so stay tuned.
Early on in my career, as I am sure is the case for many young developers, a “development workflow” consisted of developing in a sub-folder of the live site on cheap web hosting, and doing a wholesale delete-and-replace of the code and database to launch updates. Or, even worse, to try to keep track of every change and manually merge them. Needless to say, this process is fraught with all kinds of dangers and invites errors – often catastrophic in nature – but it is also working way harder than one needs to. Once you learn how to implement and use a proper development workflow, you will wonder how (and why) you ever worked any other way.
By “Development Workflow” I am referring to using, at a minimum, a local development environment, a staging environment, which is an exact mirror of your live/production site, and a read-only production site. Strictly maintaining the read-only part of a production system is not really possible, but the only thing on your production site that should be directly edited is content, whether owner-authored or user-generated. Never make code changes in production. In fact, you should never make code changes in staging either, only in your development environment – and for this, I strongly prefer local development environments for each developer.
Source Code and Version Control
Whether you use git or svn, source code and version control management is a must for any development project. Git usage is so ubiquitous now, it hardly makes sense to use svn any longer except in organizations that have a legacy investment in using svn.
There is really no excuse for not using some kind of source control for code management. Even if your project only has a single developer – you – using Git and a proper branching strategy is a good habit to adopt. For my projects, even very small ones, I use the basic Gitflow strategy.
If you have more than one developer, you absolutely cannot afford to not use version control and branching. To not do so is to invite disaster. At some point, somebody will make a mistake and it could prove to be disastrous for your business or for your client’s business if you don’t have a solid disaster recovery (fallback) plan.
I learned this lesson the hard way many years ago when I was a young, cowboy coder. I spent weeks building a website for a telecom company where I worked. One day, in my zeal to quickly add a new feature to the code, I accidentally nuked my entire website because I added an un-tested recursive
unlink method in my PHP code. The code climbed back up through a directory hierarchy from the location of the script file. I meant to tell the code to delete any files that were hidden by checking if the name began with
.. What I failed to catch right away is that
.file is a hidden file, but
.. are directories. Guess what happened … Lesson learned.
We’ve all been there. You spend days, weeks, or months, building your client’s site on your local development environment. You push to staging, only to find out that the PHP SSL module is missing, or you are missing some core PHP library. Dependency management tools like Composer allow you to easily create configuration files in JSON format as you install different dependencies. When you move to another environment or new server, the dependency manager automates installing the dependencies.
The most basic setup for continuous integration is to simply use Git and web hooks to deploy your code as you commit to your repository. However, this strategy does not do any kind of verification of your code. You can, of course, write scripts to automatically run your unit tests, update configurations, etc. but a much easier and more reliable option is to use one of the tried-and-true Continuous Integration services like Jenkins, Travis, Bamboo, or PHPCI.
You can rely on your continuous integration service to automate unit tests for you but it is also a good idea to run unit tests on your local development before committing your code. This insures that what is committed in your repo is, theoretically, clean and functional code. The most popular unit testing tool for PHP is PHPUnit.
Any discussion of TDD (Test-Driven Development) and its merits is beyond the scope of this article, but the practice of writing unit tests will also often help you discover flaws in your logic even before running the first test because writing the tests for the expected output forces you to think through the logic and decide beforehand exactly what the values and types of inputs and outputs of a particular code unit should be.
By Architecture I am referring to the overall setup of your system. Your setup may be as simple as WordPress running on virtual shared hosting or managed WordPress hosting like WPEngine, or a much more robust setup that implements reverse proxies, load balancers, a separate database server or cluster of servers, database replication, and object caching.
NOTE: Feel free to contact me if you have questions or are interested in learning more about managed WordPress hosting or a more robust, scalalable and performant solution.
AWS cloud hosting
At some point, as a tech lead or senior web developer, you are going to need to set up and manage your own servers where you access and own the infrastructure down to the “bare metal”. There are a lot of cloud hosting services but it probably makes sense to learn on Amazon Web Services hosting since it is the most popular. The principles should be portable to any other service if you understand the underlying principles.
At a minimum, you should know how to install and configure MySQL (or MariaDB) or similar RDBMS (relational database management system), PHP or other server side language with custom modules, Apache or nginx installation and configuration, ipconfig, and basic server hardening.
Reverse Proxies and Load Balancers
A small personal blog with 100 or even 1,000 visitors per day can safely run on a single web server on virtual shared hosting without any issues. But a website with hundreds of thousands, if not millions, of monthly visitors requires and entirely different setup. A WordPress blog running on $4.99 per month web hosting cannot handle dozens, much less hundreds of thousands of concurrent users.
A reverse proxy sits in front of the servers in your system that actually process requests. The reverse proxy can be used to handle load balancing, acceleration, and/or security. Think of the reverse proxy as a receptionist at an office. Inbound calls all go through the receptionist who then decides the most appropriate recipient of the incoming message.
A load balancer is sort of like a traffic cop. It manages incoming HTTP requests to your website and routes the requests to a pool of web servers. There are different load balancing strategies but the two most common are “Round Robin” where each request is routed to the next server in a fixed rotation, and “least utilized” wherein the load balancer sends each request to the server in the pool with the lowest current demand (also known as load). Which strategy you use should be based on the specific requirements of your project.
It is important to insure that your development, staging, and production environments are all identical or very nearly identical when working on a large web app with unique server configuration. This is especially true if you are working as part of a development team. Having different developers working on different servers with different versions and configurations of modules invites headaches, to say the least.
A virtual machine, or VM, allows you to create a server of just about any configuration right on your computer. Many PHP-based sites will run on some flavor of Linux. A VM allows you to quickly provision a server using pre-rolled configurations to emulate running your development site on a dedicated server, but without the hardware, headache, or cost of setting up a physical server.
A detailed explanation of virtual machines is beyond the scope of this project, but I prefer Vagrant running on Oracle’s VirtualBox. You can find boilerplate configurations for many popular systems via a Google search or on Github.
Install & configure PHP
In most cases you won’t have a lot of need to do custom configuration of PHP beyond enabling a few modules. That said, it is still a good idea for a senior web developer to know how to install PHP and even build it from source with a custom configuration.
Install & Configure MySQL/Postgresql
In nearly 20 years as a web developer, I have had very few instances where I needed to do any custom database configuration. Even still, it is a good idea to know how to do it, just in case. Just knowing how it is done can potentially help debug problems that might arise.
At some point, you are going to need to install a module or app that does not come native on your server. Different operating systems have their preferred package managers. For instance, the preferred package manager for Mac OS is Homebrew. Most likely you will need to install more than one depending on which app you need to add to your system. Package managers mostly work the same. A package manager allows you to easily add a new process to your computer by running some variation of
brew install the_silver_searcher where
brew refers to the package manager,
intall is the command to run, and
the_silver_searcher is the app. The package manager checks with a pre-defined location or list of locations to retrieve a list of available packages. When you run the install command, the package manager retrieves information about the package you want to install such as the latest version and the location where the package can be found on the web, then downloads and installs it. With any package manager you can specify the version you want so you are not forced to install the most recent version.
NOTE: Silver Searcher is an alternative to
grep. It is super fast and easy to use. This is one of the first tools I install on any new server or personal computer.
Why perform repetitive, manual tasks when this is what computers were built for? It is far more efficient to set up an automated task runner like Grunt or Gulp to compile, minify, and deploy stylesheet, script, and image assets. There are many flavors from which to choose with a few approaches. At the very least, it is worth the time investment to learn to use Grunt and Gulp given the popularity of both.
A senior web developer must have a solid understanding of different security vulnerabilities in the various tools he/she is using as well as best practices for writing secure code. An exhaustive list of the different areas of concern for basic website security are beyond the scope of this article but they include data scrubbing and preventing injection-type attacks like XSS and CSRF attacks, DDoS, and custom server configuration to harden your web server. This hardening includes things like closing un-used ports, turning off ping and telnet.
Web security is a full-time job in itself but at some point, it is inevitable that you will need to understand the underlying principles and how to take corrective action once you have been the victim of an attack.
Website performance is the first, and one of the most important, factors in enjoying maximum benefit of owning a website. Whether the site in question is an e-commerce site or an informational site, how quickly your site loads and renders directly impacts how your users will behave, and whether or not they continue to use your site, and even affects your rank by search engines. The list below is not exhaustive but gives a basic overview of optimizing for performance.
Querying and reading from a database is slow. Websites built on platforms like WordPress or Drupal can require dozens of database queries just to build a single page. Reading from RAM is much faster. Distributed in-memory caching tools like memecached speed up web apps by keeping pre-compiled code and objects stored in RAM where they are easily-accessible. You won’t need memecached on every project but it is one of the most important tools to know for scalable applications.
Varnish is an HTTP cache. It concentrates solely on speeding up HTTP requests by caching the results of HTTP requests including websites and APIs. Whereas memecached is an object cache, which caches data objects, varnish stores the compiled results of HTTP requests. The two are commonly used in conjunction with one another.
CDN (Akamai, MaxCDN, etc.)
http://accountkey.cdnhost.com/path/to/your/resource.jpg where the
path/to/your/resource.jpg matches the relative path to the resource on your site. If the resource is not currently cached, the CDN will request it from your site then cache it. Subsequent requests for the same resource will be retrieved from the CDNs thousands of edge caching services around the world until the cache expiration is passed. Then the process repeats.
A word of advise – if you are concerned about SEO (search engine optimization) you should use a custom subdomain for your CDN instead of the default CDN URL. For instance, this site uses
cdn.atomiclotus.net instead of
0124abecef.maxcdn.com because I want to make sure I own the canonical version of all of my URLS. Also, if you are using HTTPS on your site, and you should be, you will need a separate SSL certificate for your CDN subdomain.
NOTE: If you need help setting up your CDN, HTTPS, and SSL Certificates, feel free to contact me. I am here to help.
In the early days of the web, there was not really any distinction made between front-end and back-end development. It was all just writing code and building websites. But the world wide web has matured a great deal and each area of concern requires a lot of domain-specific knowledge and it is difficult for any one person to maintain up-to-date, expansive knowledge of all of the technologies for both front and back end development. That being said, I am a strong believer that designers, front-end, and back-end developers should all have at least a basic understanding of the principles of the other areas that go into building an effective website. I would even extend this idea to project managers as well. One can never have too much knowledge and developers who understand design, and designers who understand the basics of development can communicate more effectively and achieve better compromise and better results.
Knowing CSS3 is a no-brainer. It is not necessary for a Senior Web Developer, who is presumably a back-end developer, to know every browser hack and browser-specific prefix in CSS3, but a good senior developer should be able to build a basic page layout using CSS.
SASS and/or LESS
Does anyone write vanilla CSS anymore? Well, anyone other than me? CSS pre-processors like SASS and LESS are fairly ubiquitous now and with task runners like Grunt it is a trivial matter to compile these proprietary languages to CSS that can be understood by every browser. There are some differences between these two but which one you use is a matter of personal preference. SASS and LESS can make your style sheets, especially on large projects, much more manageable by adding common-sense enhancements like the use of constants, mixins, and nesting of rules.
jQuery, Angular, React, and/or Backbone
jQuery is, admittedly, not exactly the same kind of animal as the other frameworks but I am grouping these for convenience. Any web developer, front or back end, should be able to read and write jQuery code.
I have heard it argued that PHP is a templating language, but I don’t really buy it. the point of a templating language is to keep your logic separate from presentation. Templating languages, for the most part, essentially work the same. They include tokens for variable replacement and some basic looping, calculating, and assignment methods. If you know how to use one templating language you can easily learn most others. This is true even if the templating language is not PHP-based. It appears to me that modern templating languages are, by and large, based on XSLT.
There are really only three purposes for any website: to sell something, to share information, or to provide a service. Understanding e-commerce and being able to build an e-commerce site is essential. Given the diverse offerings of PHP-based shopping carts and the fact that which one you choose will largely be driven by which CMS, if any, you are using, I am not going to list the different options.
It goes without being said, that if you are going to build an e-commerce site, you will need a way to process and collect payments. Which payment gateway(s) you use on a particular project will be determined by the business requirements. It is a good idea to be familiar with, at the very least, PayPal and Stripe, since these are the most popular choices. You should also know how to set up a sandbox (test) account and test your code against the sandbox before going live.
The most popular WordPress shopping cart, by far, is WooCommerce. If you plan to do a lot of WordPress development, it will pay to spend the time necessary to learn to build an online store in WooCommerce as well as how to create custom themes and plugins for the system. There is even a fair amount of WooCommerce-specific freelance advertised regularly so your knowledge of WooCommerce could bring in additional jobs.
Similarly to WooCommerce for WordPress, Ubercart is the most popular e-commerce solution for Drupal. The same logic applies as does for WooCommerce. If you plan to do a lot of Drupal development, it is worth spending the time to learn the basics of building custom shops in Ubercart.
You may never have the need to localize an application you build, but you cannot have too much know-how. Localization is a fairly straightforward concept and you should get into the habit of building your apps and websites with localization in mind from the beginning. Retrofitting a website for localization can be a huge challenge if it is even possible. Making your web app available in more languages means more users and more customers. It is never a bad investment to appeal to a larger audience.
Basic Knowledge of SEO principles
There is no need for most web developers to be experts in SEO (Search Engine Optimization). However, because how you code a website or app can affect SEO, you should understand the basics so you can avoid potential pitfalls that can hurt your site’s search rank.
A language framework should never be a replacement for real expertise in a language. However, once you understand the fundamentals of a language – in this case PHP – using an application development framework has many benefits. Frameworks can speed up development by providing pre-rolled solutions to many problems, encouraging consistent coding standards, and the ability to use off-the-shelf code to plug-and-play rather than always building from scratch.
Symfony and/or Laravel
There are several well-known PHP frameworks and the popularity of each seems to go through trends. CakePHP and CodeIgniter were “all the rage” several years ago but Laravel and Symfony seem to be the frameworks-of-choice for developers now. Most frameworks work very similarly and you should choose the tool that best suits your needs and your preferences. However, you should keep in mind that someone else is likely to inherit your code so you should give some thought to the long-term maintenance of the code, the stability of the framework, and what is best for your client.
Object Relationship Managers
You should be proficient in writing optimized, raw SQL queries. However, there are few things uglier than having SQL queries hard-coded into PHP code. There are, no doubt, instances where using raw SQL is the right solution, but in most cases, especially with simple queries, using an ORM (Objection Relationship Manager) like Laravel’s Elquoent, can keep your code neat and tidy as well as provide an easy, efficient interface to the model layer of your web app. Most ORMs will work the same so once you know how to use one, adapting to new ones, even in a different language, is fairly easy.
The majority of websites are built on some flavor of CMS (Content Management System). There are dozens of CMS on the market ranging from lightweight and free – https://github.com/iconifyit/SkyBlue-CMS to enterprise-level systems that manage not only the content but also digital assets and marketing such as Adobe Experience Manager, Sharepoint, and Oracle WebCenter Content. The prices range from free to millions of dollars per year.
Drupal & WordPress
Drupal started as a niche product for geeks but has skyrocketed in popularity ever since the Obama Campaign used the system for its website, then eventually for WhiteHouse.gov. The United States federal government has grown particularly fond of the system and there are several great Drupal design and development shops in the Norther Virginia and Washington, DC area. When it comes to PHP-based CMS, the two clear leaders are Drupal and WordPress. This article is not going to get into the age-old and un-winnable argument about which is better. It is a good idea to has at least a working knowledge of both systems, if not expertise.
Search is an important component of any web site of scale. The two major search engines commonly used on PHP-based sites are Apache Solr and ElasticSearch. Both products are open source and have available add-ons (modules and plugins respectively) for Drupal and WordPress. There are also hosted solutions for ElasticSearch and Solr so you don’t need to maintain your own ElasticSearch infrastructure.
If you are not actively creating documentation while your projects are underway, you are doing it wrong. I have seen documentation treated as a deliverable and created in parallel with the build work. With some kinds of documentation, this is perfectly acceptable. But documentation, for the most part, is not a deliverable, it is a living tool that is meant to help facilitate understanding and communication on a development project. There is a natural order to what documentation gets created when, by whom, and what it contains. Admittedly, the concept of documentation is very broad and each team will need to decide what kinds of documentation are needed for a project. A tech lead and/or Sr. Developer should know the different kinds of documentation and artifacts, their purpose, and how to create and use them to improve the development process.
The above list is not exhaustive, nor could it possibly ever be. What I have tried to outline is the core knowledge that a senior level web developer or technical lead should possess. It is not necessary to be an expert in every technology listed above but the a developer who wishes to be considered senior level, and certainly anyone working as a technical lead, leading development projects, should be able to talk competently about each area, implement each of the technologies with a reasonable level of effort, demonstrate the ability to provide custom development, and to troubleshoot problems in each area.
What other skills do you think are necessary for the senior level web developer and/or technical lead? What skills would you add to or remove from the list? Let me know what you think in the comments below and please share on social media.
I am available for consulting work in the skills in this article. I am a senior level developer with 17 years of overall web development experience, 7 years of enterprise IT consulting experience with a focus on content management. I have built hundreds of web sites, both large and small, using all of the technologies in this article. You can reach me via the contact form on this site or Twitter/@iconifyit.