Recent
Porting a Create React App application to Vite Pt. 2: Unit Testing
·2376 words·12 mins
Project Architecture
New Tech
configuration
testing
NodeJS
For unit tests we will still be using the excellent Testing Library, but we will swap Vitest in place of Jest. Vitest promises Jest compatibility without having to duplicate a bunch of configuration to get Jest to function correctly with a Vite project.
Porting a Create React App application to Vite Pt. 1: Base Project
·1868 words·9 mins
Project Architecture
New Tech
configuration
NodeJS
As of this writing, Vite promises a faster and more performant developer experience over the tried-and-true Create React App template. This is my experience porting one of my vanilla projects to Vite.
Redux Powered Notification Pipeline Pt. 2: Toasts
·1875 words·9 mins
Development
User Experience
TypeScript
Redux
UX
Alerts tend to be for sticky messages that I want to ensure the user must actively engage and dismiss. Toasts, on the other hand, are used for quick, something-happened style messages - the information is there for the user to pay attention to, or not, as the message will disappear on its own in a few seconds.
Redux Powered Notification Pipeline Pt. 1: Alerts
·2764 words·13 mins
Development
User Experience
TypeScript
Redux
UX
Timely and relevant feedback from application events is critical to maintaining user engagement. Two standard ways of delivering immediate event feedback are through the use of alerts and toast messages. To avoid a lot of boilerplate markup popping up all over the project I wanted to make it as simple as just dispatching an action such as “dispatch(errorAlert('your call cannot be completed as dialed');” and have the alert appear on the screen.
Switching to Fetch API
·932 words·5 mins
Development
TypeScript
Optimization
API
Native API
Fetch
Axios
I have finally made the decision to let go of one of my favorite NPM packages, Axios, in favor of modern browsers' Fetch API. I want to be clear up front - I find nothing wrong with Axios, it is an extremely high quality package and a natural progression having used Angular’s http service that it was originally based upon.