Recent posts

Add visual testing to your React app with Storybook

March 31, 2020  7 minute read  

In my last article, I started a React app from scratch, then integrated Parcel as the bundler, TypeScript for language support, SASS, ESLint for linting the code, and Stylelint for linting the style sheets. I didn’t include any testing capabilities, so that is next on my agenda. Let’s write a simple component to get started with testing. The component takes an “isBusy” flag. If it is true, then one icon is displayed. If false, a different icon is displayed. I’ll use text nodes in this v...

Building a React app with Parcel, Typescript, SASS, and ESLint

March 29, 2020  9 minute read  

create-react-app (CRA) is great for getting started super-fast. It has just about everything you need for building all but the most demanding apps. It is, however, opinionated in how things get set up, and I’ve been chafing at the limitations for a while. You can’t alter the tsconfig.json except in some non-important ways. It uses webpack underneath, and that is unchangeable. It uses jest and testing-library. Changing this is a pain. There are even packages that rewire the CRA so...

Introducing Zwift Routes - my latest app

March 13, 2020  5 minute read  

I wrote an app for figuring out which routes I need to ride on Zwift so that I can collect a badge. It’s optimized for a phone device (since that is where I used it). You can use it for free. Where to get it. You can find it at Zwift Routes or http://bit.ly/zwiftroutes. Point your mobile phone browser to the site, then pin the site to your home screen. How to use it There are only two screens - the list screen and the details screen. At the top of the list screen is a menu button th...

Integrating Microsoft Login and MSAL with React and Redux

March 06, 2020  9 minute read  

I have a new app I am working on. It’s sort of a 1990’s style text MUD, but I’m bringing it “up to this century” with a host of new features. I’m writing the first front-end in React. So, what does a modern MUD app look like? Well, I’m not into storing usernames and password any more, so I’m going to use a Microsoft OAuth service instead of a user database. My front end application handles state through Redux. Configuring Redux I’ve got a store set up as follows: import { applyMiddlew...

Pre-build steps for Flutter using Visual Studio Code

February 20, 2020  2 minute read  

Flutter is not a build system. I know, it’s a terrible way to start, but you have to accept that you need to produce a build system for Flutter. There are build systems written in Dart (such as this one), and I’m sure this situation will get better, but right now? There isn’t a good build system. So I use the node package manager. Here is my basic flow: Run npm init -y. Edit the produced package.json file to use flutter under the covers. Run flutter with npm start instead of the ...