Getting the heck out of React
React has limitations when it comes to working with persistent stateful media objects. In this article I discuss techniques for working with media elements like canvas, video and third-party libraries in React.
Difference between currentColor & Custom Properties
There are some interesting differences between how currentColor and custom properties work. Both are examples of dynamic properties in CSS but how they are resolved differs in some very important ways. I recently came across an example of this that had me scratching my head for a while.
Custom properties collection
A collection of examples using custom properties for theming and responsive design.
A Strategy Guide To CSS Custom Properties
Custom properties provide opportunities for new creative ideas, but also the potential to add complexity to CSS. To get the most out of them, we might need a strategy for how we write and structure CSS with custom properties.
In March 2018 I spoke about CSS custom properties at .concat(), a fantastic community run conference in Austria.
CSS custom properties reading list
- Using CSS variables correctly
- Unlocking the Benefits of CSS Variables
- The CSS attr() function got nothin’ on custom properties
- It's Time To Start Using CSS Custom Properties
- Locally Scoped CSS Variables: What, How, and Why
- Bridging CSS and JS with Custom Properties
- Control CSS loading with custom properties
- CSS Custom Properties and Theming
CSS Grid reading list
Smashing Conf Freiburg
A talk I gave at Smashing Conference in Freiburg 2017 about the changing role of media queries and alternative techniques for responsive design.
Using CSS variables correctly
Custom Properties have the potential to change how we write and think about CSS.
Smashing Conf San Francisco
A talk I gave at Smashing Conference in San Francisco 2018 about the changing role of media queries and alternative techniques for responsive design.
Fluid typography collection
A collection of examples for using fluid responsive typography on the web.
Non-linear interpolation in CSS
A solution for transitioning lengths values in CSS through more than one 'bending point'.
The invisible parts of CSS
Explains the box model, cascade, formatting contexts, positioning, stacking and a lot more about how CSS works. A right of passage, I had to write my version.
My best of 2017 reading list
- An Abridged Cartoon Introduction To WebAssembly
- World Wide Web, Not Wealthy Western Web
- Migrating from Jekyll+Github Pages to Hugo+Netlify
- Designing Tables to be Read, Not Looked At
- Yes, That Web Project Should Be a PWA
- The Critical Request
- Most Hearted Pens of 2017
- A Unified Styling Language
- Building a Visual Language
Interpolation in CSS without animation
Ideas for a more general purpose interpolation function in CSS.
On maths and coding
A more personal article on being a developer and having an average mathematical ability.
SVG has more potential
A bunch of interesting techniques for using SVG to make unique responsive components.
More about me
Oh, hey! You’re still here, good for you! You should know I’m passionate about web development and that doesn’t just mean standards; I’m an advocate for anything and anyone that contributes to good quality web development.
I’ve worked as a front-end developer on some of Australia’s largest websites as well as some of the smallest community sites. When I’m not building sites or blogging I like to experiment with code. I love learning new things and finding techniques that challenge what we think is best practice. Although very few ideas make it into my production toolkit, I find experimentation is the best way learn and the only way to discover new techniques.
I try to share everything I learn, I speak, I blog and sometimes help organise community events & meetups.
I’m available for hire! Why don’t you get in touch?