@MaximeHeckel

Learning in public

April 21, 2020 / 7 min read

Last Updated: January 2, 2021

As software engineers, we're in a constant state of learning and actualizing our knowledge and skillsets. This is part of the job, and it's a vital one as it helps to keep ourselves relevant in an ever-changing industry. The amount of knowledge I've accumulated over the years gives me sometimes little vertigo, but that's nothing compared to what lies ahead of me and what remains to be learned.

I've felt very inspired by @swyx's concept of learning in public. His blog post "Learn In Public: The fastest way to learn" deep dives into the idea of sharing as much as possible what we're working on, what we learn, to become more than just lurker or content consumer and "to have a habit of creating learning exhaust".

I've been producing content for the past 2 years now on this blog, sharing some bits of knowledge here and there, but I want to scale that a bit more.

"open-source knowledge can scale just like open-source code" — @swyx

This blog post aims to be an updated list of what I've learned, what I'm currently learning, my sources and perhaps even some personal blog posts. I'll divide it into multiple categories, with a checklist and I'll tackle these items at my own pace. Maybe some of these items will pique my interest for just a few days and then give up on them because my priorities have changed or because something more interesting came along the way. But rest assured that I'll do my best to keep this as up to date and focused as possible.

How I plan to share what I learn

I identified three different ways to share what I learn. I called them relaying content, mix and match content, new content. This is how I would define them:

  • ArrowAn icon representing an arrow
    relaying content: I read about something and write about this same subject with my own words. I'm not talking about copy-pasting here but rather about adding your touch to that subject. Otherwise I'll simply share my sources for a given subject.
  • ArrowAn icon representing an arrow
    mix and match content: when learning about a concept, I might get inspired to try to write my take on this concept in a different context or using a different programming language or paradigm. An example of mixing and matching content I found was all these reimplementations of existing React patterns with the new React hooks back in 2019.
  • ArrowAn icon representing an arrow
    new content: I built something new and want to share it, I found a solution to a problem only I had or I'm sharing my own experience on some very specific subject.

My list

Here's the list of what I'm currently focused on learning including what I've already learned in the last few months:

Serverless

  • ArrowAn icon representing an arrow
    Basic serverless concepts Done
  • ArrowAn icon representing an arrow
    Deploy cloud functions on AWS Lambda Done
  • ArrowAn icon representing an arrow
    Use the serverless framework Done
  • ArrowAn icon representing an arrow
    Deploy some cloud functions with an API gateway Done

For these so far I've maily focused on the Serverless Framework's Serverless for frontend developer's class as well as The Serverless Handbook from @Swizec. I only used the Serverless framework when learning, I prefered using Vercel which was, in my opinion, the easiest to use (I still have to checkout how to host serverless functions in Netlify, I'm pretty convinced the UX/DX is similar than on Vercel).

It took me a while to find a use case for a serverless function, but I ended up finding one: Generating screenshot from code snippets. I wrote about it here in this post.

  • ArrowAn icon representing an arrow
    Deploy a server-side rendered React site with the serverless framework
  • ArrowAn icon representing an arrow
    Serverless GraphQL

NextJs

I'm late to the party on this one 😅

  • ArrowAn icon representing an arrow
    Basic concepts: Introduction to Next.js 9 Done
  • ArrowAn icon representing an arrow
    Build a sample app that leverages server-side rendering
  • ArrowAn icon representing an arrow
    Dissect and try to understand all the concepts and mechanisms that SWR provides.
  • ArrowAn icon representing an arrow
    Server-side rendering vs static site generation vs client-side rendering Done

Automate all the things

I've been focusing on this one since beginning of February 2020:

  • ArrowAn icon representing an arrow
    Writing my own Github action Done
  • ArrowAn icon representing an arrow
    Automating releases Done
  • ArrowAn icon representing an arrow
    Automated CI/CD Done
  • ArrowAn icon representing an arrow
    Get started with Semantic Release Done
  • ArrowAn icon representing an arrow
    Writing my own Semantic Release plugin Done
  • ArrowAn icon representing an arrow
    Setting up a High-Velocity Development environment for my team Done
  • ArrowAn icon representing an arrow
    Building my own preview deployment service Done

