My current tech in 2020
18 March, 2020
As with any job it’s important to keep up to date with the latest technology and trends, but with software development — front-end development in particular — things change at such an alarming speed that many tech trends become obsolete before people even get a chance to explore them.
While the tools and tech I’m using today aren’t vastly different than this time last year, I figured I’d create this snapshot of what I’m currently using.
For over 4 years now I’ve been using Visual Studio Code as my primary code editor. If you haven’t tried VS Code yet you really need to. It’s free, lightning fast, highly customisable and supports virtually all programming languages you can throw at it.
If there’s something you feel is missing from VS Code out-of-the-box, there’s probably an extension for it on the VS Code Marketplace. I talked about some of my favourite VS Code extensions over on Inspect — my podcast about Design + Development.
Languages and Frameworks
I don’t explicitly write large amounts HTML these days as the markup for the projects I work on are usually coming from somewhere in the back-end or from a CMS.
In my day job at ecx.io we use a mixture of Adobe Experience Manager (AEM), SAP Hybris and Sitecore on the back-end and I sit within the AEM team so most of the markup I write is in HTL (no that’s not a typo). HTML Template Language (also known as ‘Sightly’) is Adobe Experience Manager’s preferred and recommended server-side template system for HTML.
HTL makes use of
data attributes to add logic into HTML templates, similar to how Angular uses the
ng- attribute. For example, a simple unordered list in HTL could look like this.
When I’m working on smaller projects or brochure websites, I tend to reach for a static site generator such as Jekyll. It’s great for creating simple websites which don’t require a full back-end but could still benefit from some server-side logic.
My own website was built in Jekyll for several years until I recently switched over to Gatsby — another static site generator built on React.
When adding CSS to a website, I pretty much always reach for Sass and use either gulp or webpack to compile it. AEM uses Less out-of-the-box but there’s a plugin for switching over to Sass too.
Over the past year I’ve been learning React. We’re starting to adopt React in a few projects at ecx.io and I recently converted my own website from Jekyll to Gatsby, which is built on React and GraphQL.
I’m using Netlify for all of my personal hosting. It’s totally free for most projects and you can get a site hosted on a custom domain within a matter of minutes. It’s a brilliant service which I encourage everyone to try out.
About a year ago I ditched Photoshop as my primary design tool and switched over to Sketch. I’d say it took at least 6 months for me to break the old muscle memory I had from using Photoshop for over 10 years but I’m glad I made the switch. For UI design (which is primarily what I do these days), Sketch is the right tool for the job.
For raster graphics and photo editing I occasionally use Affinity Photo which is a serious contender for Photoshop for a fraction of the price. It’s similar enough to feel familiar but also different enough that it takes a while to transfer your skills over.
Other tools and hardware
You can also check out some of the hardware and software I use on a regular basis.
I really enjoyed documenting the current state of the tech that I use and I’ll definitely be making this an annual review.
I’d love to know what you’re using in 2020.