Best Bits 2020 ...
Oh hey there! š
Hereās a byte-size round up of projects Iāve Open-sourced, posts and articles Iāve written and contracts Iāve completed so far this year.
1. Hacker News Front Page and moreā¦
I recently wrote this blog post: Use Netlify Functions and the Twitter API v2 as a CMS for your Gatsby blog which at the time didnāt think would be of much interest to anyone. I was just curious to explore Netlify Functions and wanted to solve a small problem I was having with my digital footprint. However, just for kicks I thought iād try and promote this post. Iāve never posted on Hacker News before but a few hours after I posted a friend messaged me to say my post had made the front page. Not bad for a first timer!
Thenā¦ a couple of days later this happened
2. Successful Open-source
Following on from a pretty successful start with gatsby-mdx-embed the move to the mono repo setup has now really paid off. MDX Embed can be used in so many ways that tying it to just Gatsby does kind of sell it short of itās full potential.
One such addition to the package restructure is the Storybook addon and iām pleased to say MDX Embed now features in the Storybook addons catalog page
ā¦ and hereās a few other posts iāve written that have ben published around the interwebs
3. First GitHub sponsor!
Iāve been slogging away with Open-source for a while and itās taken around 10 Open-source projects for one of them to catch on.
MDX Embed really is my jewel in the crown and as of 19-12-200 iāve picked up my first official GitHub sponsor. Probably not quite ready to go Yacht shopping but itās good know that my work is becoming recognized, appreciated and now finally remuneratedš
4. SSR and Jamstack for the win!
Gatsby recently announced incremental builds
and mono repo support so to put Gatsby Cloud through itās paces I created a multi-site, multi-brand mono repo + Shopify
demo application and accompanying article for Gatsby. The demo application uses gatsby-source-shopify to source
Shopify data at build time and lets Gatsby Cloud handle the re-build via a Webhook. It is as youād imagine still blazing
fast ā”
5. Add Playful Animated SVG Reactions to a Gatsby Blog
I recently Open-sourced react-svg-bubble-slider to provide a fun way to add reactions to Gatsby blog posts. It was one of the most difficult UI components Iāve ever created! A lot of effort went into making it fully keyboard accessible and joy of joys Jason Lengstorf at Netlify helped promote it by publishing an article I wrote on the Netlify blog š
6. A Zero Component Theme for Developers
I released gatsby-theme-terminal in early 2020, it was my second experiment with Gatsby themes and attempts to provide a fully theme-able component libraryā¦ which zero components. Yeah, I know, get your head around that one! I feel this is an advanced approach to building themes and interest in the project has been steadily growing and itās recently exceed 200 stars on GitHub š
7. Full Stack Gatsby App
I hear a lot of things about Gatsby being a tool to build blogs but it can also create full stack React applications. As a fan of Theme UI and being aware the barrier to entry can be quite high if youāre coming for CSS š¤¢ I deiced to create Skin UI, a CSS-in-Js Theme UI editor which allows you to create, edit, save and share themes all from the browser! š„ I donāt claim to be a designer but Iām rather proud of this one!
8. First commercial Gatsby build
I have to be honest, I did struggle to blog every day for 100 days during the 100 Days Of Gatsby 100 Days Of Gatsby challenge but my constant Tweets and posts did catch the attention of the lead developer at Manscaped who got in touch and I was hired to help re-build manscaped.com (new site not live yet). It was great to finally use Gatsby and Theme UI in a commercial project and while the world was on lockdown I was crafting beautiful UIās to increase sales of products to help men groom their testicles š²
9. First article officially published
As mentioned above I blogged every day for 100 days, thatās over 27ā000 words for the 100 Days Of Gatsby challenge and it was really brills to receive recognition by the Gatsby team who reached out and asked me to write up a āround upā article !
10. Published on CSS-Tricks
After the highs of writing for Gatsby I took on a second article, this time for Fauna. It was supposed to be a simple post about using GraphQL and Netlify functions but turned in to something much more complex. To demonstrate how it works I created a full stack demo application
to accompany the post with user authentication, a moderation queue and commenting system. Fauna liked it so much they used their sponsored account to post it on CSS-Tricks šŗ
11. Part of the CLI
As a Gatsby enthusiast as soon as Recipes launched I got stuck in and as much as I love Storybook and use it in all my personal and commercial projects (how else would you develop weapons grade UIās š¤·āāļø) it is a bit tricky to configure with Gatsby.
Iāve open-sourced two Recipes to solve the problems youāll face when using Storybook with JavaScript and TypeScript and both have made it in to the official Gatsby CLI šÆ. I also created another article for Gatsby discussing what Recipes are, how you can write your own and some musings I had about future workflows.