A shorthand way with jest.mock() to auto-mock all functions in a JavaScript module yet use the real implementation of one function
How to configure semantic-release to release one-off test branches in an app in order to test dev code prior to merging a Pull Request
How to include test and other non-page files next to page components and API routes within the pages directory in a Next.js application
A journey explaining how digging into 3rd-party code helped provide clarity & find a workaround to a tricky problem
How to resolve the server mismatch error when hydrating a shared React component that can be used in client-side only or server-side rendered apps
How to create complex conditional generic type expressions in TypeScript that can even be recursive
Using type predicates to help TypeScript narrow an ambiguous variable to a specific type
5 categories of best practices for testing components with React Testing Library based on the ESLint plugin
A practical breakdown of when to use interfaces versus types when defining TypeScript object types such as React prop types
How to create a custom Link component that combines the Next's Link component with one from a UI component library like MUI
A deep dive into the various tools that an engineer sets up & configures while maintaining the web frontend infrastructure
Using TypeScript generic utilities to better understand constraints, conditional types and other generic type features
Reasons and steps to follow to create React custom Hooks by extracting component logic
Examples for when using the useCallback and useMemo React Hooks are helpful in reducing component re-renders
How to avoid the exhaustive deps ESLint error by properly using JavaScript async functions within the React useEffect Hook
8 operators that help us write more concise & accurate JavaScript code
How to add a gradient along an SVG circular arc path to create a loading spinner
8 different approaches in JavaScript for creating a shallow copy of an array
Learning how to use TypeScript generics by re-implementing common functions from lodash
How to properly type polymorphic React components using forwardRef in TypeScript
How to use environment variables to initialize the Firebase Admin Node SDK with the private key instead of using the JSON file
A look at common, non-destructive operations using the JavaScript Array API
Re-implement zip, keyBy, sum and other lodash functions in order to learn how Array reduce works
Learn the JavaScript Promise static methods like Promise.allSettled, Promise.any, and others through real-world use cases
How to use automated tooling to catch accessibility issues in a web application built with React, Vue or other JavaScript frameworks
How to configure Jest to fail tests on console warnings and errors
How to create a custom React Hook that allows components to be both controlled and uncontrolled just like form elements
Tips & tricks for reverse-engineering function, object & array TypeScript types from 3rd-party libraries that fail to export them
Explanations & advice on how to choose between advanced React UI patterns like polymorphic components, render props, compound components and others
How to use Next API routes to create an always up-to-date sitemap for user-generated dynamic routes
How to use vanilla JavaScript to loop within JSX of a React component
6 approaches for conditionally rendering JSX markup within a React component
Setting up Cypress end-to-end testing in Github Actions for Next.js apps using Firebase Local Emulator Suite
How to represent an imported function in TypeScript that has been replaced by a Jest mock
A collection of Visual Studio Code extensions package management, code editing, formatting & validating and more
How Next provides the best of static-site generation (SSG), client-side rendering (CSR) & server-side rendering (SSR) for React apps
Reducing our reliance on Lodash by leveraging ESNext APIs to transform objects and arrays
Use Promise.race to add timeout support to the Fetch API
A React custom Hook wrapping the Clipboard web API to enable a copy to clipboard UX
Surprisingly shorthand JavaScript code for converting an array into an object lookup
A helper to convert TypeScript types for a React component library into PropTypes for legacy JavaScript apps
How to create a React custom Hook that wraps useReducer to persist state to localStorage
How Mixins are surprisingly similar to custom Hooks for sharing stateful, non-visual logic
Suggestions for configurations to ESLint, Jest & TypeScript to prevent codebases from being riddled with warnings, errors or false positives
Implementations & explanations for custom React Hooks like usePrevious, useMedia, useDeepCompareEffect & more
How to integrate Prettier into ESLint so that you'll never have to think of code formatting again!
Four strategies for ensuring that React components don't update state after they've been unmounted
Cases where TypeScript const assertions help avoid type errors with union literals in objects and more
How the unknown type in TypeScript helps avoid using the any type for variables we don't know the type of
Four options for optimizing the useEffect Hook with object or array dependencies in React
How to avoid breaking Hooks rules when conditionally calling a custom React Hook that you can't modify
How to avoid using if statements when sorting arrays by multiple keys in JavaScript
The 10 most important modern JavaScript features that will take your React skills to the next level
How to avoid receiving the TypeScript any type from the Fetch API when retrieving JSON data
How TypeScript user-defined type guards can remove undefined or null types with Array.filter
How TypeScript discriminating unions provide type safety to the useReducer hook
How to use TypeScript generics to create data-agnostic React components
How to define strongly-typed React components that can inherit props from arbitrary HTML elements
Using TypeScript to only allow a React prop to be set when another has a specific value
How to use the kill-port package with npx to stop the process running on a given port
Four options for dealing with helper functions listed as dependencies in the useEffect hook
How making use of useState lazy initialization can speed up your React function component
Thoughts on how developers prioritize flexibility when using your JS component library
A way to successfully mock the locked Location object from jsdom in Jest
A small configuration you can add to Jest to reduce false positives for async tests
How to use Enzyme to test UI updates after asynchronous events in React components
The best way to learn React depends on how you learn best
A guide comparing React Prop Types to their equivalent TypeScript definitions
Code snippets on how to hook up Bugsnag into a Gatsby app and enrich the integration through Netlify
Analyzing a potential future feature of JavaScript that could make testing object contents much easier
A plan for new software engineering grads to focus on gaining depth in a single technical area to help grow their career
The rationale behind and explanation of my new venture to offer short, remote-only workshops called "minishops"
My opinion on the key pieces that make up a design system and high-level overview of how to go about building one
Why I decided to redesign benmvp.com from being a blog site to being a site that contains a blog
A quick look at how nested string interpolation within template literals is possible with ES6
How to create a screenshot of a DOM element in Chromium-based DevTools
How to use react-jsonschema-form to automatically render a form based on JSON schema
Some reasons why I choose React Testing Library over Enzyme for testing React components
A quick overview of the newly implemented useOpaqueIdentifier hook and when you would want to use it
I just found out that I've been accepted into the GDE program for Web Technologies!
A quick look at using ES6 to solve "common-ish" tasks in JavaScript