Prototyping with ParcelJS & Netlify

Sunday, February 02, 2020

TLDR; If you're looking for a quick way to spin up a React prototype, clone this repo:

I recently started experimenting with parceljs as a development tool and bundler for proofs of concept that I create with React. Until now, I've been using create-react-app for prototyping, but it's a little heavy for that purpose. Don't get me wrong, it's a great tool, but is kind of like using a sledgehammer when what you really need is a tack hammer, and is better suited to the development of full applications.

Inspired by Marcy Sutton, I started prototyping using her github repo as a base, with a few customizations of my own. The next step in the evolution of my process was to get the resulting code online! The quick and easy solution to that was found in Netlify.

I absolutely ❤️ this! I can quickly set up a repo with my scaffolding, create a prototype, and have it online within minutes. Updates are published almost instantly - just push a commit to your repo, and Netlify publishes the changes (usually in under a minute).

I've begun using this for more than prototypes - but for fully fleshed out site features, such as the pass-words generator that I wrote a few years back using vanilla js. Insert blurb here about being embarrassed by code you wrote years ago. It stopped working a while back (for reasons I've yet to investigate). I decided to re-code it in React, and you can see the result here:

One of the best parts of this workflow is that from zero to working online prototype, the overall cost of this setup is zero! That's right - no cost, other than time.