Epic Web Dev Articles by Kent C. Dodds

.toBeVisible() or .toBeInTheDocument()?

A deep dive into Testing Library's .toBeVisible() and .toBeInTheDocument() matchers, exploring their differences, use cases, and best practices

The Power of Principles in Web Development Decision-Making

Discover how The Epic Programming Principles can transform your web development decision-making, boost your career, and help you build better software.

Why I Won’t Use JSDOM

Explore how JSDOM's browser simulation works, and learn front-end testing approaches using Vitest Browser Mode for direct browser testing and native APIs

Testing Accessibility with Screen Readers

Dive into the world of screen reader testing and discover why relying on a single tool isn't enough. Create genuinely accessible web apps that work for everyone

The Difference Between Clearing, Resetting, and Restoring Mocks

Understand the key differences between mock state management methods: mockClear(), mockReset(), and mockRestore(). Write clean test states.

Writing Tests That Fail

There can be a lot of confusion and doubt when it comes to writing tests. Answering this simple question may help clear a lot of it out.

Inverse Assertions

Learn how to test time-dependent side effects that should not happen. Avoid false positives by using inverse assertions.

Testing Accessibility with the Keyboard

Learn how to improve keyboard accessibility in web apps, ensuring an inclusive experience for all users, including those using assistive technologies.

Tips and Techniques for 'Pixel Perfect' Figma to Tailwind CSS Conversions

Master converting Figma designs to Tailwind CSS with near "pixel perfection". Learn HTML structure, design tokens, layouts, responsive design, and animations.

Unleash the Designer in You (with Tailwind CSS)

Explore how Tailwind CSS fosters collaboration between developers and designers, enhancing UI design skills with utility classes and shared principles.

Be S.M.A.R.T. About Flaky Tests

Flaky tests undermine trust. Use the S.M.A.R.T. framework: Skip, Mitigate, Assess, Rewrite, Throw away, to manage and fix them effectively.

What Is A Test Boundary?

Learn automated testing essentials: prepare code, execute actions, verify outcomes. Discover the importance of mocking and setting proper test boundaries.

Your code style does matter actually

You may be babysitting JavaScript syntax. It's annoying and you don't have to. Fix your formatter!

Good Code, Testable Code

Learn what testability means, how it relates to code complexity, and why it's essential for effective testing.

Skip SDKs in Simple Integrations

When dealing with APIs, SDKs can lead to cognitive overhead and complexity. Make sure the SDK is worth the trade-offs.

Embracing Slow Networks: Improving User Experience

How web devs can tackle high latency networks and enhance UX and the role React Server Components plays in this.

TypeScript: What’s the Point?!

TypeScript elevates JavaScript with static typing, offering scalable, maintainable code despite initial challenges.

What is a Superset (in programming?)

Supersets like TypeScript enhance languages with benefits like error detection, code consistency, scalability, and improved tooling for devs.

Implicit Assertions

Have a better understanding about the explicit and implicit assertions now, and perhaps even have a test or two in mind to improve.

Making Use of Code Coverage

Dive into the contentious world of code coverage. Learn its nuances, pitfalls, and practical applications for modern web app testing

Anatomy of a Test

Explore the analogy between learning human anatomy and writing code tests, emphasizing a universal three-step structure: Setup, Action, and Assertion.

The Golden Rule of Assertions

Learn about The Golden Rule of Assertions that helps pinpoint good tests from bad ones.

The True Purpose of Testing

Discover the true essence of automated testing and the difference between an implementation and intention.

Stop Lying to Your Users

How the Epic Stack Makes You Faster

Streamline web choices, build top-notch apps efficiently.

Why you should probably be using SQLite

What does “Full Stack” mean for Epic Web

Accessible, Typesafe, Progressively Enhanced Modern Web Forms

Learn how to use modern tools that offer the best user and developer experience for web forms.

The Epic Stack

Introducing an opinionated project starter that enables web development teams to ship their ideas to production more efficiently.

Full Stack Components

There’s this pattern I’ve been using in my apps that has been really helpful to me and I’d like to share it with you all.

Fully Typed Web Apps

The main thing that makes end-to-end type safety difficult is simple: boundaries. The secret to fully typed web apps is typing the boundaries.

The Web’s Next Transition

Web is made up of technologies that got started over 25 years ago. Now, we are transitioning to a new and improved architecture for building web applications.