I’m literally laughing as I type this. I completely missed the mark on my fourth project and I’m running almost 2 weeks late! It was all avoidable and completely my fault.
With that said I’m not even mad, this month was super fun 😁 Let discuss what happened.
So far I’ve built 3 projects that I thought other people wanted to use. This month I decided to change that. I wanted to build something that I want to use.
The idea? Design capture and inspiration.
Ever since I started programming I’ve been collecting designs that inspire me. When I find a nice site I bookmark it. When I see a cool graphic I save it.
Over the years I’ve gathered a beefy collection that I can browse through when I need design inspiration. The problem is that everything is disorganised and hard to visualise.
My goal was to fix this.
I wanted something that lets me do two things: capture webpage elements and pages + store them online and browse them visually.
Panda Snap is the product I’ve come up with. Like I said it almost finished but I’m still polishing things up 😅
It comes in two parts: a browser extensions to ‘snap’ (capture) inspiring images and a site to browse your collections.
I honestly can’t wait to start using it myself.
This component integrates with your browser to seamlessly snap images as you find them. It has 3 ways for you do this this:
Once you snap an image you simply save it and it’s stored to your personal collection!
This component allows you to organise and browse your image collections. It’s where you go to all of your future inspiration! As you can see it’s designed to be visual for you can find images you like quickly.
I’ve build extensions before but with jQuery and vanilla JS. This time I wanted to try something new and use Typescript + Preact to match my website frontend stack. It works well!
I also found a great library to enable promise-based API calls between the various extension components.
One issue I had in production was with authentication. During testing I was able to share the auth cookie but this hits a ‘Referrer Policy’ issue over HTTPS. I’ve had to switch to token based auth via the REST API.
This bring me to the first of many mistakes and lessons learned this month:
The server is built with Django, deployed on Heroku, and makes use of these technologies:
On the frontend I use Django’s server side renderer 90% of the time with a sprinkle of Typescript + Preact for dynamic stuff.
This was my first time using the rest framework and it’s pretty sweet! It comes with a browsable API and has been nice to work with.
It was also my first time setting up Stripe payments. It seemed complicated at first because of how many ways you can integrate it with your server. It doesn’t help that every tutorial seems to use a different method.
I ended up following Stripe’s documentation and things were quite easy in the end.
The first mistake I made - and I’m not sure why I keep doing this - is that I left deployment till the very end. This meant I discovered numerous issues with my app just before launch. Some prod issues I had were:
I’ll reiterate the mistake I mentioned before:
Secondly - and perhaps this was an issue with building for myself - is that I built too many fun things. I was building not shipping.
I also focused too much on the details. I was tweaking animations, adding in little features here and there, and the result is a 2 week delay. So the second lesson of the month:
This also means I haven’t tested it with anyone yet. I’ve posted regular video updates but it could have horrible usability issues and I wouldn’t know.
“Ship fast and early” is my big failure this month.
If you read last month’s post you’ll notice that I made the same mistakes as last month 😅
I think the reason is because I started building without setting goals. I relied on a big fuzzy ‘finish this month’ type goal and lost focus of the important tasks.
So going forward I will reuse my tried and true method of setting intermediary goals. These goals will be:
I tried something new this month by building more openly. I did this in two ways:
The progress page didn’t go so well because I forgot to update it most days 😬 but it was nice a personal diary of sorts though.
YouTube on the other hand was fun and I’ll keep going with it. I tried a few different styles of videos (like long coding sessions) but I’ve settled on shorter updates with high-level code overviews. I also couldn’t get live streams to work with my internet sadly.
Here are some things that surprised me with this experiment:
Overall it was a worthwhile experiment.
Something I’ve been lacking recently is focused learning. Too often I read in bed at the end of day, when I’m tired, and not in the learning mood. I also can’t take notes from bed and end up forgetting a lot.
So this month I dedicated time in the mornings to read before starting work - it’s so much better! I’m way more focused and can take a ton of notes.
I also feel less distracted by coding problems as I don’t start coding until after my learning.
So if you would like to learn/read more but don’t feel like you have the time then:
The best thing I read this month? The Mom Test. It’s a really useful book and I hope to start using the techniques this coming month.
Well that’s it for this month’s update. Catch you next time 👋