Markdoc vs. MDX: what do you choose?
Markdoc is an exciting content format from Stripe built for scale. If reusability and build speed are top of your list, it might be worth a try over MDX!
Rust enums are WAY better than TypeScript’s
TypeScript enums are missing a LOT of features. Let’s see the magic of matching and structs that Rust brings to the table.
Rust expressions are a game changer
TypeScript forces you into clunky switch cases and unreadable ternaries. Let’s see how Rust expressions solve this.
Ditch try / catch hell with Rust’s Result
You deserve type-safe errors. Let’s see how Rust ditches confusing try / catch patterns with the Result object.
Why JS devs should learn Rust - pattern matching
Tired of JS switch cases break-ing your code? Let’s see how Rust got it right with pattern matching.
Best practices are a lie.
Best practices are trends, not rules. Let’s see how to use this to your advantage!
Write code that works, faster by beelining
It’s easy to get bogged down in refactors and clean-up. Here’s why I suggest “beelining” to a solution SOONER to write reliable code with fewer mistakes.
Best practice for JS function arguments
Can we write better function arguments? Let’s see why leaning on objects can avoid show-stopping bugs from positional arguments.
One component per file is wrong. Here’s why
Tired of unorganized code and 100+ VS Code tabs? My secret is… embrace big files. Here’s why!
Guide to stop hating CSS
CSS is hard. Here’s some resources and guides to hate it less!
Typessafe Markdown with Astro 2.0
Sick of accidentally shipping Author: [Object object] on your blog? Let’s check out typesafe Markdown in Astro 2.0. aka the video I’ve been excited to post for MONTHS! 👀
ReactJS vs. SolidJS vs. Qwik: should you switch?
Qwik might be the new hotness with its resumability features, but is it really faster than your React app today?
Should ReactJS devs learn Qwik?
Qwik might be the new hotness with its resumability features, but is it really faster than your React app today?
Why web dev is getting harder in 2023
Is frontend web dev a MESS? The amount of options and best practices are overwhelming… but it’s the nature of any growing industry. Here’s why.
Node file paths in 2023
ESM became the new Node standard. Let’s see how this changes file paths for the better with the URL object.
Why Zod is the library to learn in 2023
Zod solves a base-level problem every app has, with applications from APIs to Markdown validation. Let’s see why it’s so useful!
Why GitHub Copilot makes you smart, not dumb
Copilot can pump out quality code… if your codebase has quality design. Let’s see how treating Copilot as the “junior dev test” makes you a better programmer.
Use the time element for better SEO
This one HTML element means better SEO and accessibility for your blog. It’s time (heh 😉) to talk about published dates!
Is the NextJS 13 router worse?
Next 13 completely changed routing and nested layouts. Let’s see why they shook things up, and whether it’s better or worse for your web app.
SvelteKit does HTML forms best
POSTing data to an API shouldn’t be hard. SvelteKit forms do it best! Let’s see multiple page forms and progressive enhancement in action 🏃♂️
Trend: SolidStart changed the server game
Full stack components ™️ are becoming a trend. And I think SolidJS found the smartest way to marry server$ code to your frontend in perfect typesafe harmony 🤝 Let’s see if this sparks an industry trend!
Did SolidStart SOLVE routing?
File-based routing only gets you (..)part(..)/ of the way. Let’s see how Solid makes hybrid approaches and config-based routing easy.
What React Server Components ACTUALLY do
There’s some confusion over the benefits and drawbacks of React Server Components. Let’s break them down, with a comparison to Astro (astro.build) as well!
Tailwind is not a design system.
…But it can be a key part of one! Let’s see where Tailwind shines, and how utility classes with accessible Radix UI or Zag components can be a winning combo 🏆💨 Brad Frost article - design systems are for user interfaces
Cache serverless responses with Cache-Control headers
With serverless on the rise, cache is king 💰 To speed up responses and cut down on your server bill, let’s walk through Cache-Control headers that’ll fine-tune how and where cache is stored.
NextJS 13 chooses static vs. dynamic deploys… for you?
Did you know NextJS 13 flips between static and serverless deploys based on how you write you code? Let’s seen how Next snoops on your fetch functions to auto-decide the best way to ship your website.
Is Turbopack the next Vite?
Vercel had a lot to announce at NextJS Conf 2022, including a Rust-powered bundler called Turbopack with performance comparisons to boot. Let’s break down the nuances to see the differences and benefits compared to ViteJS.
Should you still use CSS-in-JS?
😱 Is CSS-in-JS dying? …Okay, not really. But recommended libraries and performance concerns changed a lot since Emotion first hit the scene. So, let’s break down React 18’s bottlenecks and new styling approaches 💅
Article noted in video: “Why we’re breaking up with CSS-in-JS”
render-as-you-fetch makes websites feel faster
🔁 Loading 🔁 spinners 🔁 are 🔁 annoying. How do you fetch data more efficiently? Let’s talk about render-as-you-fetch, a buzzword shaping frameworks like NextJS and React Location.
ReactJS async / await proposal, explained
Data fetching (and async code in general) is pretty complicated in React. Luckily, the ReactJS team is proposing a new way forward!
Let’s talk server components, async / await, and the use hook. React has opened this proposal for comments, so weigh in here 👀
Simple full-stack form validation with Zod
Zod is the last form validator I’ll ever need 🙏 Let’s validate forms on the server and client, no matter the framework, using zod-form-data!
To try the project from this video, clone the repository 👀
Build secure, type-safe APIs with tRPC
What if your server and client agreed on types? Let’s use tRPC to build simple-yet-robust API endpoints with built-in type validation 💪
👀 Want a sample app? Spin one up with create-t3-app!
Simpler global state for your web app ➡️ Nano Stores
Nano Stores are my FAVORITE global state manager. Let’s see how they work, and why they can simplify your ReactJS Context flow 🌊
Try the Astro tutorial to learn more!
Are your HTML forms screen reader accessible?
Let’s talk input labels, adding instructions with aria-describedby, and the pain of icon buttons feat. megaphones 📣
For more, check out Ben Myer’s excellent aria-label rundown!
Is Solid what ReactJS should’ve been?
Let’s see what makes SolidJS so special, and why it’s my rec for performance-minded JSX lovers 💙
Some helpful resources:
- Spin up a starter project with Astro + Solid
- Watch Solid’s intro to reactivity for an in-depth intro
Use Preact BEFORE React on your next website
It’s never been easier to spin up a Preact project. Here’s why you should start with Preact BEFORE graduating to React on your next project 💪
Some helpful resources:
- Spin up a starter project with Astro + Preact
- Set up Preact compat in your existing React project to avoid big refactors
Are MPAs coming back?
Could modern browser APIs make multi-page apps (aka “traditional” static or server websites) feel like single-page apps? Let’s explore why SPAs like NextJS exist, and why they may be less necessary in the future ✨
Some helpful resources:
- Maxi Ferriera’s incredible navigation API demo, bringing app-like navigation to a static MPA.
Are servers better than static site generators?
I’ve been hearing a lot of “serverless can replace your static site” claims. So, I put some cache headers to the test. Turns out, servers and serverless can cut down your build times and still match your static site’s speed 👀
Set up fonts on any website
Fonts are hard 😓
Let’s write font-face rules together, preload for efficiency, learn what the heck font-display: swap does, and see how Fontsource can automate the process 💪
Faster Analytics with Partytown 🎉
Analytics are slowing your site down. 😓
Been wanting to talk builder.io’s partytown for a while! Let’s see how web workers + service workers = no more analytics blocking 🚀
What is edge compute?
🎵 I’m on the edge 🎵 CDN 🎵 And I’m serving all my content near you
Let’s explore edge compute vs. serverless deployment, and the emerging use cases for this tech.
How cache headers work with SSR
Caching is key to fast servers. Let’s explore how cache headers work, what max-age to choose, and how this applies to server-side rendering (SSR). Remember, the MDN docs are your friend!
What is server-side rendering (SSR)?
Let’s try SSR, a way to render content on-request and deliver a unique user experience without the loading spinners. This relies on “pre-rendering” as well, which you can learn about here.
What are pre-rendering and static site generation (SSG)?
Let’s explore “pre-rendering,” a way to render your websites ahead-of-time. Unlike client-side rendering (CSR), this lets you ditch the loading spinner and deliver content faster. Static site generators like NextJS and Astro can help.
What is client-side rendering (CSR)?
Let’s talk about client-side rendering, a way to render your webpage top-to-bottom using JavaScript requests. This is common for frameworks like create-react-app and Vite!