Compose update: Oct 2021
Oct 2021 · All Compose Updates
Hello friends,
TL;DR - We're reorienting ourselves around junior React developers, with a scaffolded progression of increasingly powerful backend tools.
Compose 0.1 = đź’©đź’©đź’©
I started this month by pushing the Compose-as-React-hook prototype we came up with last month, and then building the "real world" Medium clone with it. Demo here, and source here.
Sadly, I didn't enjoy using the tool. This was a big bummer. Most of the friends I showed it to were also very negative on it. "But how does it X, Y and Z?"
Given how far we pivoted from our original dream, I started seriously considering scrapping this entire approach, and starting over. There are so many competitors (dozens!), that I started a thread of threads to keep track of them all. How can we hope to compete?
Luckily I had Alexander Obenauer to help restore my confidence, and Geoffrey Litt to help me see a path forward with people learning to code. It meant a lot when he said something like, "My cousin is learning React now, and this tool is how I'd want him to learn backend." Finally, my parents pushed me to stop procrastinating, and start talking to some users!
User Interviews
Thanks so much to the brave souls who gave me an hour or two over video chat to review various Compose prototypes!
https://twitter.com/stevekrouse/status/1449756258626674693
Call #1 Take-away: We absolutely need a 1-click way to try it out. Need to better communicate what's happening, and why it's better than just Firebase, via a diagram:
Call #2 Take-away: Need to simplify it further from useRealtimeReducer for users who aren't familiar with Redux:
Call #3 Take-away: useRealtimeState is learnable in minutes, even by beginners! Finding a way to explain when to switch to useRealtimeReducer is the new challenge. Also: can we find a way to communicate the wow-moment of it working in two tabs via a GIF?
Scaffolded Backend Educational Path
If we focus on lowering the floor (thanks Lee Edwards!) for junior developers, we can have a scaffolded product offering that grows in tandem with the user's understanding and needs. I think of it like in a video game (thanks Bharat Mediratta!) where a user gains more powerful swords or spells to fight bigger and badder monsters.
- Instead of jumping head first into SQL, GraphQL, Rails, or Firebase, start by simply adding the wordÂ
Realtimeto yourÂuseState hook. - Authentication is a two-line drop in.
- AddÂ
useRealtimeReducer for more complex state and controlled writes. - AddÂ
useRealtimeQuery for controlled reads. - Maybe: Auto-index via AI for scale.
- Maybe: Add a partition to scale. Use a database-backed ORM to scale to the moon.
I remember struggling to learn BackboneJS, MeteorJS, Rails or Firebase simply because they were the only option that made any sense to me at the time. I've heard that this experience is common. However, I don't think the creators of those tools (with the exception of Firebase) were concerned with the junior dev market. Almost all of the competitors I aggregated in my thread of threads are deep into GraphQL or SQL and other sophisticated abstractions that beginners won't even understand the need for. They're selling to senior developers (where the money is), which leaves us the opportunity to sell to the much larger (albeit less lucrative) junior developer market, with the hope to grow with them. This is like Amjad Masad's strategy at Replit: start with kids and grow with them until they start companies.
Our pitch is a whole backend without leaving React
Click on this template or npm install and your app is already realtime — with abstractions you already know. When you need a more powerful tool, we've got that too. And by then you understand the need for it.
No need to create an account, configure tables, or anything in a clunky admin panel. Just get coding. Eventually, we'll ask for your email in the JS console to setup your developer account, but we won't let that get in the way of what you're trying to do. We bend over backwards to keep you in the flow of making your React app.
Compose 0.2 MVP: useRealtimeState
The MVP for Compose 0.2 is just the first step on the progression: useRealtimeState. It's basically a simple "cloud variable" that anyone can set or get. The initial version will also test out the account-creation-over-the-JS console, so we can contact our early users. I think this is launch-able on HN or PH to get some real feedback and kickstart the community. We'll have to be honest about its drawbacks:
- Whoever sets state last wins, so you can lose data when edits come from two places at the same time.
- It is 100% public and insecure.
- All the realtime state must fit entirely within the user's browser.
- In short: it's for a small personal or hackathon project.
Next steps
Adriaan is taking a couple weeks of much-needed vacation, so I (Steve) will be pushing on this solo next month. Let me know if you or someone you know is looking for a project next month (and maybe beyond). Here's what I'll be up to:
- MVP Landing page
- Docs revamp, tutorial, GIFs, video demos
- Compose v0.2, off of Firebase
- Setup a Slack or Discord
I think a launch before the end of the year is possible. Now that I've spoken to three potential users, I can't wait to meet more!
Thanks for reading! Please reach out with questions, comments, intros, whatever. More soon ~
Steve & Adriaan
PS - You can peruse all past updates here.