Problem: QR codes are a great way to share URLs fast, but typically QR codes are generated from a URL then printed, which actually takes a lot of time.
Solution: print QR codes first, and then let users assign a URL to them.
Timeline: I built this over a couple of weeks in November-December 2023. I had friends review my code, and offer tips when I was stuck.
Stack:
- Front-end and back-end in NextJS using TypeScript
- Flowbite for components, React and TailwindCSS for layout and interactions
- MongoDB for database
- Hosted on Vercel and Mongo Atlas
- QR codes themselves are generated with a Python script (call MongoDB to create short URLs, bulk generate the QR codes themselves, create a letter-sized print file with crop marks).
- Codes are printed on an Epson P700 and cut by hand.
Considerations:
- Originally I built the app in Node.js with Express. The rationale was to keep something very simple and fast. It worked great, but it was a pain to build even a simple UI without React. I chose to rebuild it in NextJS primarily because I wanted to learn it, but also because I anticipate adding a log in for editing QR code URLs, and while it's all very possible with just Node, it's much easier to manage it with one process and few external libraries.
- I chose MongoDB because I want to try NoSQL, and the data structure is so simple there wouldn't be much of a down side to using it.
- I know server-less is not a good option for hosting a redirection service, because it's slower to wake up, and does not maintain a connection with the MongoDB. I had issues deploying my docker container via SSH on a VM, but I will eventually move it.
- I am using Python for generating the print files for a few reasons. First, the available libraries for generating QR codes and PDF files are more interesting. Second, I wanted the code that can create new short URLs to be completely private and separate from the public-facing app that can only assign URLs to existing codes. I don't anticipate needing to connect the two, because the stickers need to be printed which requires some prep work on my local machine.
Codes are available for purchase on Small Batch.
