Building web apps without a SPA - A case study
Now this might not always be fair. I’ve done a fair amount of web development and there is definitely a time and a place for a SPA. And rendering libraries like React make client side work an absolute pleasure. But that’s not what I’m going to write about today. I’m going to write about all the other cases. Or as I like to call it, 73.6% of the internet.
My fiance is studying to become a veterinary physiotherapist. She has to learn a lot of animal body parts. She’s picked up a few books along the way to help her memorise various animal parts that normally look something like this:
Ladies and Gentlemen, the canine
I took a look at the content she was studying and thought it would probably be handy if we could put all those pictures into a little quiz app so that she could test herself. After a bit of requirements gathering, it was decided it needed to support:
- A group management system to share profiles with others
- Referencing and tags
- Some way for her to upload pictures and map body parts
- Quizzes (of course!)
To keep it simple, we added two types of quizzes. The first kind points to a body part and asks you to choose what limb it is. The second kind of quiz names a part and asks you to select it on the picture. All you need to do is first prepare quizzes by uploading images and selecting the limbs.
This is what is ends up looking like:
And here is what a quiz looks like:
Nothing about this is particularly complex. I probably took around a day or so in total to add everything we wanted. I worked fast and loose and skipped automated tests because I don’t plan to work on it further (and most of it is CRUD operations).
What I would like to emphasize at this point is that I’ve seen many projects with a similar scope become a React/Angular/Bitcoin app. There are a few reasons I can think of (off the top of my head) for this:
- The developer would like to learn a new stack (nothing wrong with this!)
- The developer uses it out of muscle memory
- The developer wants to create an app like experience and things this will result in faster performance
I have no issue with the first reason. I also don’t have an issue with the second reason when you just want to get something done fast and you’re comfortable with a way of working. What I would like to question however is the third reason.
Here’s what it ends up looking like in action:
Disclaimer: I haven’t given it a go yet because it’s still in beta but the basecamp team has moved onto Turbo which is supposed to replace Turbolinks.
As always you can find the code here if you want to take a deeper look: