In the lead up to buying my first house, I’ve been watching a lot of Ask This Old House to fill in the gaps in my home maintenance education. One of my favorite segments on the show is when one of the professionals will list out their “must have” tools for anyone looking to tackle home repair. The plumber shows off his wrenches and teflon tape, the electrician his multimeter and wire strippers, and the landscaper his rakes and shovels. Like these tradesmen, a web developer has a unique set of tools that they use to get the job done. Unlike these tradesmen, however, people don’t really get to see us use those tools. You can watch the electrician wire up a new outlet with a screwdriver, but you don’t really get to watch the developer type the code into PHPStorm to create your website. So to change things up a little bit, I’m going to be going over the tools used to code websites.
For those old enough to remember, back in the earlier days of computers, everything was done via a command prompt (or terminal). There was no graphical user interface (GUI) for anything, just commands and crude textual output. Now a days, computers offer both a GUI and a way to send commands directly. Odds are that your operating system is Windows (probably Windows 8 or 10), and within that operating system is a program called cmd. It allows you to send commands quickly and directly to the computer. The average user will probably never need to use cmd or anything else like it, but for developers, it’s one of the first tools in our toolkit. Being able to quickly maneuver between directories, list out their contents, create/edit/delete files is incredibly useful. It seems counter productive, but with enough practice one can become much faster at using the command prompt than they are at performing the same tasks with a mouse. Additionally, there are several other tools in the web developer’s toolkit that don’t have GUIs and require you to type commands directly.
There’s a running joke in the office that all I require to do my job is Notepad and Internet Explorer (IE). And there actually is some truth to that! When I first began learning how to code, I wrote it in Notepad and tested it in IE. Fortunately things have progressed greatly since then and now I depend on several different web browsers for testing and two pieces of software for code writing. The first is a basic text editor. I’ve tried several over the years, but my favorite has to be SublimeText. It allows me to quickly write code and offers support for features such as auto-complete and emmet, which allows me to type code in shorthand (so typing “mt” followed by pressing tab will yield “margin-top”, or “ul>li*3>a” followed by a tab would yield a 3 item long list of links).
There are several ways to push code to a server, but one of the oldest and most used is the File Transfer Protocol (better known as FTP). Using a program like Filezilla or WinSCP, I can connect to a website’s server and begin uploading the website’s files. A good FTP client will also allow me to delete or move files on a remote server as needed. FTP can also serve as a quick way to backup or restore a site’s files.
Version control is a relatively new addition to the web developer’s toolkit. To explain it as simple as possible, version control (usually in the form of a technology called git) allows a developer to jump back/forth between versions of a file with relative ease. For example, say I built a website with a blue background. I show it to the client and they want to see it with a red background. Upon seeing all of that red, they realize they’d rather have it be blue after all. With version control I can quickly and easily revert the file back to its original, blue form without ever having to touch code.
Of course this is just a short list of the most common tools used by web developers. New technologies and approaches are developed so rapidly that it can be difficult to keep up at times. And each technology or idea comes in multiple iterations. I love SublimeText, but others may prefer Atom. Most web developers use git for version control, but others may use SVN. There’s no shortage of choice of tools in web development. The joke, “If you don’t like the weather in Maryland, wait 5 minutes” is also applicable to web development. If you don’t like the tools available to you, just wait 5 minutes for new ones!Tagged: atom, Chrome, CSS, Edge, Firefox, FTP, Git, HTML, IDE, IE, JS, php, phpstorm, SublimeText, SVN, VC, Web Development