I wrote The little guide to CI/CD for frontend developers that contains everything I've learned when it comes to testing, automation, better release processes, deployments and overall anything that makes a team work faster!


Authentication

  • ArrowAn icon representing an arrow
    Learn more about JWT Tokens
  • ArrowAn icon representing an arrow
    Implement my own authentication service and deploy it

Typescript

  • ArrowAn icon representing an arrow
    Extend the Typescript compiler (docs)

JAMStack

  • ArrowAn icon representing an arrow
    Gatsby Theme authoring Done

I've been maintaining my own Gatsby theme for several months now and I'll probably write about it at some point. In the meantime if you're curious you can take a look at my theme's Github repository.

  • ArrowAn icon representing an arrow
    Everything I've learned (the hard way) when dealing with SEO and Gatsby Done

I wrote SEO mistakes I've made and how I fixed them that highlights the biggest mistakes I've made with my blog when it comes to SEO and the solution I brought to this problem. This post got a lot of feedback and somehow got ranked number 1 on Hacker News (see related Twitter thread).


Framer

I've always loved beautiful transitions/animations and wanted to get into using the tool that Framer built for a while

  • ArrowAn icon representing an arrow
    Do more reading about how to build meaningful transition and animation
  • ArrowAn icon representing an arrow
    Convert some components from css transitions/animations to Framer Motion Done
  • ArrowAn icon representing an arrow
    Demistify spring animations Done

I dedicated an entire blog post for this one: The physics behind spring animations.

  • ArrowAn icon representing an arrow
    Use Framer Web and try to build something cool with it 🤘

Design System

  • ArrowAn icon representing an arrow
    What are the good practices to build a scalable and user friendly Design System, and Design System Component

For this item I also want to write about what I learned and the mistakes I've made putting together a Design System, and Design System Component Library at Docker.


SwiftUI

  • ArrowAn icon representing an arrow

    Getting started with SwiftUI development Done

  • ArrowAn icon representing an arrow

    Learn how to build beautiful apps (animation, custom SwiftUI views and components) In Progress I've never done native mobile development before but I've always been attracted to it. With the release of SwiftUI, I believe the timing is perfect to finally dive into iOS development again. My main two resources I'd recommend for anyone willing to learn are: designcode.io and Hacking With Swift. Both these courses are extremely helpful and teach you everything you know to build iOS and macOS app.

  • ArrowAn icon representing an arrow

    Comparing SwitftUI to React development Done

I wrote Going native: SwiftUI from the perspective of a React developer to analyze some of the common design patterns between SwiftUI and React. I also plan to write another article that will focus exclusively on state management patterns which also share quite a few things in common with React. I hope these post will help some React developers to feel more comfortable with SwiftUI.

  • ArrowAn icon representing an arrow
    Rebuilding an existing application

I think this will be the best way for me to cement all the knowledge acquired regarding SwiftUI development. I think I'll start with rebuilding the app Calmaria which I like a lot! It's simple and elegant and I believe that after a few SwiftUI classes I should be able to rebuild a very similar app.

  • ArrowAn icon representing an arrow
    Building my own iOS app from scratch In Progress

If you follow me on Twitter you'll be able to find some screen recordings a couple of times a week of my progress building my first app 🤘.

  • ArrowAn icon representing an arrow
    Building a cross platform iOS/iPadOS/macOS app

Other learning in public inspirations:

Liked this article? Share it with a friend on Twitter or support me to take on more ambitious projects to write about. Have a question, feedback or simply wish to contact me privately? Shoot me a DM and I'll do my best to get back to you.

Have a wonderful day.

– Maxime

Here's an up to date list of what I'm currently learning and what I plan to learn.