The things I add to the Internet
By this point the set up for WL was becoming quite a headache, not exactly an inviting prospect to attract new developers with. Also deployment was a nightmare. Now we're on docker - two birds with one stone! The article digs into the technical story of setting it up. Note that WL has evolved so the current set up is different, but this should still be helpful for those wishing to learn.
.htaccess: a FED guide to redirects
This dive into apache came about to try and help alleviate a bottleneck in our pipeline at work. Server configuration is not exactly the most popular subject in the office.
Redux: attempting a simple overview
This was part of my pitch to use some kind of state management for a complex product listing front end. The idea was turned down which at least gave me the experience of building complex state without a tool like Redux, I would be curious to know how much time we could have saved had we used it!
SVG 101: Setting Up
Optimizing, embedding, and a dive into SVG's viewport / viewbox. Note that the date on the site is just a reflection of when this was published, it sat in the company 'todo' folder for a couple of years. Even made it through an acquisition and onto the new company's blog! Fancy that!
Sass (part 2): tips and Tricks
Essentially a miscellaneous bucket for small sass tips, from those we use at work to those that were found while writing the previous article.
CSS in 3D
A fun jaunt into the 3d world. Probably written in the hope that it might inspire some of our projects to take advantage of the more interesting capabilities of css.
Sass (part 1): Architecture
At work all our sass was organized the same way. This was my exploration of other strategies. Note the age of this article, things have evolved since then.
Google Analytics for Front End Developers
We are frequently asked to paste in that snippet of ga js, and occasionally other bits to go with it. I wanted to dig deeper into how it all worked. The title says 'for feds' but it's just another way of saying 'a bit technical'.
A technical introduction to service workers. Although on the public company blog I really wrote it with the rest of the team in mind in the hope that service workers would start to play a bigger part in our projects.
Chrome Dev tools
I read through the docs, noted the important parts, condensed it, and put it down in writing. Note that the chrome dev tools team have been quite prolific - they have added a lot more since I wrote this!
Git Commands cheat sheet
A quick run through of git for those who already have a little experience (while writing this I only had a little experience with git, this was my way of digging into it. This was also during the time that Delphic started switching over from SVN
The things I pull from the Internet, and my opinions
Static site generator with a collection of front end build tools built in (and server if you want it). This site is built with Harp! All that's missing from my static site knowledge is a good admin technology for non tech users. Once that's figured out there are going to be some phenomenal speed gains around this internet.
I'm on a constant campaign to get everyone I work with onto Docker, don't throw away time by making people manually set up complex projects - Dockerize it! Although caveat, I've found front end build tools are more easily managed on your host system, especially when you're the one setting those build systems up.
SSL (HTTPS) certs aren't hard and they don't cost money (unless you want a fancy one) - so there's no excuse, HTTPS all your sites!
If you are creating content for a website, kill your wordprecessor, they do unspeakable things to the formatting of your words. Learn markdown (it's really simple), find a Markdown editor that clicks for you, and use it. Your writing will be more consistent and, very important this part, it translates directly to html - perfect!
Another work campaign I'm on - every front end development project should install with `npm install`, start the build tools & watchers with `npm start`, and compile a production build with `npm run build`. It's completely up to you to choose which build tools are run. I'm not saying drop them and just use npm scripts, I'm saying run them with the one thing that is common to every project. Be consistent!
There are projects out there that still have a code style guide in document form - hilarious no?
Because linting is always a good thing.
In my experience accessibility is like code style in that they're both treated as 2nd class concerns far too often. Work this into your build tools and have it yell a11y concerns at you - it's really worth it!
I don't know why it seems so many developers are still against this. It's very good. Combine it with `table-layout: fixed;` and it's pretty much magic. So I'm adding it here in support. I like `display: table;`