Technical
314 articles ยท all categories
March 2021
How a $12 AWS bill powers a $50k business
my point is that running server code on the web has become ridiculously cheap *and* easy
Variants โ a quick tip for better React components
Reusable components like to grow boolean props for different situations and complexity soon blows up. Variant props are the perfect solution.
February 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 ๐ค
A TypeScript trick for reusable hooks
Reusable hooks are all fun and games until TypeScript starts yelling at you about incompatible types.
React Bricks - visual blocks editor for NextJS #CodeWithSwiz 22
Tried a new visual editor for NextJS and CreateReactApp. Got a site up in 20min ๐ค
The Magic Function principle
Write functions, mostly magic.
January 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.
Tech interview best practice that fails in life
Tech interviews have a magic answer: The hashmap. And it's not always best on the job.
[CodeWithSwiz 20] Adding Firebase support to useAuth, pt2
Firebase continues to be ๐ฉ. No wonder people keep asking for support in useAuth. Almost there โ๏ธ
[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?
November 2020
SSR, SSRwR, SSG, CSR, WTFBBQ???
These abbreviations are getting out of hand. It's like a bad interviewer's wet dream.
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.
Use private libraries to cleanup your codebase
You're using the many-small-repositories approach to work faster as a team. But where do you put shared code? How do you make it nice to use? How to publish and install private packages?
React context without context, using XState โ CodeWithSwiz 14, 15
useAuth works without React Context! ๐ here's how
October 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?"
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.
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.
September 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 ๐
Modern backend is a JavaScript function
Many engineers think server-side code is the scary domain of True Engineers. Something newbies, juniors, and frontend engineers shouldn't touch. They're wrong. Modern backend is a joy. โค๏ธ
Using JavaScript to commit to Github โ CodeWithSwiz 7
Update code with a JavaScript function? Easier than you think ๐
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
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
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.
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.
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 ๐ค
August 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.
In 2020's, what is "frontend"? ๐คจ
"He's a frontend guy, is this even a fair question to ask?" The head of engineering was worried about our systems design question โฆ