How to start a React Project in 2024

Every year I want to give you a brief overview of how to start a new React project. I want to reflect on advantages and disadvantages, on the skill-level needed as a developer, and on what features each starter project has to offer for you as a React developer.

Full article

Read More

Exploring the Core Concepts of Node.js Readable Streams

In Node.js we have different types of streams, and one of them is the Readable stream. You may have heard of it, or perhaps even used it a few times. But do you know how to use it effectively? This question of efficiency comes when we're dealing with cases that go beyond basics.

Full article

Read More

An Interactive Guide to CSS Grid

CSS Grid is one of the most amazing parts of the CSS language. It gives us a ton of new tools we can use to create sophisticated and fluid layouts. It's also surprisingly complex. It took me quite a while to truly become comfortable with CSS Grid!

Full article

Read More

Four approaches to creating a specialized LLM

Wondering how to go about creating an LLM that understands your custom data? Start here. Trying to create a language model that understands your own custom data? Here are four techniques you can use to create a specialized LLM, ordered in terms of the amount of complexity/compute involved.

Full article

Read More

Tech predictions for 2025 and beyond

We have entered an era of unprecedented societal challenges and rapid technological advancements. Harnessing technology for good has become both an ethical imperative and a profitable endeavor.

Full article

Read More

Astro 5.0

Introducing Astro 5.0! With Astro Content Layer to load your content from any source, and Server Islands to combine cached, static content with dynamic, personalized content. Read on to learn more about these powerful new features and more!

Full article

Read More

Writing Modern JavaScript without a Bundler

Not all libraries are bundled to support ESM in this way as a single file. If it does not, you can add compile the dependency to support it, as we'll touch on later. The script.js file above works in-browser, but doesn't look quite right to anyone that's done modern JS.

Full article

Read More

Better Software Design: Changing how we talk about software

Changing how we talk about software is the beginning of designing better software. Through clear definitions we have better design conversations. How we use a system or component. Who will use the system.

Full article

Read More

Architectural Intelligence – The Next AI

Key Takeaways Architects need to separate AI hype from real software. Design systems based on tangible components such as LLMs, not a vague vision of AI. Determining how, where, and when to use AI elements comes down to traditional trade-off analysis.

Full article

Read More

The 70% problem: Hard truths about AI-assisted coding

After spending the last few years embedded in AI-assisted development, I've noticed a fascinating pattern. While engineers report being dramatically more productive with AI, the actual software we use daily doesn’t seem like it’s getting noticeably better. What's going on here?

Full article

Read More

Reflections on managing state

