[Project] USA License Plates

As an incentive to get outside, our family started a shared note to keep score on the number of slug bugs, fiats, and vanity license plates we've seen while out and about.

Once the kiddos started noticing license plates we got interested in keeping track of those, too! How many of the 50 license plates could we find in our time together?

I'd wanted to experiment with a "standalone" web app, some type of client-side storage solution (localforage), and WebC. I didn't have a ton of time to hack something together and I committed a cardinal sin and purchased the domain name first, so I had to get going.

I had a flat .json file of all 50 states and added it to my eleventy global data. I then created a component to list all the states which maps the states' names to a child component that displays a checkbox and a label.

After adding a manifest.json and finding a few quirks in Apple and Android's standalone web app meta tags and generating what felt like 50 icons.

The storage solution was pretty straightforward. When a checkbox is checked, add the state as the key and the value as true. When the checkbox was unchecked, remove the key.

I could then use localforage's length api to show how many key-value pairs were stored.

A side-project worth blogging about and I'm sure I'll be adding more to it later.

You can try it at https://50licenseplates.com/, view the source code on Github, and don't forget to ADD IT TO YOUR HOME SCREEN!

Of course the day I say I'm finished with this for now I see a license plate from Quebec. Thanks, Canada. 🙃

Resources

• Meta Theme Color and Trickery