My front end development setup is an evolving organism, which changes, grows, evolves as time goes by based on what’s going on in modern web development. When I first started designing and building websites, I worked on a Windows machine hand coding my HTML and inline styling on plain old Notepad. This eventually changed to (still) hand coding HTML with externalised CSS, but using Notepad++ on a Windows machine (I wasn’t very sold on the Apple OSX user experience still at the time), which I loved using for the plugins that powered up what would otherwise be just another Notepad software.
These days, I have so far worked on a Windows PC at work but outside of the office I’m much happier using my MacBook Pro laptop. And I’m fine with this arrangement. Since it means I still have to be familiar with the quirks of both the Mac and PC worlds beyond just the browser differences between IE and Safari and all the other browsers out there in the wild.
But with that in mind, here’s a run down of tools (that aren’t browsers) that I use for my front end development workflow – most of which are available on both Macs and PCs…
- Sublime Text
- LiveReload
- BrowserStack
- Version Control: Git
- GUI Client: SourceTree
- Diff Tool: kdiff3
- Design (rasters): Photoshop
- Design (vectors): Sketch (Mac only)