Over the last 7 months, I tried 5 state management libraries (Zustand, Jotai, Valtio, MobX, XState) and 1 data fetching library (Tanstack query) in monthly posts like this one. During that time, I also used Redux toolkit and React Router (it's a data-fetching library now) on professional projects.

Full article

Read More

Using Transformers.js for AI in the Browser

Two weeks ago I had the pleasure of attending, and speaking at, connect.tech. One of the cooler presentations I saw was from Danielle Maxwell where she discussed using AI in the browser and introduced me to Transformers.js. I'd heard of this before, but wasn't quite aware of how easy it was to use.

Full article

Read More

How To Improve INP: React⚛️

In part 2 of the ‘How To Improve INP’ series, we’ll go in-depth on which patterns we can use to improve Interaction-to-Next-Paint (INP) when using React. All patterns can be used with frameworks like Next.js and Remix, too.

Full article

Read More

Why we switched to Astro (and why it might interest you)

If everything went according to plan, no one should have noticed anything. But for a few days now, this site has been completely new. We took our old Next 13 site and completely rewrote it in Astro! 🧑‍🚀🚀

Full article

Read More

React Data Fetching Patterns

When building React applications, fetching data is a common task. In this article, we'll explore different data fetching patterns for React components across client and server.

Full article

Read More

Why am I writing a JavaScript toolchain in Zig?

Few things keep me up at night more than the untapped potential in current developer tooling. The research exists; all that's needed is focused effort to improve the tools we rely on every day.

Full article

Read More

Designing (and Evolving) a New Web Performance Score

In my day-to-day work, there’s a lot of competitor analysis. Either to present to the client themselves, to see where they sit among their contemporaries, or me to use in my pitching process—competition is a great motivator!

Full article

Read More

What We Learned Migrating From Webpack to Vite

The Neon Console is a Single Page Application (SPA), or rather, a collection of SPAs. Static assets like JavaScript and CSS are served through CloudFront, while the HTML is dynamically rendered by our Go backend.

Full article

Read More

Vitest vs. Jest

Effective testing frameworks are essential in building reliable JavaScript applications, helping you minimize bugs and catch them early to keep your customers happy. Choosing the right testing framework saves hours of configuration hassles and improves developer experience.

Full article

Read More

Why TanStack Start is Ditching Adapters

Building a new front-end Javascript framework is a daunting task, as I’ve been learning with building TanStack Start, my new TanStack-powered full stack framework. There’s so many moving pieces:

Full article

Read More

React Scan

React Scan automatically detects and highlights components that cause performance issues in your React app. Drop it in anywhere – script tag, npm, you name it!

Full article

Read More

The Tragedy of Running an Old Node Project

It’s been a long while since I wrote anything on this site. The framework I used was Gatsby which in 2020 was one of the hot ways of getting a good looking blog up and running quickly. With over 41 dependencies, and god knows how many more sub-dependencies, this thing was a beast.

Full article

Read More

Why do developers love clean code but hate writing documentation?

In the Developer Coefficient, a study commissioned by the fintech giant Stripe, developers reported that they spent over 17 hours a week on maintenance tasks like debugging and refactoring—work classified as “toil.

Full article

Read More

Real-World Forecasting with Deep Learning: How We Do It at Wix

In recent years, deep learning (DL) models have shown remarkable potential in the field of forecasting. Models such as DeepAR, neuralProphet , PatchTST, Temporal Fusion Transformer, NHiTS, and TiDE have achieved state-of-the-art performance on traditional academic benchmarks. However, despite their promise, these models often fall short when applied to the complexities of real-world forecasting.

Full article

Read More

Building React Forms with Ease Using React Hook Form, Zod and Shadcn

Forms are something every developer encounters, whether as a user or on the developer side. They’re essential on most websites, but their complexity can vary wildly—from simple 3-field contact forms to giga-monster-t-rex, multi-page forms with 150 fields, dynamic validation, and asynchronous checks. In this post, we’ll explore how React Hook Form, Zod, and Shadcn can be used to create an adaptable, developer-friendly solution that handles a wide range of form requirements with ease.

Full article

Read More

Uncontrolled or controlled: A matter of perspective

You may have come across the terms uncontrolled component and controlled component in your React journey. These terms are typically introduced by looking at the two ways native input elements can be used in React: as uncontrolled inputs, or as controlled inputs.

Full article

Read More

To Dare or not to Dare: the MVA Dilemma

Teams developing a new increment of a product, also known as a Minimum Viable Product (MVP) are typically in a tough spot: they have a short period of time in which they have to develop and deliver what they hope is a valuable product increment. They also need to develop a Minimum Viable Architecture (MVA) for that MVP to meet its quality goals, also known as Quality Attribute Requirements (QARs).

Full article

Read More

Meet Angular v19

In the past two years we doubled down on our investment in developer experience and performance — in every single release we’ve been consistently shipping improvements that multiply their impact when combined together.

Full article

Read More

Fast, Reliable Serverless: From 50 minutes to 50 seconds a year of downtime on AWS

At Runa, we’re always striving to build the most performant products possible. I work on the Ledger team, a sub-team of engineering. Our focus is to enable each engineering team to transfer money with speed, accuracy, and ease.

Full article

Read More

Importing a frontend Javascript library without a build system

I like writing Javascript without a build system and for the millionth time yesterday I ran into a problem where I needed to figure out how to import a Javascript library in my code without using a build system, and it took FOREVER to figure out how to import it because the library’s setup instructions

Full article

Read More

Talk to ChatGPT on a Phone Call

The integration of voice communication and AI represents a big step forward in human-machine interaction that can potentially transform traditional methods of communication. For instance, in the context of a phone call, you no longer need another human to be present on the other end of the line.

Full article

Read More

When is the right time to share our excitement about new web features?

When we share content about emerging web platform features, we have to be careful that we aren’t frustrating people with things they can’t use yet. However there is a place for talking about new things, and people who enjoy hearing about them.

Full article

Read More

Why Typed Linting Needs TypeScript Today

Linting with type information, also called “typed linting” or “type-aware linting”, is the act of writing lint rules that use type information to understand your code. Typed linting as provided by typescript-eslint is the most powerful JavaScript/TypeScript linting in common use today. Lint rules that use type information are significantly more capable than traditional, AST-only rules.

Full article

Read More

How to Set Up Next.js 15 for Production in 2024

I've worked on Next.js applications that scaled to over 100k monthly active users and landing pages with millions of monthly visitors. In this article, I'll share all the lessons I've learned through countless iterations.

Full article

Read More

The Journey of ClearBank From Start-Up To Scale-Up

Gray: Has anyone ever been to a powerboat race in their life before? I went to a powerboat race when I was a little kid, and I vividly remember this by being in awe of the speed and the agility of these boats. The way they could turn the corners. The way they could accelerate.

Full article

Read More

Will we care about frameworks in the future?

I've been building lots of apps by using LLMs and Agents. I'm currently up to about 17 tools, utilities and demos over the duration of a couple of weeks. I build them for me and because tools like Replit have enabled me during my small spots of free time to build fully working sites and apps that solve the immediate problem that I have. I've felt incredibly productive.

Full article

Read More

Self-contained Executable Programs with Deno Compile

Since Deno v1.6, the deno compile command has empowered developers to turn JavaScript and TypeScript programs into single, standalone binaries that run on all major platforms—no dependencies, no additional installs. This has big implications:

Full article

Read More

Exploring DORA: 9 Steps on the Path to Compliance

The Digital Operational Resilience Act (DORA) is a significant regulatory framework introduced by the European Union to enhance the operational resilience of digital systems within the financial sector. The regulations are slated to go into effect January 17, 2025.

Full article

Read More

React useCallback() - A complete guide

Performance optimization is crucial for creating a smoother user experience in modern web development. React, a popular JavaScript library for building user interfaces, provides several Hooks to help developers manage state and side effects efficiently.

Full article

Read More

Validating your react-intl applications

When working with react-intl we would like to ensure that our JSON translations are valid and up to date. What we want is to avoid our translation files containing outdated keys and translations and broken target translations.

Full article

Read More

Next.js to htmx — A Real World Example

Over 6 years ago, I created an open source URL shortener with Next.js and after years of working on it, I found Next.js to be much more of a burden than a help. Over the years, Next.js has changed, and so did my code so it can be compatible with those changes. My Next.

Full article

Read More

Build a Database App with Drizzle ORM and Deno

Drizzle ORM is a TypeScript ORM that provides a type-safe way to interact with your database. In this tutorial, we’ll set up Drizzle ORM with Deno and PostgreSQL to create, read, update, and delete dinosaur data: You can find all the code for this tutorial in this GitHub repo.

Full article

Read More

Using Shadcn UI without a Tailwind Config File

The upcoming release of Tailwind CSS v4, we can return to styling that, at its core, emphasizes CSS-native solutions. This approach enables maintainable and performant styling systems that work seamlessly with Shadcn UI components.

Full article

Read More

Partial Prerendering for Everyone with Cloudflare Workers

Next.js has a great feature called “Partial Prerendering” that allows you to prerender the external “shell” of your app, and defer rendering other parts until they are requested by the client. (Vercel refers to as “PPR”.

Full article

Read More

StackBlitz achieves $4M ARR in 4 weeks for their AI web development platform with Claude

StackBlitz transformed web development by integrating Claude into Bolt (bolt.new), their browser-based development platform. This enabled anyone to create sophisticated web applications through natural language—no coding experience required.

Full article

Read More

How Bun supports V8 APIs without using V8 (part 2)

We're hiring systems engineers in San Francisco to build the future of JavaScript! In the first part of this series, we compared the C++ APIs used to interact with JavaScriptCore and V8, which are the JavaScript engines used by Bun and Node.js respectively.

Full article

Read More

How We Built the BFCM 2023 Globe

Every year for Black Friday Cyber Monday (BFCM), we put together a real-time visualization of purchases made through Shopify-powered merchants worldwide. This year we're cooking up something big, and in anticipation we wanted to show you how we built the globe last year.

Full article

Read More

Automation Platform v2: Improving Conversational AI at Airbnb

Artificial intelligence and large language models (LLMs) are a rapidly evolving sector at the forefront of technological innovation. AI’s capacity for logical reasoning and task completion is changing the way we interact with technology.

Full article

Read More

Centering things: a solved problem?

In Chrome and Edge, the following code can be used on block layouts to center child elements. align-content works without the need for flexbox or grid — and it works in all browsers! justify-items on a parent element and justify-self on a child also work without flexbox or grid, but only in Chromium for now.

Full article

Read More

Being a Responsible Developer in the Age of AI Hype

Key Takeaways AI is code, not magic: AR-LLMs only generate plausible text based on statistical patterns, not true reasoning or understanding. The current AI landscape is filled with exaggerated claims: it’s crucial to set realistic expectations to avoid contributing to AI hype.

Full article

Read More