Hey, I'm Michael

Published new post

Dec 15, 2022

How to add a PR template to your GitHub repo

How to pre-fill the blank description with helpful prompts.

Published new post

Nov 10, 2022

How to dramatically reduce video file size using ffmpeg

How to shrink a video so it’s small enough to upload.

Published new post

Sep 1, 2022

The translateZ trick

How to smoothly animate CSS filters in Safari by engaging the GPU.

Joined Recursion

June 20, 2022

I'm pumped to join Recursion — a biotech company that uses machine learning to identify promising new drugs. My job is to build the software their scientists use to identify which compounds are worth investigating further. Pretty. Damn. Cool.

Promoted to Senior Software Engineer

June 17, 2021

After nearly two happy years on the ".com" team at ecobee, I'm moving into a more senior role.

Published new post

May 31, 2021

How ecobee Uses Slack to Report Data Entry Errors to Content Editors

How the 'dotcom' team at ecobee uses Slack as a CMS alert system.

Published my bookmarks

January 28, 2021

I want to try taking notes in public this year to see if the articles, podcasts and videos I consume are helpful to other coders too.

Launched redesigned michaeluloth.com

January 25, 2021

Finally! After years of bright-white versions of this site built with Gatsby.js, I had fun creating a new dark concept with Next.js and Tailwind.css.

Published new post

June 1, 2020

The filter(Boolean) trick

How to remove empty values from an array.

Launched ecobee cart

February 26, 2020

I helped bring a new shopping experience to ecobee.com by leading the development of a new cart that includes optimistic UI and reliable logic powered by XState.js and Shopify's Storefront API.

Joined ecobee, Inc.

August 15, 2019

I joined the ".com" team as a Web Developer helping a group of fabulous humans migrate a legacy WordPress codebase to Gatsby.js.

Launched coffeeshopcreative.ca

August 7, 2019

I collaborated with designer Stephen Bell of Coffeeshop Creative to rebuild the marketing site for his Toronto web design and videography studio.

Published new post for Gatsby blog

June 19, 2019

I researched and ghostwrote a case study for the Gatsby blog called "How The Couch Builds Websites in Half the Time with Gatsby".

Launched lesleybarber.com

June 7, 2019

I designed and built a portfolio site with a custom audio player and sparse aesthetic for Canadian film composer Lesley Barber.

Published new video

June 3, 2019

Using GraphQL with Gatsby

How to write GraphQL queries in a Gatsby project.

Published new video

May 27, 2019

Adding Content to a Gatsby Project

The pros and cons of different approaches.

Launched alisonmoritz.com

May 8, 2019

I worked with designer Stephen Bell of Coffeeshop Creative to create an portfolio site for American stage director Alison Moritz.

Launched alainaviau.com

April 9, 2019

I worked with designer Stephen Bell of Coffeeshop Creative to create a colourful portfolio site for a Canadian opera director Alaina Viau.

Thank you for the wonderful platform and for making my work look so great!!
— Alaina Viau

Contracted as a technical writer by Gatsby, Inc.

March 22, 2019

I was excited to be invited by Gatsby's head of marketing to help research and author two technical blog posts and an ecommerce ebook.

Published new video

March 17, 2019

Writing CSS-in-JS in a Gatsby Project

How CSS-in-JS libraries like CSS Modules and Styled Components make it easier to safely add and remove styles.

Published new video

March 11, 2019

Writing CSS in a Gatsby Project

How to write traditional CSS in a Gatsby project.

Published new video

March 3, 2019

Wrapping Pages in a Layout Component

How to share common content and styling between pages.

Published new video

February 20, 2019

Adding Pages to a Gatsby Project

How to add pages to a Gatsby project and navigate between them.

Published new video

February 15, 2019

Writing HTML in a Gatsby Project

How to use React to split HTML into reusable components.

Launched stevehaid.com

February 13, 2019

I worked with designer Stephen Bell of Coffeeshop Creative to create an engaging marketing site for Toronto-based real estate agent Steve Haid.

Published new video

January 31, 2019

Gatsby's Default Files and Folders

What's going on inside each folder in a Gatsby project.

Published new video

January 24, 2019

Starting a New Gatsby Project

How to start a Gatsby project on your computer.

Published new video

January 17, 2019

What is Gatsby?

How Gatsby combines the best features of React and HTML.

Launched ashleythouret.com

December 10, 2018

I worked with designer Stephen Bell of Coffeeshop Creative to create a luxurious portfolio site for Canadian opera singer Ashley Thouret.

THANK YOU @coffeescreative for the beautiful website redesign!!!
— @AshleyThouret

Launched azoorsociety.org

December 7, 2018

I worked with designer Stephen Bell of Coffeeshop Creative to create an informational site for a UK-based charity.

Published new post

November 30, 2018

Introducing Gatsby Tutorials

