Technical

314 articles ยท all categories

39 articles from 2020 ยท show all

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.

You though computer science has no place in webdev? Here's a fun coding challenge

How to debug unified, rehype, or remark and fix bugs in markdown processing

When your brain is breaking, try XState

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 โ€ฆ

Why react-hook-form is my new favorite form library

July 2020

Path dependence or why existing code always looks bad

Build a new design system in a couple afternoons

June 2020

Wormhole state management

Using scopes for elegant JAMStack permissions

May 2020

Screw web performance, just wait a little ๐Ÿ˜ˆ

Add granular role-based access to your JAMStack app

Don't be weird

The 3 types of scalability

April 2020

Why you should build a form generator

Lemme guess, every project involves 1 or 2 forms and they're all the friggen same. You got forms coming out the wazoo. Render fields. Connect to state. Add field validation. Detect submit. Add form validation. Send fetch request. Repeat.