From servers to no servers to serverless, what’s the difference and how does it impact how the client gets data? — Servers to No Servers to Serverless In the beginning, there were servers. The servers roamed the wild, waiting for clients and their connections, and when a server received a connection it would pounce. The servers liked the connections and held on to them, guarding them closely. Thus the traditional web app was born.

A highly opinionated set of rules, based on Atomic Design principles, to make sure your components stay organized. — This is a quick reference guide to the rules I use for organizing components when building a React application. I have found that having a well-defined system helps not only with organization, but also helps better identify how components fit together and maximize reusability across the codebase.

A practical guide to developing component-based sites and apps around the Atomic Design methodology. — Organizing your application (or app/site, I’ll use these interchangeably) can seem easy. A folder for components, one for assets, another for utility methods. Maybe even a separate folder for pages! Don’t be fooled, it is almost never that easy.

This article is for anyone testing npm packages locally and who has struggled (or is struggling) to get to projects connected via npm link. …

Configuring authentication with Azure B2C in Next.js is not a particularly straight forward process. We’ll look at how to facilitate this using the NextAuth.js library. Authentication with Azure B2C and Next.js Authentication with Next.js is, at least for me, a bit of a nebulous problem, especially if development requirements are not 100% solidified. Since you have…

A comprehensive step-by-step guide to configuring Jest, React Testing Library, ESLint, and Path Aliases in a Next.js project. — Update: 03/08/22: Next.js 12 is virtually identical in terms of getting things set up. I’ve made a couple updates here including the use of the src directory, and a few minor changes to the ESLint ruleset and the Jest/React Testing Library based on my updated preferences and new best practices…

Using Rollup, Babel, and React we’ll look at why & how you might abstract a third-party component library to create your own component library. — Component libraries are useful. They allow developers to add features quickly and with confidence that they will have consistent style & functionality. Libraries may be built in-house or by a third party. …

Expose your React Navigation navigators for simple state sharing between any child screens in React Native. — Update 1/7/2020: Please note that this was written with Expo 32.x & React-Navigation 3.x. I believe the same general ideas apply, but due to changes (modularization in particular) in the packages the code as-written will not be exactly the same. Update 6/14/2021: React Native links updated to point to 3.x documentation.