I thought I’d write a little blog post to explain a bit about my workflow and some of the tools I use to build websites.
Brackets
Brackets, offered by Adobe, is my code editor of choice. It’s a fantastic, lightweight open source code editor that understands and facilitates modern web design, with helpful visual tools to guide you, turning coding from an arduous chore into a fun, exciting and highly productive task.
Brackets
Even better though, is the extensions you can add on to Brackets to get even more focused support and functionality, such as themes, Beautify, Git and code folding and code hints. Extensions are easy to manage and update in an easily navigable user interface where you can add and remove extensions as best suits your project needs.
Support wise, Brackets can be run on Windows, Mac and Linux; it’s open source, hosted on github and built in CSS, HTML and JavaScript, so it is easily accessed, customised and contributed to.
Folders allow for an extremely intuitive workflow, increasing productivity by removing the irritating need to browse for and open multiple files in the explorer, instead providing immediate access to an entire folder via sidebar links – just as it should be! Live Preview is another feature that has productivity and rapid working in mind, as it shows your changes live in the browser as you make them, no need to reload.
My top Brackets extensions
Brackets Css Color Preview
Brackets File Tabs
Brackets Git
Brackets Icons
Brackets Snippets (by edc) – A real time saver.
Code Folding
Whitespace Normalizer
Brackets WordPress Hint
Monokai Dark Soda
ServerPress
ServerPress is a local web server, used for development purposes, rather than hosting the page on the internet; this is great because it allows me to build websites locally on my laptop or PC, giving me additional freedom and flexibility.
ServerPress
The key advantage of ServerPress though is that it prevents ‘cowboy coding’, which means downloading a file from the server via FTP, opening it in Brackets, making changes, then FTP’ing it back to the server and checking the changes. With ServerPress I can open the file locally, make changes in Brackets, cntrl+S, then check the changes – much quicker. ServerPress basically bypasses the need for FTP, saving huge amounts of time, particularly when I’m on the go or out of the office, where you can’t rely on your usual WiFi speeds – coffee shops, I’m looking at you! – a real life saver, especially for us freelancers.
A local environment is essential for WordPress development, as it gives you the privacy, and thus the confidence, to make mistakes and correct them without the whole world watching. Removing the fear of errors and their impact on the user experience means you can experiment and take risks, essential to any creative endeavour, which web design absolutely is, and should be. It will also speed up your process, as you won’t waste time painstakingly thinking through every edit; just try it, if it doesn’t work, move on to something else – simple! All this means you have the capacity to build exciting sites that will delight the user and client alike, and to build them quickly, learning as you go.
Web hosting with Git
This one is a no-brainer. Git is an open source distributed version control system, and is essential for modern web development; your host, shared or not, should offer Git preinstalled, and it’s a standard feature in even the most low-end hosting packages. Git can be integrated into Brackets using the Brackets-Git extension.
And one extra thing…
Music! When I really want, or need, to get in the ‘zone’, I find nothing gets me more motivated to get things done than plugging in my headphones and playing some of my favourite music. Currently I’m listening to liquid drum and bass and progressive house, which is great background music to relax me while I’m working and always ensures that the working day passes with pleasure!
All of the above are great tools and methods for cutting down on the time required to code and develop a website, increasing your productivity and, ultimately, your profitability and creativity, as you spend less of your day on time consuming tasks, meaning more time for the fun stuff, and for more projects!