Swizec's articles in the "livecoding" category
I aim to write mindblowing emails with real insight into the career and skills of a modern software engineer. "Raw and honest from the heart!" as one reader described them.
Below are 80 articles filed under livecoding
. Enjoy ❤️
Software Engineering Lessons from Production
Join Swizec's Newsletter and get insightful emails 💌 on mindsets, tactics, and technical skills for your career. Real lessons from building production software. No bullshit.
"Man, love your simple writing! Yours is the only newsletter I open and only blog that I give a fuck to read & scroll till the end. And wow always take away lessons with me. Inspiring! And very relatable. 👌"
Hacking the React AST for fun and profit – #CodeWithSwiz ep34
This is hold my beer level of hackery. It didn't work but we learned lots in the process.
June 29th, 2021
Use Netlify's _redirects on Gatsby Cloud
Something always goes wrong when you change hosting providers. 😅 For me it was redirects. A vital feature of any site migration.
June 23rd, 2021
A fun security bug with static rendering – CodeWithSwiz #31
The flash of unlocked content is great fun for any paywall
June 1st, 2021
Build privacy-focused blazing fast tweet embeds – CodeWithSwiz 30
Twitter embeds every tweet on your page as an iframe. Loads 1.2MB of JavaScript, makes 20+ HTTP requests and uses 100+ DOM nodes. 💩
May 12th, 2021
Twitter embeds without JavaScript, pt1 – #CodeWithSwiz 29
Continuing our quest for better Lighthouse scores, more reader privacy, and less JavaScript we attacked the next biggest culprit 👉 Twitter.
May 4th, 2021
Serverless file upload to S3 with NextJS and AWS Lambda – CodeWithSwiz 27
The Girl loves her daily cute photos, but she's bored of repeats. What if adding images was easier 🤔
April 20th, 2021
Reverse engineer a GraphQL API to automate love notes – CodeWithSwiz 24
We used a man-in-the-middle attack to snoop an app's API traffic, replayed it in a GraphQL client, and successfully put it inside an AWS Lambda 🤘
February 23rd, 2021
React Bricks - visual blocks editor for NextJS #CodeWithSwiz 22
Tried a new visual editor for NextJS and CreateReactApp. Got a site up in 20min 🤘
February 9th, 2021
[CodeWithSwiz 21] useAuth beta support for Firebase 🎉
It works! useAuth has beta-level support for Firebase Auth 🥳 I did not expect that to take 3 sessions.
January 26th, 2021
[CodeWithSwiz 20] Adding Firebase support to useAuth, pt2
Firebase continues to be 💩. No wonder people keep asking for support in useAuth. Almost there ✌️
January 19th, 2021
[CodeWithSwiz 19] Firebase Auth support in useAuth, pt1
Support for Firebase Auth is one of the most requested features for useAuth and I figured what the heck, how hard can it be?
January 12th, 2021
Gatsby to NextJS pt1, server-side-render or server-side-generate?
Gatsby and NextJS do similar things differently. One is better for websites, the other for webapps. In episode 17 of CodeWithSwiz we explore the biggest difference.
November 19th, 2020
React context without context, using XState – CodeWithSwiz 14, 15
useAuth works without React Context! 🎉 here's how
November 10th, 2020
Swap useReducer with XState – CodeWithSwiz 13
In Refactoring a useReducer to XState we talked about a 5 step process to turn a reducer into an XState state machine. Today answers "Ok now what?"
October 22nd, 2020
How to write tests for XState – CodeWithSwiz 12
Once you know how to refactor a useReducer to XState, you gotta prove you did it right.
October 13th, 2020
Refactoring a useReducer to XState, pt1 – CodeWithSwiz 11
XState promises to be like useReducer+Context combined and the simplest way to handle complex state in React apps. But can it deliver? On this episode of #CodeWithSwiz, we gave it a shot.
October 8th, 2020
Prefetch data with React Query and NextJS – CodeWithSwiz 8, 9
Prefetching lets you start React apps without loading spinners. Gatsby introduced this concept with `staticQuery`, react-query and NextJS make the pattern easier 😍
September 30th, 2020
Using JavaScript to commit to Github – CodeWithSwiz 7
Update code with a JavaScript function? Easier than you think 😍
September 17th, 2020
Why NextJS /api routes are fab – CodeWithSwiz 6
In this episode of CodeWithSwiz, we tried NextJS's support for /api routes – code running on the backend. In a word – Wow
September 13th, 2020
Exploring NextJS with a headless CMS, pt4 – CodeWithSwiz
NextJS getStaticProps, environment vars, and why you shouldn't use yarn link – all in this episode of #CodeWithSwiz
September 10th, 2020
Exploring NextJS with a custom CMS, pt3 – CodeWithSwiz
Friend, this episode of #CodeWithSwiz was a great example of why you want to start using TypeScript and how thermal load *destroys* computers.
September 8th, 2020
Building a small CMS with NextJS, pt2 – CodeWithSwiz
You're the computer, the CMS is your script. Starting small, trying NextJS, comparing microbundle vs. parcel for extracting libraries out of projects.
September 3rd, 2020
Your first NextJS app – CodeWithSwiz
On CodeWithSwiz ep2, we tried NextJS and built our first tiny app. Complete with a design system, static rendering, React Query to talk to AWS Lambda, and deployed to live 🤘
September 1st, 2020
CodeWithSwiz: Privacy-focused embeds for YouTube, Twitter, et al
A new old experiment 👉 regular livecoding. It's like a podcast with video, show notes, regular cadence, and we both learn something new.
August 27th, 2020
Experimenting with the new React Concurrent mode
November 6th, 2019
Just for fun 👉 React vs. jQuery vs. Svelte, same 🐱 app
I was bored Monday night and decided to see if I still know how to build with jQuery. Nothing better to do, no pressing ideas, a bit of fun. Also a favor for a friend who's preparing to talk about React to a bunch of people who've never seen it before 😛
May 24th, 2019
Finally, a practical use case for JavaScript generators!
JavaScript generators are amazing. They let you write infinite loops that terminate. Yield values from functions before they finish … and I bet you've never used a JavaScript generator even once did you? I FOUND A USE! A real world practical use-case where generators make your code better. 😱
April 17th, 2019
Trying the new ResizeObserver and IntersectionObserver APIs
April 3rd, 2019
React, D3, and hooks 👉special livecode tonight 9:30pm
February 6th, 2019
Tooltips and state across various d3 charts in a React dashboard!
January 28th, 2019
Online workshops are MORE interactive than in-person workshops
September 5th, 2018
Upgrading to Gatsby v2 with the help of the hivemind 👌
June 26th, 2018
Tiny React & D3 flamegraph tutorial
June 6th, 2018
Learning WebRTC peer-to-peer communication, part 1
May 7th, 2018
Using YouTube as a data source in Gatsbyjs
April 24th, 2018
Blockchain-redux becomes useful, part 1
April 3rd, 2018
Livecoding Recap: A new more versatile React pattern
March 27th, 2018
Build a Chrome extension from idea to launch in an afternoon
March 13th, 2018
Building an interactive DOM benchmark, preliminary results
February 27th, 2018
What I learned making my first open source React component
February 21st, 2018
Blockchain Redux experiment, part 2
January 4th, 2018
A blockchain-backed Redux clone in 105 lines of code
December 18th, 2017
Livecoding 52: First impressions of Vue
November 20th, 2017
After a week I must begrudgingly admit VSCode is a better editor than Emacs
November 10th, 2017
Livecoding 51: I did it! My first PR to a big OSS project \o/
November 9th, 2017
Livecoding Recap 50: How newbie mistakes kill the flow
November 6th, 2017
Livecoding Recap 48: JavaScript async/await and Morty's Mindblowers
October 2nd, 2017
Livecoding Recap 47: Webpack build progress indicator for Mac Touchbar
September 18th, 2017
Livecoding Recap #46: 3D is hard, WebAR defeats me
September 11th, 2017
Livecoding Recap #44: Dipping my toes in AR.js
August 28th, 2017
Livecoding recap #43: A landing page for React + D3v4
August 8th, 2017
Livecoding recap #42: HackerNews app where people are nice
July 10th, 2017
Livecoding recap #40: react-navigation with React Native
June 12th, 2017
Livecoding #39: Towards an AI that writes JavaScript
June 5th, 2017
Livecoding #38 - A faux AI that writes JavaScript
May 22nd, 2017
Livecoding #37- Building a real life color picker
April 11th, 2017
Livecoding #35 - A New Site for reactd3js.com
March 13th, 2017
Livecoding #33: A Map of Global Migrations, Part 2
February 13th, 2017
Livecoding #32: A Map of Global Migrations, Part 1
February 7th, 2017
Livecoding #30: Dipping my toes in React Native
January 17th, 2017
Livecoding #29: Optimizing React choropleth map rendering
December 19th, 2016
Livecoding #28: Productizing the door-answering Slack bot, Part 1
December 5th, 2016
Livecoding #27: New React Indie Bundle page almost done
November 21st, 2016
Livecoding #26: A new page for a new React Indie Bundle
November 14th, 2016
Livecoding #25: Adding MobX to a vanilla React project
October 31st, 2016
Livecoding #24: A choropleth in React.js
October 3rd, 2016
Livecoding #23: Slackbots and OAuth
September 26th, 2016
Livecoding #22: A door-answering Slackbot
September 19th, 2016
Livecoding #21: Use Babel for libraries, not Webpack
August 29th, 2016
Livecoding #20: You can’t extend an object
August 21st, 2016
Livecoding #19: It’s hard to package a library
August 15th, 2016
Livecoding #17: Particle physics is hard
August 4th, 2016
Livecoding #15: Reaching the limits of canvas redraw speed
July 20th, 2016
Software Engineering Lessons from Production
Join Swizec's Newsletter and get insightful emails 💌 on mindsets, tactics, and technical skills for your career. Real lessons from building production software. No bullshit.
"Man, love your simple writing! Yours is the only newsletter I open and only blog that I give a fuck to read & scroll till the end. And wow always take away lessons with me. Inspiring! And very relatable. 👌"