2022–2026
1,339 posts
2026 46
May 2026
- I thought AI would lead to worse code
- My personal site has been on Wordpress for 14 years
- Hot take: 🌶️ An agent should be generating nearly all code today
- Problem: How do I quickly tell AI exactly which elements I want to change
- In 2026, many dev teams still fail to get the basics right
April 2026
- Teammate wanted to try Claude's new expensive ultrareview but didn't have access
- Wild realization: AI means I shouldn't write *any* code anymore
- The acceleration from AI is unbelievable
- Pet peeve: Projects where many files are named index
- Problem: AI generates code that doesn't match our formatting and linting...
- Dev team red flags 🚩 “We do Scrum” “We do Git flow” “We use <insert...
- Ya know how in a job interview you can tell if someone is a good candidate...
- Been building a new Next.js app over the last few weeks and I'm happy to say...
- I thought AI would lead to more slop
- The near future: AI generates code
- Today at a conference, I asked a room of 250 developers this question: "If...
- 4 weeks of coding by 4 developers and over 1,000 unit tests that pass in...
- I’ve never been great at regex
- This is so slick
- I used Windows for 20+ years
- I see many people running multiple agents simultaneously
- The problem with an immature IT org is it tends to repel the people who are...
March 2026
- Just learned a team at Microsoft is doing code reviews *after* merge
- I’ve spent 8+ hours a day building with Claude Code and Opus over the last...
- Y'all out there running multiple agents at once scare me
- Problem: HTTP status codes in code aren't type safe and require looking them...
- Bun test is crazy fast, but unfortunately we just switched back to Vitest
- Rule: If the prompt is likely to be longer than the code change, I should...
- Even in the age of AI, I can do many tasks more quickly manually than via...
February 2026
- One of the most common reasons I leave GitHub Copilot is to try a new model...
- Using Codex today instead of Claude Code
- My big frustration with skills is they're not consistently invoked
- Excellent post
- Problem: Generating code via AI may lead to skill atrophy and code I don't...
January 2026
- I keep improving my agentic feedback loop
- Prediction: Frameworks will start shipping official skills
- Problem: You want to share a skill with people using different agents, not...
- Woah, Vercel just released the React Best Practices skill
- You've probably heard of the BDD testing style, using Given, When, Then
- Problem: Our team uses many different AI coding tools, so where do we put...
- Problem: “you could have AI write/maintain your traditional E2E tests, but i...
- With agent instructions files like http://CLAUDE.md, it's tempting to add...
- Problem: I’d like to be able to check on or work with my laptop’s Claude or...
- Last month I enjoyed "Advent of Claude: 31 Days of Claude Code"
- Problem: In Claude Code, when should I create a custom slash command vs a skill
- Problem: I want Claude to use Chrome
2025 177
December 2025
- AI is an accelerator
- Some people run multiple coding agents at once
- Problem: I want to run multiple agents at once
- Problem: You want to hide a component, but still preload data and remember...
- My biggest beef with Scrum: The sprint time box creates an arbitrary deadline
November 2025
- I don't need stand-ups, sprints, retrospectives, or a scrum master
- Problem: You want to enable a few specific VS Code settings for everybody
- I'm reviewing a codebase with over 750 uses of optional chaining
- Software development is simpler than it sounds
- "LLMs are trained on other people's code"
- I talk money with my developer friends
- Custom directives are getting out of control
- A few years ago I led a team of developers creating reusable software...
October 2025
- Just visited The Netherlands for the first time to speak at Techorama
- Problem: People forget to remove feature flags
- If I’m unhappy with the code AI generates, it’s probably my fault
- Two important points: 1
- Is Vibe coding effective
- I'm watching the Remix Jam stream and this little moment is interesting
- In TypeScript, I don't use screaming case for consts - it's needless because...
- People often separate React component logic via a hook
- > In sprint planning > Team has 19 story points in the sprint and a...
- "Test in prod”
September 2025
- "Because I said so." Early in my career, I asked my team lead why we had to...
- In the last week both Cursor and Copilot announced a new CLI
- Problem: Using coding with agents, it's annoying to constantly check back to...
- Imagine your team only had two environments: 1
- Problem: I want to learn while coding in a new tech
- Anyone using a Macbook Air as their dev machine
- I’m a fan of Tanstack and excited for Tanstack Start
- My 6-step approach to learning: 1
- Just implemented a feature using GitHub spec-kit
- Just found awesome-copilot
- Problem: Too many feature flags
- General rule: Feature flags should default *off* for new features
- New version of VS Code chat automatically selects the appropriate LLM model...
- A big difference between Tanstack Query and Tanstack DB: Tanstack Query is...
- How I handled React state over 10 years: 2014: Class state 2016: Redux 2018:...
August 2025
- How I routed in React over 10 years: 2014: React Router 2016: Next page...
- A portion of the React community seems to enjoy hating on Vercel
- Problem: LLMs may be trained on old docs and thus suggest outdated APIs
- Many apps are basically Excel in the browser
- "Solid is better than React." Sure
- Spending more time with Tanstack DB this week and it's finally clicking
- Claude's init command is impressive
- So I'm using Tanstack Router on another new project and I gotta say it again...
- I enjoy having my own an app that’s just for experiments
- Each time I open up an old JS project, I get dozens of breaking changes when...
- How I've fetched in React over 10 years: 2014: Fetch in componentDidMount...
- If you give a junior dev a vague task, you’ll probably get bad results
- I’m eager to see how LLM usage changes when the venture capital money dries up
- I think sync engines are the future
- How I’d pick a router in React in 2025: 1
- Wild story of working with Claude I just heard from a friend: I was coding...
- Theory: The fewer long-lived environments the better
- I'm curious - Who's doing development with just two environments
July 2025
- Just heard of a team where non-developers (such as designers and product...
- AI is supposed to make us faster coders, right
- My preferred React stack for 2025 Package manager: Bun Starter: Vite...
- When learning a new tech, I like to open PRs to improve the docs
- I'm bullish on sync engines, but I admit there's a lot of downsides to...
- "Should my web app use a sync engine?" If your web app would benefit from...
- "Developers don't write automated tests
- I've found arguing is more productive when I do 3 things: 1
- Two related, but separate ideas: 1
- After 25 years of coding I've realized there is no end to learning
- I wish more library/framework docs had a section for “Stuff we don’t do well”
- I've spent the last few weeks experimenting with different local-first /...
June 2025
- One of my favorite uses for rest/spread is creating a new object that omits...
- Shots fired
- I've never enjoyed writing CSS, but two innovations solved that: 1
- What are people using instead of Storybook these days
- 5 types of React state, and when I use each: 1
- Programming isn't easy
- Trend I'm seeing: AI app generators are a sales funnel
- Problem: Choosing technologies is hard
- Prediction: AI will replace most web app UIs
- The local-first / sync engine ecosystem is far bigger than I realized
- Confession: The last year has been hard for me
- Problem: You want to run a "real" DB in the browser
- The weird thing about 2025
- Problem: ESLint is slow on large projects with complex rules
- This can’t be real The sign of a failing organization is when everyone knows...
- "Today's LLMs are like a junior developer"
- I bought my M1 Max Macbook Pro in October 2021
- This post by Dan Abramov on "Progressive JSON" helped me understand how...
- I love Tanstack Router's type safe search params
- In a React app, declaring an ErrorBoundary at the root is common, but rarely...
- TypeScript syntax is often inspired by JavaScript
May 2025
- Seeing these two side-by-side in my timeline really sums up the current...
- My favorite things about Europe vs the USA: 1
- The rumors were true - Remix is coming back and it’s not using React
- Problem: I want to ensure my switch statement handles all potential cases
- For me, LLMs work quite well as “glorified autocomplete”
- Problem: You have complex logic for narrowing a TypeScript type that you'd...
- Woah, @tan_stack just added Tanstack DB, a sync engine that works with...
- Local-first web apps already have a big ecosystem
- Four related web app problems: 1
- Just realized Vitest now has built in support for testing TypeScript types
- Vibe coding is a leaky abstraction
- Vibe coding is the modern version of copy/pasting code you don’t understand...
April 2025
- How to write bad software: Standardize nothing
- Just converted a small test suite from Vitest to bun:test
- Tweet 1914682178857795918
- TypeScript types can be intimidating to read
- Here's how I validate a URL param via Zod
- The fact that so many apps out there blindly trust runtime inputs is the...
- I validate all my runtime inputs: -Cookies -Local storage -URL params -API...
- Claim: "Those who can't do, teach"
- I'm reviewing a TypeScript codebase that's filled with type assertions like this
- There are many JS runtimes - Node, Deno, Bun, etc
- Zod is TypeScript's most popular runtime validation library
- So Dan Abramov's new *giant* blog post (think small book) is worth the read
- One of my favorite tools during a code audit is jscpd
- Problem: Manually creating TypeScript types is time-consuming, tedious, and...
- TypeScript has around 20 handy utility types - Pick, Omit, Partial, etc
- Just generated Playwright tests for a feature that had no tests with this...
- React Server Components have gotten a lot of hate recently
- The biggest reason I prefer working in TypeScript over typed alternatives...
March 2025
- I've heard people say "spelling mistakes in code are harmless"
- PSA 📢: This isn’t error handling
- Over-abstractor: A dev who immediately wants to abstract any new library...
- TypeScript radically improved my frontend code
- Just watched "React Query API Design: Lessons Learned" by @TkDodo 7 insights: 1
- A codebase shouldn't feel like this, but I see it a lot
- Problem: Unused npm dependencies
- Today I'm auditing a codebase for a client
- Problem: I want to see a list of the settings I've changed in VS Code
- Just read "Next.js vs Tanstack" by @gill_kyle
- In TypeScript, there are at least 4 ways to implement immutability
- Now that Node, Bun, and Deno can run TS files directly without compilation,...
- In TypeScript, interfaces and types are often interchangeable
- TypeScript is great
- TypeScript will soon compile 10x faster
- I think I finally have my phone-friendly vertical video format dialed in
- Wow, the speed impact of rewriting TypeScript in Go is wild
- In TypeScript, interfaces and type aliases can "extend" each another
- Tweet 1899480456975778106
- My M1 Mac is still wonderful
- My new TypeScript: Zero to Hero courses are different than any courses I've...
- Theory: If you know a tech well, there are probably features you try to avoid
- Misconception: "Separate useState is faster" Reality: When state changes,...
- Tanstack form was announced a day ago and everyone is excited about it...
- Problem: You need to convert a big JavaScript project to TypeScript
- TypeScript rule: The stricter we are, the safer we are
February 2025
- Problem: React Query’s useSuspenseQuery displays the Suspense fallback...
- Years ago I was a team lead at a growing startup
- Surprisingly, I'm using Bun instead of Node in my new TypeScript courses
- I was already a big fan of Tailwind, but I'm even more bullish now that AI...
- A full-time job sounds safe, but it’s not
- Docs should be honest
- For 25 years, I’ve specialized in frontend web development
- The React docs finally recommend Vite
- RSC is the most painful new React API in the State of React survey
- My recipe for feeling great: - Good sleep
- Why React Query
- Wow, just learned React Query is used about about 1 in 5 of all React apps
- Just presented a two day React workshop
January 2025
- The ending of an era: Create React App is about to be officially marked as...
- 2025 is going to be a big year for local first web apps
- This article is an excellent overview of why sync engines / local first are...
- Problem: TypeScript doesn't support specific string or numeric values (a...
- I've found the best way to learn is to teach
- At Codemash, a photographer saw me at lunch and asked "Is it okay if I take...
- People complain about complex TypeScript types, but complex types are...
- Everybody dreams of retiring early
- Problem: When the left and right side match, a TypeScript enum or const...
- I ❤️ TypeScript
- Just talked to a business owner who reduced his dev staff from 18 to 3 using...
- Problem: I may forget to pass an optional param in cases where it should be...
- One of the weirdest JavaScript features: Functions can have properties
- In one of my client’s apps, we centralized date formats in an enum to...
- Interesting
- In TypeScript, many people argue over when to use type vs interface
- I recently joined a team that’s using V0 for rapid UI prototyping
- Why does coding pay well
- V0's system prompt specifies these naming and casing rules
2024 341
December 2024
- In modern TypeScript, there are at least a dozen ways to narrow types
- Next.js and React Router 7 (RR7) have fundamentally different approaches to...
- What if I take my career seriously and AI replaces me
- In my experience, it’s rare to find someone in QA who is as good at writing...
- Claim: Your app is slow because it uses React/Vue/Angular instead of plain...
- Woah, I agree with v0’s state management preferences
- What I love about Tanstack start: Simplicity
- Problem: You want to push your changes, but skip CI because you're not done...
- Controversial opinion: 🌶️ I prefer for all quality checks to occur *before*...
- My preferred development workflow for 2024: 1
- Yesterday read through V0's 1600+ line system prompt
- Someone posted the V0 system prompt on GitHub
- Wow, Supabase is 🔥
- Tweet 1864402475723141523
- Hot take 🌶️: I’m not a fan of dedicated QA
- I’ve found the fewer environments a software team has the better
- I'm creating a new TypeScript project using Bun
November 2024
- Problem: You want to use Node with TypeScript
- The State of Frontend 2024 report is out
- Next.js and React Router 7 (RR7) have fundamentally different approaches to...
- React 19 is in RC React compiler is in Beta Tanstack Start is in Beta React...
- I often talk to developers who are thinking about going independent
- Tanstack Query pattern: 1
- Knip finds unused JS and TS code
- React 19 RC1 is out
- It's 2024 and I still see keys like this in React PRs
- Problem: I want to test my React app's error boundaries
- Tanstack query is awesome for fetching and caching data
- Studio setup 2.0: - Closed blinds (to control the light) - New 5600K...
- Mistake: Needlessly wide optional field
- If I can’t clearly explain why people vote differently than me, then I need...
- All these years I've been using "new Error" for nothing
- In code reviews, I've learned to watch out for many related useState calls...
- One of the most unkind things you can do is disparage someone else’s passion
- I've spent the last few weeks trying all sorts of React 19 edge cases
October 2024
- TypeScript has a structural type system, not a nominal type system
- I have a theory: 🌶️Some developers are letting their political views impact...
- Two popular, but conflicting programming styles: Small functions vs deep...
- TypeScript problem: Related object properties should either all be provided,...
- New React framework: One
- “Code should be obvious
- Refactoring without tests is basically this: “I changed some stuff and...
- I don’t ask for permission to refactor
- PSA: 📢 The useId hook is stable in React 18
- Goal: Calculate a value once per render
- Problem: The backend API returns poorly structured JSON
- Skeleton screens improve perceived load times, reduce bounce rates, and can...
- In the age of AI, code reviews are more important than ever
- New React framework: One Strongly typed file-based routes (like Tanstack...
- Problem: SQL is an old, leaky abstraction
- Perhaps the most common mistake I see in TypeScript code reviews: Needless...
- Just saw this performance mistake in a React code review
- 9 ways I’ve made money as a software dev, sorted from most enjoyable to least: 1
September 2024
- Problem: The backend returns a needlessly wide type
- Somehow I overlooked this new React 19 feature until now: Problem: I want to...
- These days, many old JavaScript projects have converted to TypeScript
- Every developer has to balance two concerns: 1
- React mistake: State too high
- Situation: A web app has no end-to-end (E2E) tests
- I occasionally see people using HTML entities like ' or "
- I’ve been happily using Vitest for quite awhile, but I just tried using Jest...
- 7 things I search for when I audit a TypeScript codebase: any - Use a...
- “I’ll add tests in an upcoming PR.” When I hear this, I push back
- Great advice from “A Philosophy of Software Design”
- I had a wonderful job, but I always dreamed of being independent
August 2024
- React performance mistake: Calling a function multiple times with the same args
- TypeScript problem: A subset of fields are optional, but should all be...
- Problem: I want strongly typed React search params
- I'm ready for AI that's pushy, like a smarter linter
- Problem I just saw in a code review: Using useEffect to copy URL search...
- Just used Cursor to eliminate a needless useEffect in a big React component
- I love being a software developer
- React is typically fast enough
- I care about code quality
- I'm tired of bad test names
- Problem: I want to require a specific format for a TypeScript string
- I’m looking forward to useActionState in React 19
- My philosophy: If I need an alarm or caffeine to wake up, I should go to bed...
- Announcement: react-switchboard Create custom dev tools for your React app
- I don’t normally do this but I coded over 12 hours yesterday and stayed up...
- I've spent the last few weeks working on a React developer tool that I think...
- Problem: You need to check if a value matches one of many potential values
- How do we accomplish this in software
- I’m looking for a good technical book to read on vacation
- The most common needless use of `let` I see: Setting an initial value,...
- Just realized my React Berlin talk "Managing React State: 10 Years of...
July 2024
- Custom DevTools are a powerful way to speed up development
- Problem: React Router’s useSearchParams is clunky, and not type safe
- Two ways to write a test: 1
- Storybook is useful, but the number of dependencies it drags in feels excessive
- Problem: You want to compare two files
- Problem: It’s unclear if a test is a unit, integration, or e2e test
- I'm creating a reusable React component that I plan to publish via npm
- Problem: With in-browser testing tools like Playwright, each page load takes...
- Problem: You want to quickly publish an npm package using TypeScript
- Using fetch
- React 19 is huge
- One of the most common sources of needless complexity I see in code:...
- Look around your team
- A bug I see in nearly every web app: Last in wins
- Forms in React 19
- React 19 has many new form-related features: Server actions - Call async...
- Problem: Sometimes a component is "too big"
- Work gets better when you don’t need the money
- How I typically handle React state today: Data fetched via HTTP: React Query
- An easy mistake to make: Needlessly “high” state
- React Query is an asynchronous state management tool
- I often see web apps with separate frontend and backend dev teams
- Problem: Choosing a React state library is hard
- Just learned it's easy to create beautiful warnings and notes in markdown...
- React's built-in state works great
- The New York Times just upgraded from React 16 to 18
- Problem: You need to manipulate a query result
- Code smell: Setting state twice in a row Example: Solution: Eliminate...
- I’m building a new React app with all the new features: React Server...
June 2024
- Habit: When I'm coding alone in my home office, I often narrate my work aloud
- Why code review is critical: If the code is confusing, it’s easiest to fix...
- Web app UI security in one tweet: Assume the client will -Change the URL...
- Just presented “Lessons from 10 years in React” at @kc_dc
- "I'm not convinced Zod is helping" One of my clients said this because the...
- Problem: When a URL param changes, React Router renders components using...
- I rarely use Jest or Vitest for UI testing anymore
- Problem: Declaring default React prop values inside the component
- I often help teams add tests to existing web apps via Playwright or Cypress
- PSA: A static production JS app shouldn’t need the node_modules folder
- Just spent a couple hours reviewing the “State of JS” survey results
- “Why validate JSON responses via Zod if the app just crashes if the schema...
- Problem: Related optional properties Why it’s a problem: - Needlessly...
- A Zod misuse I've noticed: Validating function args
- Naming rule: The larger the scope, the longer the name
- Quick story about humility: I recently met someone new at a conference dinner
- Sometimes initial page load speed doesn’t matter
- The new course is live
- The React 19 announcements and the existing React docs send a clear message: 1
- React’s docs have a gap: They provide no advice for people running...
- A mindset I’ve found helpful for learning: Don’t expect to understand on the...
- Today I'm working with an app that has too many layers of abstraction
- Separating unrelated concerns is helpful
- One of my clients is using an odd React pattern: They put only JSX in components
- Why use Vite instead of create-react-app
- How to upgrade old create-react-app app to Vite: 1
- Today I helped a team with a 6 year old React app
- Problem: React Query keeps a reference to everything that was in scope when...
- Adding an abstraction may help developers understand a complex app by...
- Problem: It’s easy to forget to remove feature flags later
- Situation: You want to write automated tests for a REST API
- 25+ ways to handle state in a React app in 2024: React: useState useReducer...
May 2024
- How do you name an array when the noun doesn't have a plural form
- A user doesn’t think about where state is stored
- Scenario: A modal for editing a user
- “Automated tests are like pouring concrete on code.” I disagree
- I finally switched to Arc browser a week ago
- Signs we should split a component: 🚩 The props are complicated and...
- TypeScript problem: You need to support any string value, but you’d like...
- React compiler is experimental, but it's safe to use...
- Common issue I've seen with teams that use a global state tools like Redux:...
- Problem: If you move files via cut and paste, Git “sees” a remove and an add
- Problem: I want to use a TypeScript union type, but: The list of options is...
- Problem: You want to initialize something only once in a React component
- When I feel burned out, I avoid screens
- Quiz: Let’s see how well we understand React Server Components
- Just watched @dan_abramov’s React Conf talk
- I love that the React ecosystem keeps innovating
- React's simple idea: Decompose complexity via components
- Wow, someone built the same site in two ways: 1
- Just did a short stopover in Iceland on the way to speak in London
- "We create a separate hook for every React component to keep the component...
- One of my clients creates a custom hook for *every* React component
- I can’t stop thinking about this quote
- Problem: Too many browser tabs
- A bad developer keeps adding complexity until it finally works
- React problem: I want to use a feature flag to call one of two React hooks -...
- Feature flag pattern: When replacing an old feature with a new feature via a...
- Problem: Slow pull request reviews Solutions: ✅ Pair program ✅ Open small,...
- Problem: We have a flaky test that keeps breaking our CI build
- I see some React apps using useMemo everywhere
- I'm creating the same app using a variety of third-party React state...
- I disagree with the majority here
- Why I prefer const over let: ✅ const provides me extra cues because const is...
- Rushing developers creates a downward spiral of quality
- In TypeScript apps, if something is hard to type, my design is probably wrong
April 2024
- Problem: “Duplication is often better than the wrong abstraction”
- “Duplicated code is often better than wrong abstraction.” “Excessive...
- In the last 10 years I think the change that has most improved my web...
- Problem: I want to show a spinner if any React Query mutations are in progress
- Sometimes the divide between the backend and frontend leads to massive waste
- Problem: Fetching in useEffect is clunky, verbose, and error prone
- Challenge: Name something that a software developer should *always* do
- Scenario: You’re using React Server Components, so you can query the DB in a...
- Problem: You want to find copy/pasted code
- Early in my career, when someone would interrupt me while coding, it would...
- Wanna speed up your TypeScript builds and improve your IDE's TypeScript...
- Accessibility mistake: Putting an aria-label on a non-interactive element
- Problem: You want type-safe mock responses
- You don’t need a service provider to do feature flags
- Just finished the book “What’s Our Problem” by @waitbutwhy
- Scenario: You're mocking HTTP calls in automated tests
- Problem: You want to access some React state outside of React, in plain JS/TS
- So much needless UI complexity stems from REST APIs that do these two...
- A common coding mistake: Inconsistent terms
- A key debugging skill: Decomposition
- A surprising thing about owning a Tesla: Nearly everything is automated
- An epidemic problem in software: Teams with missing skill sets
- A recipe for fast, reliable end-to-end tests (no mocks): 1
- Situation: A React component with 5 useEffect calls has a bug
- Folder pattern I’m enjoying: “Local” shared directories
- In TypeScript, declaring types saves me more time than it costs me: ✅Speeds...
- Problem: If an endpoint returns JSON with properties I don't expect, I want...
- Disabled input fields aren't a loading strategy
- Problem: Ideally, everyone is responsible for quality
- “Deploy daily.” It’s a wonderful goal
- Rule for choosing between a URL path and search param: Search params are...
- If the team is ignoring PRs that’s a management problem
- "We don't do code reviews
- How I get my PRs merged fast: 1
- Some developers, when presented with a new library, immediately say “We need...
- I often see aria-labels that look like an id: 🚩...
- React habit: Avoid putting things that only need to render once in a component
- Just noticed another benefit of using Zod: It draws attention to bad...
- Problem: For accessibility and SEO, each page should have an H1 tag
- I believe the pendulum shift back to server-rendering will help many teams...
March 2024
- There are infinite ways to write software poorly
- When I was a manager, some people came to me with problems
- When testing for expected strings, I typically assert explicit strings, not...
- General HTML rule: “disabled” optimizes for DX
- Many UI teams are making a fundamental mistake: They’re not using mocks...
- Sometimes, an Array.find is a sign of sloppy code
- Problem: You’re using msw (@ApiMocking) to mock out HTTP calls during...
- I rarely experience performance problems in React
- Early in my career I struggled with communication
- A developer's job in one word: communication
- Rule: If it's worth checking, it's worth automating
- A weird mistake one of my clients is making: If an invalid/inaccessible URL...
- "E2E tests are flaky" Yep, often true
- Common scenario: Separate backend and UI teams are building a web app together
- A developer shouldn't merely do what they're told
- I love how React hooks let me create a well-named, encapsulated, reusable logic
- Rule: A failing automated check should break the build
- Problem: You want to copy a JavaScript array but use a different value for...
- A few years ago I was excited about the idea of visual regression testing
- Problem: You’re testing via @testling_lib, and you want to debug what you’re...
- I test web apps via 3 types of tests: 1
- Using Prettier and ESLint
- Two web app testing approaches: 1
- I typically configure @playwrightweb to run end-to-end (E2E) and mocked...
- Two ways to write software: 1
- Problem: There are many React state libraries, so it’s hard to choose...
- Using TypeScript
- My programming style: Mostly simple pure functions, named clearly
- Warning: ⚠️ If you’re: 1
- Why I don’t use test IDs: Adding test IDs all over my markup is a bad DX
- In TypeScript, I’ve found throwing a runtime error is often a sign of poorly...
- In React, needless complexity and repeated null checks can often be...
- Problem: You want to query your DB via TypeScript
- A simple wording pattern to avoid defensiveness in code reviews: Avoid: "You...
- One of the most rewarding things about doing code reviews: Seeing people...
- When is a TypeScript union type impractical
- Problem: aria-labels are often implemented poorly
- React has over a dozen popular third-party state libraries
- Habit: If a function accepts two arguments of the same type, I accept an object
February 2024
- The longer I work in software the more enjoyable my work is
- I'm recommend using JSDoc comments above each property
- Seriously, I think @kentcdodds deserves the developer equivalent of the...
- Sometimes, we all have to cut corners
- I'm hesitant to click approve on a PR that feels highly complex
- "I'll add tests in a separate PR"
- I often see filter calls that needlessly fall back to an empty array
- Not trying to put Ryan on blast (I like Ryan, and Remix and React Router are...
- ⚠️ A tooltip on a disabled button isn’t accessible
- Problem: Disabled fields and buttons aren’t accessible or discoverable
- Developers are liars
- TypeScript rule: If a function requires something, the function's type...
- With TypeScript, I feel comfortable making big changes that would have...
- I'm getting tempted to use ESLint to warn on usage of useEffect
- I review a LOT of React code every day
- The risk with mocked tests: The test may not test anything
- General rule: The fewer mocks a test has, the more confidence the test provides
- Top 10 React state libraries, sorted by downloads: 1
- Four interesting points about React Server Components: 1
- I'm really enjoying the Apple Studio monitor
- Some of my clients try to "hide" primary keys in the UI
- When I see a type assertion like this in TypeScript: fish as Fish I read it...
- React mistake: Adding specific logic into a reusable component
- React-query problem: I fetched a list and I want to avoid needlessly...
- Just ran no-type-assertion/no-type-assertion on a large TypeScript codebase
- This is extremely useful, but most teams still aren’t doing it: Preview...
- A common case of needless state: Dialog visibility
- I avoid boolean function arguments
- Today I thought “I can do this change in one big PR
- Needless complexity: Using multiple terms to describe the same concept
- Security is important
- Before creating a custom hook, I search the web
- It blows my mind that companies expect developers to work on slow virtual...
- GitHub CoPilot + TypeScript is an awesome combo
- Doing a code review without running the code is like doing a quality check...
- Zod is great, but it’s for *runtime* validation
- Yesterday, I suggested naming functions passed to useEffect
- Problem: React's useEffect only specifies when code should run
- It's surprising how often I see pull requests with these 2 attributes: 1
- A giant pull request is typically a mistake
- Using TypeScript
- There are lots of ways to draw lines between junior and senior developers
- "Every time you remove duplication, you add coupling." - @ardalis So before...
January 2024
- DRY = Don’t repeat yourself
- “React has become complicated.” Don’t like RSC
- TypeScript Problem: I need a specific property, but I don’t know the exact type
- Me, reviewing a PR: Why are doing this weird thing
- Problem: I accidentally closed a tab or a file
- I’m not strict about types because I enjoy being strict
- Problem: Your code base probably contains a lot of copy/pasted code, but...
- Two Related Problems: 1
- I’ve been working in TypeScript for years and I think I’ve used “ts-ignore”...
- JavaScript habit: I prefer to use a "point-free" style
- When coding, I have at least 4 audiences: 1
- React’s context works great for global state that changes rarely
- I like RSC
- One of my favorite React Hook Form features: I can use a Zod schema to...
- For years, I’ve said “You don’t need a React form library
- In one of my first dev jobs, I supported activating new cell phones at...
- Imagine you’re building a React app
- How I start a new React app in 2024: Traditional SPA: Vite, Typescript,...
- Here's what makes @tan_stack Router special: It's the first React router...
- I've taught teams React with React Router for years
- Some developers are better than others
- 4 attributes of scary code: 🚩 Feels needlessly complex 🚩 Unclear intent 🚩...
- Naming matters
- Problem: In TypeScript, developers often declare needless conditionals
- It's fascinating how many people either love or hate this take
- Order isn’t natural
- 3 ways to share code in React: Problem: Two components have different logic,...
- Problem: Using a laptop on a flight is cramped and the screen is too low
- Nested ternaries aren’t good or bad
- “It's already bad, so who cares." Teams don't say this out loud, but it...
- Problem: Cache invalidation is hard
- In JavaScript, a pure function relies only on args
- Ways I share data between React components: I prefer: ✅ Read/write to the...
- Theory: We know pair programming is effective
- Problem: You want to know how much of your TypeScript code is type safe
- In TypeScript, I often prefer to use a Record over a switch statement
- Five terms I avoid when naming things: 1
- I rarely use plain “any” in TypeScript
2023 484
December 2023
- I run every PR as part of my code review
- Needless React props = needless complexity
- Choosing a dynamic language over a statically typed language is like...
- Problem: VSCode uses its built-in TypeScript version by default
- I spent more time with @tan_stack Router 1.0 on a long flight today
- Just tried @tan_stack Router 1.0
- For me, coding in the early 2000’s was terrifying
- I worried an EV would give me range anxiety
- A home needs housekeeping or it slowly becomes a mess
- Problem: We need to upgrade an npm package
- Some people hate nested ternaries
- TypeScript Problem: I want a string literal union type, but I also want to...
- This is what it looks like to colocate related code
- Problem: Code reviews delay feedback
- It's shocking how often teams "lie" to TypeScript
- Wow, I just watched @BHolmesDev implement React Server Components from...
- Just bought the Apple 5K Studio display The good: ✅Super bright ✅Gorgeous...
- A recipe for tech debt: 1
- Problem: Optional fields are overused in TypeScript
- Problem: We need to replace an old feature with a similar new feature
- Problem: URL search params are evaluated at runtime
- I work with many teams who use different languages and repos for their web...
- CSS Grid is powerful, but I honestly don't use it often because I'm more...
- In TypeScript, the narrower the type, the more safety and clarity we have
- When React launched in 2013, every component was a class
- Problem: JavaScript’s .sort mutates the array
- I like how React hooks centralize and encapsulate a chunk of reusable logic
- I often see HTTP requests that forget to do one or more of these: ✅ Show...
- Problem: We need to fix a production bug, but the development branch...
- Import paths tell a story
- ⚛️4 questions I ask before using useState: 1
- Problem: You need to switch your app’s CSS to Tailwind
- Code review principle: If the check can be automated, it should be automated
- Claim: “I need a barrel to specify the feature’s public API.” Reality: There...
- PSA 📢: Avoid Barrels (A barrel is a file that exports code from other...
- Problem: Our code has old patterns that we don’t want people to copy
November 2023
- Coding is writing
- Problem: We need to rename a DB column, but we want to avoid a breaking change
- Problem: End-to-end tests are often slow and brittle
- Simple rule: The more effort I put in, the more results I get out
- Making fundamental changes on a development team is hard
- Quick story about my lucky Thanksgiving this year
- I love the simplicity of React's reuse model
- Confession: I’ve been writing software for over 20 years, but I often learn...
- Problem: You want to create a reusable React dialog that manages its own...
- Problem: If a user experiences a client-side JavaScript error, does your...
- Why I don’t do TDD often: TDD commits me to an API before I know what API I want
- In a code review, what's an example of a "nitpick"
- A minor tweak I enjoy: I put the scripts section near the top of package.json
- Downward spiral: 1
- I've worked with teams that were scarred by their previous automated testing...
- I’ve found React.memo usage should be rare
- Problem: If your React app uses providers, you may have to repeat their...
- How I use React query: 1
- I've finally realized why it's hard for me to get into watching pro sports:...
- I often group related props into an object
- GitHub CoPilot saves expensive developer time by purchasing cheap AI time
- “I don’t have time to exercise” is counter-productive
- When working in @tan_stack React query, I use setQueryData instead of...
- React in 2023 is like the Honda Accord
- This talk is excellent
- Tests are useful, but they’re not automatically a win
- 3 parties that should have design input: 1
- Here’s why React Server Components (RSC) are a big performance win: 1
- Why I'm excited about React Server Components (RSC): 1
- The key difference between @nextjs and @remix_run: Next is a React framework
- A recipe for frustrating developers: 🚫 Require a slow VPN or slow remote...
- "This is a good suggestion, but it's outside the scope of this PR
October 2023
- I’m reviewing a plain JS code base
- I just read this variable name in a code review:...
- Common React mistake: Buried default 🚫 Don’t bury the default inside the...
- I work with multiple companies every week
- Locality of Behavior (LOB) Principle: The behaviour of a unit of code should...
- So many bad takes on this photo
- Problem: It’s easy to accidentally name a boolean in a way that makes it...
- The smaller the PR, the faster it gets merged
- Just learned about AutoAnimate
- Just presented “Creating Reusable Components…That Are Actually Reusable” at...
- Habit: When someone provides a detailed and helpful explanation in a pull...
- A simple sign that a web app isn't using URLs effectively: Tickets can't...
- It’s common to store the active tab like this: activeTabIndex = 0; But this...
- Avoid a single meeting on a problem
- Poll: Which boolean variable name do you prefer
- Problem: If a function accepts multiple parameters of the same type, we may...
- Can someone show me a an HTML form that uses the browser’s native validation...
- You’d be shocked how complex a web form can be
- How a developer shows empathy: Have a sense of urgency in reviewing pull...
- One of the hardest parts of being a developer is picking my battles
- One of the most satisfying discoveries as a React dev: Needless prop drilling
- Problem: Sometimes people export internals merely to support unit testing
- When I see an optional React component prop in a code review, I dig deeper: 1
- I love cars and I love driving
- Wow, this was more lopsided than I expected
- Just used the new "Presenter Overlay" feature on MacOS Sonoma to create a...
- Atomic design is great
- Problem: I use "test.only" to run a single test quickly
- Problem: Your project may be using deprecated features
- Concern: “Code reviews slow us down”
- Another reason it's important to write tests: locale
- In React, I group related state into one useState
- I’m reviewing a JavaScript code base with JS Doc comments like this above...
- Problem: When a user clicks a button the response may be slow
- I'm a big believer in code reviews
- One of my favorite things about owning a Tesla: The phone integration
- Hot take: 🌶️ If I need data “power tools” like Lodash, Underscore, Ramda,...
- The 5 keys to successful software: 1
- Some things that can’t be fully tested via automation
- Just audited a codebase with a REST API that returns this: { table1: []...
- A common mistake: "Let's abstract this in case we want to replace it later."...
- I'm auditing an app that's using Tailwind...with CSS modules
- Simple JS developer productivity tip: Fail npm start if the expected port...
September 2023
- Just reviewed a web page making 55 fetch calls totaling 570k of JSON
- Often a useEffect can be replaced by calling code when an event occurs
- Two related software development skills: 1
- React performance in one tweet: Declare state as local as possible
- I rarely need to do React performance optimizations
- Many programming practices have a sweet spot
- Problem: You want to easily update outdated npm packages
- Problem: You want to assure your web app isn’t logging messages to the...
- Just hit 100k followers 🤯 Here are 10 things Twitter taught me about...
- In late 2022, I joined a struggling team as a part-time consultant
- Pair programming is great
- ⚛️React performance tip: If your default state is expensive, put it in a...
- My M1 laptop is silent
- 📢 If you hate writing software, you may just be in the wrong role
- Pair programming doesn’t typically replace code reviews for one simple...
- CSS Modules and CSS-in-JS encourage me to think selfishly
- “We don’t need to do code reviews
- "I don't need to run the PR
- Problem: Disabled buttons hurt accessibility and usability
- Naming rule: Case acronyms as words
- A test naming strategy I enjoy: 1
- An EV is the ultimate mobile office
- AI coding tools like Copilot make suggestions based on what code is in the repo
- Two thoughts on accessibility: 1
- Mistake: Displaying UI features that don’t work
- Problem: TypeScript can't validate runtime data
- A common programming mistake: Forgetting to start with a verb
- TypeScript is a set-based language
- Yet another reason I run PRs as part of code reviews: I just ran a PR with...
- Avoid disabling from submit buttons
- Problem: You need to represent an empty number
- Bun is exciting
- Software developers are writers
- Problem: I'm working in an app that uses both Redux and React Query
- The Node cjs to esm transition is a mess
- Bun 1.0 is here and it’s shockingly compelling
- I just removed tests, types, linting, code reviews, and CI from my project
- Why is this post is getting so much buzz
- I understand why some teams use plain JavaScript
- “We don’t need types
- My talk "Creating Reusable Components...That Are Actually Reusable" from...
- Problem: The REST API I’m calling is a mess
- I’ve used a treadmill under my standing desk for the last 8 years
- I’m helping a team create their first automated tests
- Here’s a novel reason to write automated end-to-end tests: It motivates...
- Problem: You want to link to a page and highlight specific text
- I occasionally see companies create reusable component libraries that make...
- I've found it's important to run PRs so I can review the user experience
- Imagine your CI build took only 5 seconds
August 2023
- Me: "If it doesn't improve the user experience, it doesn't matter." Dev:...
- Problem: aria-labels are often overly broad
- I’m helping a team add end-to-end tests to an existing app
- If you work in TypeScript, this style guide by @mkosir_ is a wonderful resource
- Many companies are unwilling to spend a little extra money to make CI faster
- Some people “overdo” their job
- When working in TypeScript, I think in sets
- A common TypeScript mistake: Needless optional fields
- Electrician installed the Tesla wall connector today on a 60 amp breaker
- I just built a product catalog app with @nextjs new app folder
- If I were a dev manager again, here's a stat I'd track: PR comment/approval...
- Sometimes a simple REST API change can significantly simplify the UI
- 4 software delivery metrics worth tracking: 1
- One of my clients just did a demo of http://builder.io
- Okay, this is wild
- A problem I'm seeing on @nextjs: Sometimes I save changes, but I still see...
- I've been using @nextjs 13, the app folder, and React Server Components a...
- Some programmers are code-first
- Types vs tests is a false dichotomy
- I ❤️ pnpm
- Poll: Imagine your team has to build a project with either types or tests
- Here are the slides for "Creating Reusable Components...That Are Actually...
- I thought that lounge access was silly
- One of the most common reusable component mistakes I see: They're not...
- Storybook is nice, but it can be tricky to fully emulate my app's...
- Problem: 🚫 Your project has unused files
- My rule for creating reusable components: Honor HTML
- The most effective way to quickly learn a new tech: 1
- People keep talking about shadcn/ui, so I just created some reusable React...
- Many companies create reusable components
- My mindset: “I should be able to merge my work daily.” This encourages me to...
- Each year, I work with a few teams that are basically doing the same thing:...
- Problem: You’re building a big feature that will require weeks of work
- A pattern I've noticed: A designer ships great work, gets bored, and moves on
- A messy coding environment is like a messy kitchen
- Global state isn’t “bad”
- Building a web app and need global state
- Global variables in disguise: React Context Redux React-query Apollo Jotai...
- Creating components is easy
- The most common mistake I see with feature flags is having too many
- Problem: “We can’t release daily
- Warning: If you hire people whose job is basically "lead meetings" you may...
- Want to do Continuous integration (CI) and Continuous Delivery (CD)
July 2023
- ⚠️ Watch out: Environments encourage behaviors
- Problem: When a user shares or bookmarks a URL, the page doesn't show what...
- Problem: You want to display a dialog
- Things I rarely use: 🚫 Currying 🚫 Middleware 🚫 Inheritance 🚫...
- Some developers claim to be “over-employed” (working multiple full-time...
- A common TypeScript mistake I see in React code reviews: Needless useState...
- The most common way I see agile fail: 1
- Old habit: I added useful explanations in my GitHub pull requests to help...
- Habit: I often centralize API urls in a single file
- 9 ways to resolve "It works on my machine": 1
- Me: This PR fails on my machine
- Short-term thinking: We don't have time to write tests
- Problem: I need to fix a bug
- A recipe for massive technical debt: 📉 🚫 Throw a large number of...
- Two mistakes I see often: 1
- I frequently audit JavaScript projects for companies
- Habit: Before I make a PR comment, I ask “Could this check be automated?”...
- Every software shop wants to say “we’re agile”
- Problem: You need to apply a key to a React fragment
- Company: "We're agile." 5 minutes later
- Concern: “Asking for feedback makes me look weak or incompetent.” Reality:...
- Perhaps the most common mistake in software: Waiting too long before getting...
- Every abstraction has a cost
- Problem: You want to support internationalization
- Problem: Mock datasets tend to be bloated, unreliable, and repetitive
- I believe one of the most valuable things we can do in code reviews is...
- Anyone know of an ESLint rule that enforces naming React state properly
- “I don’t need Tailwind
- Software development is intimidating because there is no "arrival"
- Using "!" in TypeScript is often a hack that reduces type safety
- Software development is an interest of mine
- I thought TypeScript was a waste of time
- A lead who understands and is responsible for the entire system is critical
- “Move fast and break things.” This can be a useful mantra early in a...
- Good programming advice can be taken too far: DRY - “I don’t repeat...
- A common mistake: “I don’t like that person, so I won’t agree with anything...
- You don’t need to get rich to radically change your life
- When I’m stuck on a hard programming problem the most ineffective thing I...
- Confession: Years ago, my life was dominated by fear
June 2023
- Refactoring is rarely “necessary” or “urgent”
- Problem: TypeScript and ESLint display errors using a red underline, so you...
- I strive to use consistent names when passing React props
- The cascade in CSS is like inheritance in Object-Oriented programming
- If your frontend approach doesn’t offer a way to abstract repeated HTML,...
- Three misconceptions I’ve noticed among people who don’t “get” Tailwind: 1
- The longer I work in TypeScript, the more this is clear to me: When building...
- React performance problems are rare
- Code reviews are a powerful way to improve code quality
- Limiting work-in-progress is useful
- "Storing your unit test and the file under test in separate folders is like...
- Microservices provide more team autonomy than Microfrontends
- Just presented “React: The Most Common Mistakes in 2023” at @kc_dc
- I’m helping a company build a VERY big React app by composing many separate...
- I try to avoid introducing global state as long as I can
- React mistake: Declaring state too high
- Problem: Your web app is too big for one team to build
- 6 months ago, I started consulting a team with 1,300+ "any" in their TypeScript
- I used to think every pull request (PR) needed to be "perfect"
- Yesterday, one of my clients had a problem
- Problem: When you deploy a new version of your SPA, users with a tab open...
- Problem: When you deploy a new version of your SPA, users with a tab open...
- ⚛️ React Tip: Don't nest React component declarations
- Mindset that motivates me to go to the gym daily: Going to the gym is a...
- Goal: Allow the user to select items in a list
- TypeScript mistake: Needless “defensive” coding
- data is rarely the right variable name
- Problem: If we allow ESLint warnings, the number of warnings will grow over time
- Problem: Git pre-commit hooks are slow, which is annoying when I commit...
- I’ve worked on teams with high quality, reliable, comprehensive tests
- Just learned about Million, a new alternative React virtual DOM
- Problem: Sometimes people disable an ESLint rule, then forget to remove the...
- The URL is often underused in web apps
- A bug I see in nearly every web app: If someone saves a stale record, it...
- A weird misuse of React’s context I just found: 1
- Problem: Meetings are often needless, slow, expensive, and hard to schedule
- Problem: In React Query, a mutation often needs access to the query's key so...
- Reviewing code is one of the most rewarding things I do
- Poll: Which code do you prefer for returning totals
- Just refactored a React component
- Problem: Sometimes I make unrelated changes when working on a feature
- If useEffect is the answer, I'm probably asking the wrong question
- A well-designed REST API doesn't merely expose each DB table
- How I define a unit test: An automated test that tests 1 function or...
- I joined a struggling team in January
May 2023
- Problem: TypeScript optional fields reduce type safety
- A single monorepo for an entire company rarely makes sense
- Comprehensive test coverage is great
- Some developers love consistency too much
- The less experience a developer has, the harder their job is (because they...
- As, a consultant, I’ve learned PRs are the most effective way to create...
- When I audit a project, I clean up first
- A new reason I’m a fan of Tailwind: It’s AI friendly
- Web app testing tip: 1
- 6 signs a dev team is out of control: 1
- One of the hard parts of leaving a software development project: I can't see...
- TypeScript is the biggest improvement to my web dev experience in the last 5...
- Situation: Multiple teams are collaborating to create a single, big React app
- When you’re building a dialog, ask this: “Should users be able to share a...
- React: The Most Common Mistakes in 2023 I'm presenting this talk at @kc_dc...
- Problem: A page has multiple dialogs, but only one dialog should be...
- Had a lot of fun this week teaching React with TypeScript, React Query, Mock...
- I prefer: ✅ Static types over dynamic types ✅ Functional programming over...
- In JavaScript, I export on the same line as the declaration
- Problem: Dead code
- Here's the difference between amateurs and pros: My friend is a wood worker
- The big risk of using global state managers: Some teams think "Let's put all...
- A test doesn't just make sure it works
- React tip: Components designed for a single use should have only required props
- How to write reliable end-to-end tests: 1
- Two related signs of a mature dev team: 1
- Problem: JavaScript's sort method mutates the existing array
- A recipe for creating a TypeScript codebase that’s hard to maintain:...
- Another reason to avoid prefixing TypeScript interfaces with "I": It can...
- Many companies create needless overhead and complexity by batching deployments
- Technologies foster mindsets
- React performance tip: You probably don't need to optimize React's...
- React performance technique: Split a big component if some state is only...
- There are many ways to write unreliable software
- Avoid centralizing TypeScript types
- Before I quit my job, I did a “safe” trial run: I asked my boss for 90 days...
- Just got access to the GitHub Copilot Chat beta
- If a function accepts a boolean, consider declaring two separate functions
- TypeScript tip: Avoid specifying a type inside map
- As a React developer: If I'm copy/pasting JSX, I should probably create a...
- “This code seems needless, but surely it’s here for a reason
- I review TypeScript code daily
- TypeScript tip: Avoid prefixing interfaces with "I"
- I've seen well-functioning teams suddenly struggle just because an *extra*...
April 2023
- Problem: You want to reset React state when a component’s props change
- All developer productivity stats are flawed, and can be gamed
- I use @playwrightweb or @Cypress_io to write 2 types of tests: 1
- Measuring developer productivity with 100% accuracy is impossible
- Hard truth: Some devs are WAY more productive
- If you’ve only worked with React, Vue, Angular, etc, you might think every...
- Why I’m so excited about React’s server components: I can do full stack...
- I knew time zones were complex
- Problem: If you rename a file by only changing its casing, Git won't “see”...
- As a developer, I know I’m not a designer
- React tip: Avoid extracting event handlers to separate functions if they're...
- Why I review PR's in my IDE: It’s easier to see if files are in the right spot
- Challenge: Can you think of a single decision in software that has no tradeoffs
- Problem: If a function accepts two arguments of the same type, people may...
- Problem: You want to ensure environment variables are declared and...
- If I’m coding alone, I may skip writing tests if the project is small enough...
- I find GitHub CoPilot more useful for programming tasks than ChatGPT
- I've been coding for 20+ years
- Problem: You want to run multiple npm scripts at the same time
- Problem: A component is hard to test because it displays many different...
- Why I prefer const: It encourages a single, immutable declaration
- 10 technologies I use with nearly every React app: 1
- Problem: Your dev team makes spelling mistakes in code
- Is there an ESLint rule to warn when a "bad" variable name is used
- In React components, I group related items and declare things in a...
- Situation: You have two projects, a UI and a REST API
- I’m loving Playwright’s new UI mode: npx playwright test --ui It opens a UI...
- React-query tip: You probably don’t need initialData or presetData
- Problem: Your team is using VS Code, and you want to make it easy for all...
- Problem: With react-query, we may declare inconsistent query keys
- A sign you may benefit from useReducer: You're making multiple setState...
- Problem: A long ternary is hard to read
- I taught a team React this week
- 10 JavaScript/TypeScript features I avoid:
- 5 years ago, I had a full time job
- My new favorite VS Code extension: GitHub Pull Requests and Issues
- GitHub code review tip: In diff view, there’s a copy path button next to...
- A common mistake: Partially implementing many features
- Continuous integration (CI) is a spectrum
- Continuous integration: ✅ No PRs ✅ No branches ✅ No gating code reviews ✅...
March 2023
- TypeScript tip: If a type is only used by one file, colocate the type with...
- Problem: You want to start a new ticket, but you’re waiting for a related PR...
- Independence is wonderful
- Problem: A ticket is too big
- Claim: “We need sprints to break work down and hit deadlines.” Reality: We...
- Problem: TypeScript only exists at compile-time
- Problem: Feature flags are handy, but it’s easy to forget to remove them later
- Good news: You can deep clone objects in the browser via structuredClone
- Problem: You're doing a code review and have a suggested change that's hard...
- Around 2005, I had a job where I was paid well to do nearly nothing
- “I once attended a planning meeting in which it was discussed for 20 minutes...
- I recently joined a struggling team for part-time consulting
- TypeScript tip: Try to avoid optional fields
- Tip: Clone your repo multiple times
- I typically run the app when reviewing a PR
- TypeScript misconception: “If I need to rename a union type, the usages...
- Generally, prefer TypeScript union types over enums
- Problem: Sometimes functions are needlessly marked async
- Using "any" in a TypeScript library is occasionally necessary
- React tip: Tired of manually wrapping React components just so you can add...
- "I’ve been employed in tech for years, but I’ve almost never worked"
- Avoid Sprints
- Claim: “Employment is safer than independence.” Reality: A job isn’t safer
- A common mistake in React: Mixing fetching, formatting, logic, and JSX
- I quit my job a few years ago so I could be an independent consultant
- Problem: localStorage isn’t strongly typed
- Tip: Avoid AWS CodeCommit
- Problem: Sometimes devs accidentally reorder imports while coding
- Problem: A function is confusing, but you need to enhance it to support a...
- Problem: If you lazy load routes, React Router's loaders won't run until...
- Problem: You have TypeScript types, but want to use Zod too (for *runtime*...
- You don’t need an architect
- You don’t need a daily standup
- Avoid Sprints
- Problem: Sometimes people use needless curly braces around static values
- Some teams struggle because there’s too much friction in making improvements
- React-query tip: You don't have to mess with error handling on each query
- If managers fixate on deadlines rather than quality, the staff will too
- Problem: You need to make a breaking change, but can’t update all call sites...
- I'm working with a SPA that has a dedicated backend composed of over a dozen...
- To me, TypeScript is easily the most attractive language for implementing...
- Just learned about transform tools
- Problem: You’re testing in Playwright, and using Mock Service Worker (msw)...
- Tweet 1632038534935707648
- Problem: You’re using TypeScript and you don’t want to manually define types...
- The world is filled with code that barely works: 🚩Slow 🚩Insecure...
- Habit: I talk to myself while coding
- I've been asked to fix a broken page, inherited from an outside dev team
- JS arrow functions are great
February 2023
- If coding is hard, we're probably trying to move to fast
- In databases, normalization is important
- The problem with a team of only junior developers: Anti-patterns proliferate
- Habit for creating smaller PRs, sooner: Suffix branch names with "phase-x"...
- Automate checks that can be automated
- TypeScript tip: Use “never” to assure every case in a switch is handled
- Idea: Open a software development agency with one simple premise: “Our...
- Wow, just upgraded to the iPhone 14 Pro and the 120hz screen is wonderful
- Problem: If an app makes multiple GraphQL calls on the same page, all the...
- TypeScript tip: Variable names and type names should typically correspond
- React tip: Keep state as "low" as possible
- // TODO: Thing we’ll never get around to doing
- Trunk based development can accelerate velocity and reduce overhead
- The REAL reason manual testing doesn't scale: When people quit, domain...
- Security misconception: “We can’t put a primary key in the URL because a...
- Habit: When I open a PR, I review the diff myself first
- Tip: When naming a variable that stores a list, avoid needless suffixes
- Concern: Isn't deploying multiple times a day risky
- General rule: The fewer environments a web app has, the better
- Software death spiral: “We don’t have automated tests, so we need many...
- Just switched a large project from create-react-app to Vite
- Claim: "Pair programming replaces code reviews" Are you willing to drive...
- Tailwind tradeoffs in one tweet: Are you willing to: Learn some class names...
- A developer who immediately approves PRs is a liability
- When I teach teams React, I teach WAY more than just React: Debugging...
- Pre-commit hook used well: ✅ Fast ✅ Focused (Lint changed files, auto-fix) ✅...
- Problem: You want to assure your unit test doesn't produce console errors
- A key dev team role: Architect
- Today I woke up in Germany
- As an “old” developer, I’m driven by two conflicting ideas: 1
- Wow, just found Deno Lint, a Rust-based alternative to ESLint
January 2023
- Goal: Wrap React Router's Route component so I can avoid having to wrap 50+...
- The closer developers are to end users, the better
- Problem: You need to deep clone a JavaScript object
- Branches should ideally have a short lifetime, less than a day
- Unsurprisingly true: Having automated tests primarily created and maintained...
- I've spent the last week in the UK
- Ideally, onboarding a new developer on a JS project requires only 2...
- An epidemic problem in software development: Resume driven development
- One of the most wonderful benefits of public speaking: It raises the bar for...
- A surprising irony about working in TypeScript: The better I get at it, the...
- Code review habit: If a simple change is necessary, I just change it
- In code reviews, I’m far more impressed with surprising simplicity than...
- 15 reasons I enjoy @tailwindcss: 1
- Problem: Tailwind styles get long sometimes
- The big idea of BDD/Cucumber tests: “Write tests in plain English so...
- Concern: “Infinite scroll is bad because the user can’t ever access the...
- React Router 6.4 introduced loaders
- ⚛️ React code smell: Multiple setState calls in a row
- Monorepos are great…to a point
- Employers shooting themselves in the foot: “We don’t allow using GitHub...
- I don't write unit tests much anymore
- Pre-commit hooks are a waste of time
- Just switched a project from plain fetch to ky
- A common mistake: Types with many optional properties
- Problem: TypeScript errors are typed "unknown"
- Problem: A PR is too big and contains unrelated changes
- A common software development mistake: Going too wide or too narrow
- Tip: Don't lie to TypeScript
- Sometimes, a performance problem is actually a design problem
- Problem: You want to send messages between tabs, frames, iframes, or windows
- Client-side security boils down to one simple rule: Never trust the client
- Problem: "Our code isn't testable"
- A simple, but often overlooked benefit of using the URL for state: It avoids...
2022 291
December 2022
- Vercel converted the BBC site to @nextjs
- Problem: You want to re-throw a JavaScript error to provide a friendlier error
- 13 ways to be a lousy developer: - Don't volunteer to help others
- Common software dev mistakes are at the extremes: 1
- Tip: Store sharable state in the URL
- On some teams, writing good code feels like swimming upstream
- Problem: Your page has many DOM elements, and you want it to render faster
- How many records can you sort/filter/paginate in a web browser
- Using Cypress, but wanna try Playwright
- 5 types of tests: 1
- A unit test shouldn’t: 🚫 Call a DB 🚫 Run a browser 🚫 Make an HTTP call 🚫...
- Writing code involves countless architectural decisions
- Tip: npm scripts can reference env vars as variables: "start": "node...
- Wow, just asked ChatGPT to convert some old Enzyme tests to use @TestingLib...
- A sad irony: Some software projects fail simply because the team tried to...
- Console noise is a problem
- Problem: Changing code temporarily to support local development
- Claim: “React Server Components (RSC) are just PHP”
- ⚛️ 10 ways to fetch data in React: Next 13: React server component Next 12:...
- What’s a big pain point for you as a React developer
- Prefer SPA: Internal app Behind a login Flakey internet Heavily interactive...
- Server-rendering React is becoming popular
- Okay, @ApiMocking has become a fundamental part of my dev and testing workflow
- JavaScript tip: You might not need an if statement or a ternary
- Problem: Using an open source component library often leads to bloat and...
- I thought I knew Flexbox well, but I learned a few new tricks in this...
- 1992: Get answers in books 2002: Get answers on forums 2012: Get answers on...
- Problem: package.json doesn’t support comments
- Coding in 2002: The more effective you are at written communication, the...
- Modern JavaScript has over 50 operators
- Just learned JavaScript has logical OR assignment and logical AND assignment
- This resonates
- ⚛️ My React component unit testing strategy: Test each prop
- This isn’t error handling: .catch((error) => { console.log(error); });...
- ⚛️ 3 keys to fast React app tests: 1
- Yesterday I shared why I'm switching from Cypress to Playwright
November 2022
- I’m a big Cypress fan, so I’m shocked to say this: I just switched to...
- Just learned a new JavaScript array method: findLast It returns the last...
- I think the term "prop drilling" encourages React developers to overuse...
- Problem: JavaScript’s Date is lousy
- I just radically simplified a fetch call
- TypeScript tip: Many optional properties are a code smell
- 4 ways to handle multiple promises in #JavaScript How I choose: 1
- Just learned you can use underscores as separators in JavaScript numbers
- I just cleaned up a JS project
- ESLint should report *ZERO* warnings or errors on CI
- I have a wonderful wife and 3 healthy, amazing kids
- A wasteful pattern: APIs that return PascalCase JSON
- How to write unreadable code: Put all code in one giant function
- Had a wonderful time in LA this week training a team on modern React
- Problem: In React, it's often tricky to hunt down the component that's...
- I prefer building REST APIs in TypeScript
- Tip: Avoid explicit booleans
- TypeScript poll: Which approach to declaring React prop types do you prefer
- Common mistake: Moving to the next feature before truly finishing the...
- I believe in comprehensive code coverage
- My 3 step bug fix process: 1
- I’ve found it’s typically worthwhile to mock API’s for front end development
- How to ship a feature faster: Skip tests
- “We don’t do code reviews
- Healthy team habit: Create Architectural Decision Records (ADR) ADRs...
- Poll: Do you believe it’s important to validate fetch call response shapes...
- My definition of a TypeScript-friendly library: I don’t have to “opt-in” to...
- I'm trying to use @playwrightweb instead of Cypress
- TypeScript decision: How should a function that calls fetch be typed
- Claim: "I don't have time to write tests or types"
- Problem: A TypeScript codebase with "any" everywhere
- TypeScript tip: It's often helpful to access a union type at runtime
- My favorite thing about file-based routing: The folder structure corresponds...
- React should deprecate class components
- Yet another reason to convert your old React class components to functions:...
- Server rendering JS is suddenly popular
- Why render React Server Components
- I just created my first React Server Component with @nextjs 13
October 2022
- ⚛️10 reasons to prefer useReducer over useState: 1
- TypeScript tip: Sometimes a type's name conflicts with an existing identifier
- React in 2014: ✅Make SPAs
- This 7 second video from @kentcdodds may be the single most compelling sales...
- ⚛️ React tip: If state values are related, and must be kept in sync, create...
- Naming tip: "data" is rarely a good variable name
- A simple ruleset for handling React state: 1
- TypeScript tip: When migrating a web app to TypeScript, strongly type HTTP...
- Situation: Your team’s codebase contains an anti-pattern
- useCallback is often the result of a needless useEffect
- 4 React anti-patterns: 1
- Performance jargon: LCP: Largest Contentful Paint - How long it takes for...
- A messy codebase contains countless examples that shouldn't be copied
- React is usually plenty fast by default
- There are good reasons to create a folder
- React state tip: Group related state into a single useState call (via an object)
- In a monorepo
- Two places I see useEffect overuse today: 1
- Prediction: React's upcoming `use` hook will be overused, just like...
- I finally bought a Thunderbolt 4 dock
- React’s “use” hook in 1 tweet: Works like “await”
- Hiring a company to do software development is risky
- Naming is hard
- TypeScript tip: Avoid making a property optional when the property isn’t...
- Compiling #TypeScript is slow
- I’m really enjoying @turborepo
- One of my favorite VS Code plugins: Code spell checker
- I'm reviewing a React codebase that uses Redux to cache HTTP responses
- Code smell: Frequently checking for null/undefined
- TypeScript tip: Prefer type declarations to type assertions
- 5 ways to unit test a React component today: 1
- TypeScript tip: Read “extends” as "equals", “assignable to”, or “subset of”
- Problem: When using a third party component library, it's common to set the...
- React tip: Group related props
- Code coverage can lie
- React tip: Avoid using useEffect to sync state
- Types are tests with better ergonomics
- Problem: How do I find unused packages in package.json
September 2022
- Tailwind feels as logical as Prettier
- My React folder pattern: 1
- I've been working in React for nearly a decade
- Tip: Using TypeScript in VS Code
- I’m creating a new course
- Just converted a test suite from Jest to Vitest
- React: The Good Parts™ Core API: 1
- This TypeScript story sounds familiar
- How I test a pull request for "Robustness": I enter malformed data
- It’s easy to overlook issues in code reviews
- Wow, these GitHub Copilot stats are pretty compelling
- When I work in dynamic languages, I feel more stressed
- Tech moves fast
- The larger the dev team, the more important it is to have: ✅ Static types ✅...
- Zod question: How do you keep Zod and TypeScript in sync
- I just did the Zod tutorial by @mattpocockuk Wow, this is so well done
- In TypeScript, "any" is occasionally necessary when building reusable libraries
- I work with around 25 companies every year
- Situation: You have a big list of icons or images
- I hoped Web Components would take off
- Prefer async/await over promises or callbacks
- Tech I’ve learned in 2022: 1
- Four TypesScript code smells: 1
- I ❤️ React
- I ❤️ GitHub actions
- What 20’s me wanted: Stuff
- Years ago, I was a senior developer
- How I learned #TypeScript: 1
- Really impressed with React Router 6.4
August 2022
- My take on global state in React: 1
- Tired of writing JavaScript sort functions from scratch
- TypeScript tip: Consider generating types
- In TypeScript, you can create a custom function to check an object's type
- Reusable component design tip: Extend the native root element's type, and...
- Just learned about localforage - An npm package that makes it easy to store...
- Reusable component design tip: Make impossible states impossible
- Reusable component design tip: Honor the native HTML element's API
- 13 Reasons Software Development is a Unique, Amazing Career
- Sometimes, it's handy to render specific content in @nextjs on the server or...
- The React ecosystem: Dozens of state management libraries Dozens of mature...
- 2022 Frontend security in 1 tweet: 1
- Imagine a skill that empowers you to build anything you can imagine, all by...
- One of the most common causes of needless complexity that I see in code:...
- I’m creating a library for developers
- The larger a codebase is, the harder it is to make big changes
- Question: What’s the most efficient way to store JSON in the URL’s query string
- This is a great error message
- Developer productivity requires balancing two competing desires: 1
- I’ve spent the few weeks building a custom React devTool library
- Scenario: You need to store a nested JavaScript object in the URL's querystring
July 2022
- Software development estimates are frequently *way* off
- I'm enjoying working with @tailwindcss
- I typically bill hourly
- React devs are in a wonderful spot today
- Woah, I just learned that tsconfig.json allows comments
- create-react-app remains popular
- Bun is a big, risky bet
- React state management approaches have evolved a lot over the years
- As a JavaScript developer in 2022, I have analysis paralysis
- Bun isn’t merely exciting
- The longer I’ve been coding the more I realize: If I’m doing something...
- A lesson I've learned the hard way countless times: Keep changes as small as...
- I don’t set goals
- Okay, Bun looks🔥
- I admire that the React team is focusing on performance
- The smaller the dev team, the higher the output per developer
June 2022
- The JavaScript ecosystem is huge
- Microfrontends require balancing user experience (UX) with developer...
- Even after 20+ years of coding, I often make rookie mistakes
- Critique: “Remix looks like PHP”
- On big, fast moving teams, merge conflicts can burn a lot of time
- This diagram showcases what makes @remix_run special: Dataflows include the...
- It's live
- 🚨 Web developers 🚨 and are often misused
- Anti-pattern: Needlessly reading the URL
- Accessibility / UX tip: Avoid disabling buttons
- Developer experience (DX) matters
- I rarely memoize in React
- Great suggestion in the new React docs: Worried about the performance impact...
- Here are 7 ways to create a React app in 2022
- It's wonderful to see standards emerging for non-browser JavaScript runtimes
- Today I'm thinking about the tradeoffs inherent in choosing a full-featured...
- 2 situations to consider web components: 1
- Attack: “I can’t believe React doesn’t have data fetching and routing...
- My decision tree: Using @remix_run
- 🚨 React developers: 🚨 You don’t have to fetch data via useEffect
- Next.js supports 4 rendering approaches
- Solid tip
- SSR with React is easy with Next or Remix
- You probably know :hover, :focus, and :active pseudo-classes
- Wow, just found this huge list of free public APIs
- Impression: React is getting more complex
- Everyone is talking about server-side rendering
- useEffect is a last resort
May 2022
- Problem: Fetching in useEffect means React components render, then fetch
- Problem: If the user navigates away before a fetch completes, it creates a...
- I just read the “Web Forms” module on MDN
- New hosting trend: JavaScript containers 7 reasons hosts are embracing JS...
- Problem: People forget to write tests
- Tweet 1529437325792628736
- Why I enjoy React: I can use the parts I like, and replace the rest
- Tired of getting "could not resolve" errors when running npm install
- Problem: The React docs encourage declaring anonymous functions in useEffect
- Picking between px and em/rem in CSS has always confused me
- Here's a React hook that checks if the user's device has a rear facing camera
- Accessibility tip: Wrapping related form elements in a fieldset improves...
- I ❤️ Next and Remix
- PSA: React “concurrent mode” doesn’t exist
- Modern browsers support built-in form validation
- Problem: With controlled React forms, every keystroke causes the form to...
- Just learned about http://a11ysupport.io
- I’m a @Cypress_io fan
- Developer experience (DX) metrics: 1
- Common scenario: A team has two types of tests: 1
- React hooks tip: Prefer primitives in dependency arrays
- Wow - I just converted a React component library build process from Rollup...
- You probably don’t need CSS media queries anymore
- I'm a @remix_run fan
- 🚨 I'm writing a new course
- 4 options for rendering in @nextjs: 1
- I just learned there is a 28,000 km (17k miles) long stretch of fibre-optic...
April 2022
- I enjoyed this "TypeScript tips and tricks" episode with @mpocock1
- Lerna is unmaintained
- CSS Viewport height is complicated
- Are you unfamiliar with Edge hosting
- Wow, TIL why Edge servers use V8 instead of Node
- Many teams say "accessibility is important", but don't actually test...
- 3 ways to split a dev team that is too big: 1
- Woah, just installed Fig
- This CSS reset by @JoshWComeau contains a lot of thoughtful little tricks
- I work with dozens of teams every year
March 2022
- Pairing vs code reviews is often debated
- Just learned CSS has 5 "Layout modes": 1
- 20 reasons to consider @nextjs over create-react-app: 1
- 3 ways to scale a frontend across teams: 1
- My take on micro-frontends: I think it’s important to standardize on one UI...
- 5 reasons reusable components are harder to write than app code: 1
- Using Storybook
- Component design trick: When creating a component, I try to design the...
- An untrusted developer is a net loss
- Stop disabling copy/paste
- 3 technologies that are “better” than React: 1
- For years, I’ve been creating custom mock APIs for each app
- Writing tests first (TDD) is a tradeoff
- VS Code tip: If you're on a project with a lot of files named index, you can...
- Why I avoid naming files "index": 1
- A map object is often an elegant alternative to switch statements and...
- Just used esbuild-runner to speed up an app’s npm scripts, written in TypeScript
February 2022
- 5 key developer skills: 1
- Just learned about the void operator in #JavaScript
- Just learned about Ky, an elegant alternative to fetch or Axios
- Which initialization pattern do you typically prefer
- I don't generate mock data
- Habit: When declaring REST API response types via #TypeScript, I only...
- I often implement React components via 6 files: 1
- In theory, it would be nice to write JavaScript web apps that don't need to...
- Here's an interesting browser state solution: A database, written in JS,...
- 8 ways to potentially speed up JavaScript project builds: Build tools: 1
- An interesting new collaborative software architecture: local-first...
- #TypeScript type narrowing: Use a truthy condition to remove null/undefined...
- How I use #TypeScript with #Node today: 1
January 2022
- New React 18 APIs: createRoot - replaces render startTransition - for low...
- I believe in storing developer-oriented docs in the repo
- I just created a custom Link component
- Why software development is so satisfying: We accelerate slow processes
- A little code review habit I appreciate: When my teammates make a minor...
- Why I use a backend for frontend (BFF) for most SPAs I build: ✅ Better security
- Just published
- Just learned about devcontainers
- Rapid development checklist: Clear requirements Small tickets Mock APIs CI...
- When I started programming, I feared I could never remember it all
- 10 reusable component mistakes: 1
- To me, the best thing money can buy is freedom
- TIL this is valid #JavaScript: onClick?.(); I'm familiar with optional...
- Four frontend trends I'm seeing in 2022: 1
- 3 dev team tasks, ordered by priority: 1
- Has anyone created a comparison of @nextjs be @remix_run yet
- 10 reasons I recently switched an app from create-react-app to @vercel...
- Just switched an app from create-react-app to @vercel Next.js