A new, community-updated directory of Gatsby.js learning resources.

Launched homecarequotes.ca

November 26, 2018

I paired with designer Stephen Bell of Coffeeshop Creative to create a directory of Toronto home care agencies that uses geolocation to sort results by distance from the user's postal code.

Launched peterbarrett.ca

November 15, 2018

I worked with designer Stephen Bell of Coffeeshop Creative to create a clean portfolio site for Canadian opera singer Peter Barrett.

Launched gatsbytutorials.com

November 10, 2018

As a fun side project, I built an open-source directory of the Gatsby.js learning resources I'd bookmarked over the years and invited the community to help me keep it up to date.

This is genius!
— @ajmalafif

Wow, how have I never seen this?
— @micahbrich

Published new post

October 20, 2018

How to Set Up a Mac for Web Development

What to install on your Mac before starting a JavaScript project.

Launched kingsvalleypaving.com

October 5, 2018

I worked with designer Stephen Bell of Coffeeshop Creative to create a construction-themed marketing site for Toronto paving company Kings Valley Paving.

Excited to launch our redesigned website! Big thanks to @coffeescreative for the great new design.
— @KingsPaving

Launched shawnalucey.com

August 20, 2018

I worked with designer Stephen Bell of Coffeeshop Creative to create a playful portfolio site for American opera director Shawna Lucey.

My new website has LANDED!!! So excited! Thanks @coffeescreative for being so boss!!!!
— @shawna_lucey

Launched lauraalbino.com

August 17, 2018

I designed and built a one-page portfolio site for Canadian opera singer Laura Albino.

(The site is no longer live, so the following link leads to a preview of the original.)

Launched jpatrickraftery.com

July 19, 2018

I designed and built portfolio site with a minimal aesthetic for American opera singer and voice teacher J. Patrick Raftery.

Thanks so much to Michael Uloth for his fantastic design and advice.
— J. Patrick Raftery

Launched danielcabena.com

July 10, 2018

I worked with designer Stephen Bell of Coffeeshop Creative to create a minimal portfolio site for Canadian countertenor Daniel Cabena.

I’m thrilled to announce the launch today of my new website... Thanks to the brilliant team at Coffeeshop Creative for their careful attention and beautiful design.
— Daniel Cabena

Received One Page Love design award

May 18, 2018

The 2018 version of this website (guess how many pages it had...) was chosen by One Page Love as one of its inspirational sites of the day.

Launched ariaumezawa.com

May 10, 2018

I worked with designer Stephen Bell of Coffeeshop Creative to create a zany portfolio site for Canadian opera director Aria Umezawa.

Today’s the day we launch my new website, thanks to the amazing @coffeescreative. The whole team was an absolute dream to work with, and came with such creative ideas. I couldn’t be more pleased.
— @umezawaria

Finally time to unveil my new website designed by Coffeeshop Creative. They created this amazing minimalist design with bright colours and geometric shapes. Thrilled with the end result, and had a blast working with them.
— Aria Umezawa

Launched pomegranateopera.ca

April 30, 2018

I worked with designer Stephen Bell of Coffeeshop Creative to create a splashy marketing site for a new Canadian opera.

Our fantastic website was made by the team at @coffeescreative right here in Toronto! Designers and developers who are also #operasingers! Thanks @Sbelltenor @ooloth @teiyakasahara.
— @pomopera

(The site is no longer live, so the following link leads to a preview of the original.)

Launched artistcenter.com

March 12, 2018

I worked with designer Stephen Bell of Coffeeshop Creative to create a one-page marketing site for a classical music industry social networking app.

(The site is no longer live, so the following link leads to a preview of the original.)

Launched adriannepieczonka.com

December 19, 2017

I was thrilled to have the chance to design and build a tasteful portfolio site for internationally-celebrated Canadian opera singer Adrianne Pieczonka.

Launched adamluthertenor.com

October 2, 2017

I designed and built a one-page portfolio site for Canadian opera singer Adam Luther.

Launched dgvolo.com

August 15, 2017

I worked with designer Stephen Bell of Coffeeshop Creative to create a assertive marketing site for Toronto advisory firm DG Volo & Company.

Launched ileanamontalbetti.com

February 21, 2017

I designed and built a one-page portfolio site for Canadian opera singer Ileana Montalbetti.

(The site is no longer live, so the following link leads to a preview of the original.)

Joined Coffeeshop Creative

January 15, 2017

I enjoyed leading development at this small agency for two-and-a-half years and building and deploying 25+ new website projects.

I'm forever indebted to Stephen Bell for throwing so much work my way and letting me experiment and learn so many new skills while I completed it.

Launched egofilmarts.com

July 15, 2015

After a decade of learning web development as a hobby, I was thrilled when my first paid project was to design and build a new portfolio site for Canadian film and stage director Atom Egoyan.