
[It's been 6 months](/posts/hello-convex) since I joined Convex as a Developer Experience Engineer, so I thought it was time to share what I've been up to and how things are going.

# What Is Convex Again?

Quick reminder: Convex is a developer-focused database and cloud compute platform. Think Firebase, Supabase, AWS, that kind of thing.

I decided to join them because [some time ago](https://mikecann.blog/posts/tinkering-with-convex) I fell in love with their solution and [started shilling it](https://mikecann.blog/posts/im-now-a-convex-developer-advocate) at every opportunity.

When Gangbusters [unfortunately ran out of funding](/posts/hello-convex#whats-happening-to-gangbusters-battletabs), I thought I'd push my luck and see if they'd take me on, despite living on the other side of the planet.

After a few rounds of interviews, they brought me on as a trial... and well, I haven't been fired yet, so I think I'm doing okay :)

# What have I been doing?

When I joined, I knew roughly what the role entailed: creating content to attract new developers and help others understand and thrive with Convex.

What I didn't know was exactly what content I should be creating.

I started by writing a few blog posts (Convex calls these stack posts):

- [Convex: The Database that Made Me Switch Careers](https://stack.convex.dev/convex-the-database-that-made-me-switch-careers)
- [Code Spelunking: Uncovering Convex's API Generation Secrets](https://stack.convex.dev/code-spelunking-uncovering-convex-s-api-generation-secrets)
- [6 Tips for improving your Cursor Composer and Convex Workflow](https://stack.convex.dev/6-tips-for-improving-your-cursor-composer-and-convex-workflow)
- [Why Convex Queries are the Ultimate Form of Derived State](https://stack.convex.dev/why-convex-queries-are-the-ultimate-form-of-derived-state)

These were great, but since plenty of other folks at Convex were writing high-quality blog posts, it was suggested that I start making video content for [their YouTube channel](https://www.youtube.com/@convex-dev).

Despite having virtually no experience making educational videos, I dove right in.

At first, the videos were pretty rough...

<iframe width="560" height="315" src="https://www.youtube.com/embed/ydofb8pR6uQ?si=L1QKQacEt6C6jPl_" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>

The lighting was terrible, the framing was bad, and the text on screen was too small, not to mention the various audio issues and artifacts.

Over the next few months, though, I steadily upgraded my setup and process.

<iframe width="560" height="315" src="https://www.youtube.com/embed/cZMVQGJTNXo?si=R5hTxg095Bnz8boG" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>

<iframe width="560" height="315" src="https://www.youtube.com/embed/Q-aX5PoUqNk?si=CGYUwlekFmATB0zY" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>

<iframe width="560" height="315" src="https://www.youtube.com/embed/dlpLgvSbz58?si=b9q2hl2YLQjnLBcp" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>

So far, I've created 17 long-form videos, 11 short-form videos, and 5 stack posts.

If you're interested, here's where I'm tracking it all: [https://mikeysee.notion.site/Mikes-Completed-Convex-Content-1fafd70ecfa080c7814bf5239168530c?pvs=4](https://www.notion.so/Mikes-Completed-Convex-Content-1fafd70ecfa080c7814bf5239168530c?pvs=21)

I should mention that I've also been doing some non-content work: documentation, fixing and upgrading features, and customer/community support. But content creation has been my main focus.

# Things I'm discovering about myself

This position has pushed me way out of my comfort zone. For 6 years at Gangbusters, I was in my happy place, just sitting at my keyboard, coding away, barely talking to anyone.

Now I have to be more charismatic and dynamic on camera. I need to think on my feet, explain things clearly yet concisely, and keep it entertaining. It's a lot to juggle when I'm used to taking my time with problems.

I catch myself comparing myself to other content creators like [Theo Browne](https://www.youtube.com/@t3dotgg), [Web Dev Cody](https://www.youtube.com/@WebDevCody), or [Primeagen](https://www.youtube.com/@ThePrimeTimeagen), but I'm slowly realizing that I don't need to be like them, and that's okay.

Theo's ability to pump out content while working full-time is phenomenal. I'm in awe of how he confidently explains complex topics while keeping it entertaining, all at a pace of one video per day.

I'm currently aiming for 2+ videos per week. My videos typically involve research, script writing, coding, filming, and editing.

The research and coding feel natural and fun, as they should, given my career background.

The script writing and filming, however, are more challenging.

There are two main approaches: either script everything and read it back, or write brief notes and ad-lib.

While I don't mind scripting and reading, there's a knack to making it sound natural rather than like you're reading from a prompter (which I usually am). It's tricky, and I'm still working on it.

Ad-libbing videos leaves me feeling stressed and pressured, worried that I'm not saying what I meant to say, or that I'm rambling, or not sounding confident enough. This is definitely an area for improvement. Maybe more public speaking would help me gain confidence speaking without a script?

# How's the remote thing going?

Well, there are two parts to that question: how's it going for me, and how's it going for Convex?

For me, it's fine. I've been working remotely for nearly a decade, so I'm comfortable with it.

Sometimes I wish I were closer for the bonding and camaraderie, something I loved while working at Playdemic in the UK. That human-to-human contact is harder to replicate over Zoom.

I make an effort to be social outside of work. It takes energy, but I feel anxious and empty if I don't. Not sure if that makes me an extrovert or an introvert 🤷, I just know I need it.

That said, I don't miss the commute and other inefficiencies that come with being on-site.

As for the work itself: I understand that certain positions, particularly in games companies, benefit from in-person collaboration. At Playdemic, many ideas emerged from casual desk-side conversations.

But my current role works well in isolation. I can usually work on videos independently, and when I need input about an unfinished Convex feature, a quick Zoom call usually sorts it out.

As for Convex's perspective on working with someone so far away?

I'm not sure, you'd have to ask them, but I think it's been okay. It's probably frustrating having to schedule late-day meetings to catch me during my early morning window, but overall it seems to be working out.

# Conclusion

I still pinch myself that I get to work for a company I admired from afar for so long. Working at the cutting edge of technology that has driven my whole career is a dream come true.

So even though being a video content creator doesn't come naturally to me, I'm giving it my all and working to improve not just my content production, but doing whatever I can to help Convex succeed.



This is just going to be a quick one to say that I'm super excited to announce that I am joining [Convex](convex.dev) as a Developer Experience Engineer!

If you don't know what Convex is then do yourself a favor and [checkout their excellent site](https://www.convex.dev/) and [docs](https://docs.convex.dev/) but in short its “a sync platform that replaces your backend and client state management.” I half-jokingly describe it as “Firebase for adults”

I am super excited about this role as it means I get to do what I love most; tinkering with and producing content about cool technology.

# Why join Convex?

If you have been following along on this blog for the past year or so you will have noticed me be quite effusive about my love for the Convex platform:

- [Tinkering With Convex](https://mikecann.blog/posts/tinkering-with-convex)
- [Chatter Craft - collaborative art with just your voice](https://mikecann.blog/posts/chatter-craft-collaborative-art-with-just-your-voice)
- [Im now a Convex.dev Developer Champion!](https://mikecann.blog/posts/im-now-a-convex-developer-advocate)
- [Whisper Farm - Parallel Transcription](https://mikecann.blog/posts/whisper-farm-parallel-transcription)
- [Mikebot - The Virtual Me](https://mikecann.blog/posts/mikebot-the-virtual-me)

With 17+ years of professional development experience (yes, I'm getting old!) and a blog spanning over two decades, I've explored countless ways to build projects. After all this experience, I genuinely believe Convex is the best platform for building apps.

If you're curious about the specific technical features that won me over, check out my post: https://stack.convex.dev/convex-the-database-that-made-me-switch-careers

Beyond the technology, the company itself is exceptional. While it's no surprise that former Dropbox core-tech team members are brilliant, what truly stands out is their character and dedication to building [a fantastic developer experience](https://mikecann.blog/posts/tinkering-with-convex).

# What's happening to Gangbusters & BattleTabs?

I have a detailed explanation for leaving Gangbusters that I'll save for a longer retrospective post. The short version is that the company has run out of money. Unlike when we started 6+ years ago, I now have [a family](https://mikecann.blog/posts/joshua-christopher-cann) and [mortgage](https://mikecann.blog/posts/moving-home-and-startlink) to sustain. I chose not to seek additional funding because, honestly, I'm feeling burnt out from working on the same project for so long.

I want to emphasize my deep respect and admiration for my co-founder [Brandon](linkedin.com/in/thebrandonwu/), whose optimism throughout these 6+ years has been truly inspiring. I have so much to say about how great Brandon was to worth with but I think ill leave that for the retrospective.

We're currently figuring out the future of both the game and the company. We're open to all possibilities, so please reach out to [Brandon](https://www.notion.so/Gangbusters-a-Retrospective-150fd70ecfa0801ca372eeadcbf73658?pvs=21) or [me](https://www.notion.so/10ffd70ecfa0800eaf28d8aa2604be10?pvs=21) if you have any suggestions.

The game's community holds a special place in my heart. While players have come and gone over the years, those who've stayed have been one of my strongest motivations to keep developing this game, I ♥️ you guys!



You know what's better than one Mike Cann? That's right, infinity Mike Canns.

![](./infinity-monkeys.png)

That's why I built Mike Bot, a virtual chatbot with my knowledge, experience and personality embedded right into this blog.

![](./how-to-start-mikebot.png)

Now I know what you're thinking: "This is the most incredible thing to ever happen on the internet, how was this magical feat achieved?". Well, let me tell you...

# The Plan

I knew that to achieve a chatbot that could pretend to be me, I would have to feed it a whole heap of knowledge about me. Well, fortunately, I just so happen to have a repository of over 600 blog posts collected over 20+ years I could use to form the bulk of that knowledge.

Next was the meat of the problem: The Brain. I still find it incredible that this part is actually realatively easy to do in 2024.

Thanks [to these Convex posts](https://www.convex.dev/can-do/rag) on the subject, I had 3 different ways I could go about it:

1. [Using OpenAI's Assistants API](https://stack.convex.dev/ai-chat-using-openai-assistants-api)
2. [Using Langchain with our own storage](https://stack.convex.dev/ai-chat-using-langchain-and-convex)
3. [Custom message store and vector search retrieval](https://stack.convex.dev/ai-chat-with-convex-vector-search)

Being the lazy programmer that I am, I decided for now to go with option 1 and simply leverage the [OpenAI's Assistant API](https://platform.openai.com/docs/api-reference/assistants) for most of the hard work.

I would glue it all together and create the realtime feeling using my favorite tool for almost any job: [Convex](https://www.convex.dev/).

![](./convex-hammer.png)

# OpenAI Assistants

First step was to fire up the [OpenAI dashboard](https://platform.openai.com/assistants/) and create the Assistant.

![](./assistant-setup.png)

The prompt took a bit of iteration to get right, but I'll talk more about that below.

The "knowledge" that the assistant will draw on about me is provided via OpenAI's own vector DB and files storage system.

![](./vector-store.png)

Convex does have its own [VectorDB](https://docs.convex.dev/search/vector-search) and [File Storage](https://docs.convex.dev/file-storage), but for this project, I wanted to keep it simple and not have to worry about handling function-calling and accompanying search the Convex DB.

# React Component

Next up was how the user was going to interact with Mikebot. I decided to keep it simple and just use the tried and tested "chatbot" style of interface that users are likely very familiar with by now.

![](./mikebot-widget.png)

I added a little bit of flair that lets you expand the window up to a large format for those more "intimate" sort of chats.

![](./mikebot-expanded.png)

# Convex Glue

Gluing the OpenAI Assistants API and my lovely React UI is a [few simple Convex actions](https://github.com/mikecann/mikecann.blog/blob/main/convex/messages.ts#L22) [that call into the OpenAI API](https://github.com/mikecann/mikecann.blog/blob/main/convex/openai/assistants.ts#L15). The results are [streamed](https://github.com/mikecann/mikecann.blog/blob/main/convex/openai/assistants.ts#L100) into [the database](https://github.com/mikecann/mikecann.blog/blob/main/convex/schema.ts#L55).

Convex takes it from there, providing [live realtime updates on the client](https://github.com/mikecann/mikecann.blog/blob/main/components/mikebot/MessagesList.tsx#L48).

# Prompt Engineering

Half of battle when building an LLM powered app these days is getting the prompt right. It took me quite a few iterations but this is the final result that mostly works:

```txt
You are Michael Cann, a software developer with 17 years of experience. You write about AI, coding, and your projects on your blog. 

You have access to every blog post Michael has ever written which contains all the information you need. You may do the file search to retrieve this information. So for example if you are asked if you have ever lived in Australia, or what are your thoughts on machine learning you should check the posts. 

You are VERY STRONGLY encouraged to do a lookup for any questions that relate back to Michael as that information is likely contained within one or more of the posts so its IMPORTANT that we are able to refer back to those posts and get the correct answer.

Respond in a casual, humorous yet knowledgeable tone. Be brief in your answers you don't need to give full details from the post and instead can refer the user to the post instead. 

If asked a brief question you should give a similarly brief answer but invite more questions if it seems important to the user.

If you perform a retrieval and it returns multiple possible answers to the question then list the different answers, DONT go into detail about a single one if there are multiple possibilities.

If asked, the best way to contact mike is via email: mike.cann@gmail.com.
```

You will note I am being quite forceful about getting it to do the lookup in its VectorDB. For whatever reason, it was reluctant to do that at first. 

For example, if I asked it "Have you ever made a game?" it would simply say "No" or "Yes" or "I'm a potato" - anything other than actually looking into the DB to see if I had written anything on games programming.

Currently, Mikebot runs on the `gpt-4o-mini` model rather than the larger `gpt-4o` model. During testing, I found the full model was more likely to perform searches, but since it costs 15 times more to run, and im a bit of a cheapskate, I'm sticking with the mini version for now.

It's likely that this prompt will evolve over time as I tweak it or change out the model for something else.

# Uploading Posts

Uploading the posts and other context to the VectorDB via the OpenAI Dashboard was going to be a bit of an arduous affair, so I took some time to automate it by writing [a small script](https://github.com/mikecann/mikecann.blog/blob/main/scripts/openai/uploadPostsToStorage.ts) that is run on every build on the CI.

One thing to note here is that it's important [that I name](https://github.com/mikecann/mikecann.blog/blob/main/scripts/openai/uploadPostsToStorage.ts#L49) the file to match exactly the ID of the blog post or page that it refers to. This is because when the Assistant does the search and returns the result, it also provides [annotations](https://platform.openai.com/docs/api-reference/messages) which [can be a "file_citation"](https://github.com/mikecann/mikecann.blog/blob/main/convex/openai/assistants.ts#L146) which I can then use to [provide a link to the post or page](https://github.com/mikecann/mikecann.blog/blob/main/components/mikebot/MessageContent.tsx#L26).

![](./link-to-post.png)

# Conclusion

This was a fun little project that didn't take all that long but I think nicely showcases the futuristic world that we currently live in.

Got feedback or ideas for improvements? Feel free to leave a comment below... or better yet, save us both some time and just chat with Mikebot directly. He's probably more helpful than I am anyway!



I have a confession to make—I have a superpower: the ability to stay in the flow.

![Hero Image](./hero.webp)

Throughout the workday, I'm continually assaulted with potential "side quests."

A friend might send me a message with a link to an article they think I'd enjoy. Bam! New side quest: read the article, formulate an opinion, and reply.

Or I'm reading some technical document for work and suddenly come across a link to something tangential. Bam! New side quest: go down the rabbit hole following links.

Or I'm out chatting with someone about a fascinating topic, and they mention something I should check out. Bam! New side quest: read the article on my phone instead of paying attention to my friend.

Each of these side quests, although potentially fun, inevitably pulls me out of the "flow" of whatever I was doing, disrupting my most productive self.

So, what is my superpower? It's a practice or tool I've been a fan of for a long time...

## Save It for Later

[Pocket](https://getpocket.com/) (initially named "Read It Later") is a simple service that stores links you can browse later.

![Pocket Image](./pocket.webp)

It works via a mobile app and Chrome extension. You simply press a button to trigger the extension or use another mobile button to share to the app—very simple and quick.

This means you can stay in the flow but still track that side quest for later.

Pocket worked for me for many years, but then one day, they made an update that frustrated me, so I decided to switch to a similar feature built into my RSS reader of choice, [Inoreader](https://www.inoreader.com/).

But then Inoreader decided to jack up its prices beyond what I was willing to pay.

![Expired Image](./expired.webp)

So, I was kind of fed up at this point and thought what every self-respecting software engineer thinks to themselves: "Sod it, I'll just build it myself! How hard can it be?"

## StashIt

![StashIt Icon](./icon.webp)

Just like that, [StashIt](http://stashit.lol/) was born.

Quickly on the name and logo: I wanted to keep with the side quest/game-related theme with the "stash," but then I realized that combining "Stash" and "It" together created a rather amusing double/triple entendre, hence the domain choice https://stashit.lol/.

There isn't much to say about the functionality; if you know Pocket, then it's basically like that but with far fewer features.

![StashIt Screenshot](./stashit-ss.webp)

Right now, the main web app lets you add, archive, delete, and read items. This was all I really needed for the initial version, at least.

It was important that it worked well on mobile since I manage most of my side quests when I'm out and about or sitting on the sofa. So, the first thing I did was ensure that the web app was nice and responsive.

![Responsive Image](./responsive.webp)

I then wrapped it up into a [Capacitor](https://capacitorjs.com/) app.

![Mobile Image](./mobile.webp)

The final piece was putting together a quick Chrome extension that allowed me to quickly track that side quest when browsing the web.

![Extension Image](./extension.webp)

And that's about it, functionality-wise—nice and simple, but very useful.

Oh, one more thing: because I built it, I can tailor specific functionality to suit me.

For example, this blog now has an additional page: https://mikecann.blog/stash

![Blog Page Image](./blogpage.webp)

So, I now have a page I can point people to that shows a continually changing list of side quests I've been on lately. :)

## Technical Specifics

Another goal of this project was to explore some technical ideas and scratch some itches that my work at [Gangbusters](https://www.gangbusters.io/) can't currently reach.

So, in no particular order, here are some of the technologies used in this project:

- Convex
- React
- TypeScript
- Next.js
- Capacitor
- Vite
- Turbo-repo
- Chrome Extension API
- Capgo Live Updates
- Convex Auth
- Radix Themes
- Bun

This blog post would turn into a book if I talked about each of those, so instead, here are some notable thoughts on a few of them.

### Convex

![Convex Image](./convex.webp)

A fantastic experience, [as always](https://mikecann.blog/posts/tinkering-with-convex). It's always a pleasure to start a new project with Convex. The speed at which I can get going and how clear the data model is—it's just a joy.

However, I bumped into an issue I've mentioned before.

![Count Image](./count.webp)

Unfortunately, Convex doesn't have any "aggregation" query methods. This means that to show the number of items within the stash or archive, you have to use some sub-optimal solutions.

The standard recommendation is to keep track of this count yourself in the database and increment or decrement it as you add or remove items. This approach is potentially error-prone, as you must remember to update this cross-cutting concern in multiple mutations.

Another way is to return all the records in the table within a query, then use `.length` on the array. This is the method I ended up using for this solution. I capped the number of items returned to 500, so if the count exceeds 500, it will just read "500+."

This probably means that query is quite expensive to run, but for now, it's okay.

There is hope on the horizon. Convex is very aware of these "aggregation" issues and is [exploring ways to solve them](https://github.com/ldanilek/aggregate). Fingers crossed, as this is just about the only big thing I miss from Postgres.

### Next.js

![Next.js Image](./next.webp)

I decided to go with Next.js on this project. Although this blog is powered by Next.js, it's using the old pages way of doing things, and I haven't updated it in a while, so I thought I'd try the new hotness and see what everyone is talking about.

Well, I'm not impressed. Sure, it works and _may_ be flexible and fast (at render time), but at what price?

- I find the SSR confusion real. The React Server Components "use-client" or "use-server" is just a headache conceptually, and I end up sprinkling "use-client" everywhere to make the error messages go away.

[This post](https://www.mux.com/blog/what-are-react-server-components?utm_source=pocket_saves) makes me feel better that I'm not the only one.

- The dev experience is way slower than Vite because it doesn't pre-build the pages—only when you first visit them. You end up with a big pause when trying to navigate.

- Several times, my Next.js cache got corrupted. How? I have no idea. All I know is I suddenly started getting very strange errors that took me ages to work out. In the end, I just deleted the `.next` folder, built it again, and all was well. Still super frustrating.

So yeah, I don't think I'll go with Next.js next time.

### Capgo Live Updates

![Capgo Image](./capgo.webp)

[BattleTabs](https://mikecann.blog/posts/introducing-battletabs) is built on Capacitor, so I decided to go with it for the mobile app for this project too.

BattleTabs works by simply iframing https://battletabs.io. This means updates are a breeze, as we simply need to reload the iframe within the Capacitor wrapper to have it auto-update.

I probably should write a blog post on this at some point, as I think it's a super interesting way of designing a cross-platform app, but I'll leave that for another day.

The more traditional way of updating a web-based mobile app these days, however, is to use a service that can "live update" the code by having the device download the new code bundle, then unpack and replace the existing code. This means you're able to provide speedy updates without having to resubmit to the various app stores each time.

For a Capacitor app, there are two main options that I could see: either [Appflow's Live Updates Service](https://capacitorjs.com/docs/guides/deploying-updates) or [CapGo's Live Updates Service](https://capgo.app/).

Both have free and paid tiers, but Capgo also has an open-source version. I wanted to experiment with self-hosting my own updates using a [simple HTTP action](https://github.com/mikecann/stashit/blob/master/packages/convex/convex/updates.ts) I wrote using Convex, then storing the updates in Convex's storage system.

When the CI builds the game, it zips up the output and then [uploads it to the Convex backend, which creates a new version](https://github.com/mikecann/stashit/blob/master/apps/client/scripts/createAndUploadNewAppVersion.ts) ready for the mobile app to consume.

This all works really well and was surprisingly simple to do—I was pleasantly surprised.

### Radix Themes

![Radix Image](./radix.webp)

Radix Components are used

in many of the popular [ShadCN/ui](https://ui.shadcn.com/) components, so I thought I'd give their opinionated ["themes"](https://www.radix-ui.com/themes/docs/overview/getting-started) library a go.

I enjoyed the [very prescriptive](https://www.radix-ui.com/themes/docs/theme/overview) way of doing things—sometimes it's nice to just be told one way to do things.

However, I still found myself needing to use the `style` prop fairly often. I also found myself wishing for a bit more control around styling. I started to suspect that I would have to pull in Tailwind. I did resist, but I think I'll have to bow to the inevitable eventually.

I also found it kind of odd how only some CSS properties were listed as attributes. I suspect this is intentional, as with everything in Radix, but coming from the pure flexibility of the [emotion](https://emotion.sh/docs/introduction)-based [ChakraUI](https://v2.chakra-ui.com/), it just felt a little frustrating at times. Again, I suspect this is intentional.

So, all in all, I'm not exactly sure what to think about Radix Themes. I think I'm still looking for the perfect UI library. ChakraUI gets close—if only it wasn't such a massive drain on TypeScript compilation performance.

### Convex Auth

![Auth Image](./auth.webp)

All my Convex projects up to this point have been using [Clerk](https://clerk.com/) for their authentication. However, I was getting issues when trying to implement Clerk into the Capacitor app, so I decided, why not give the [newly released Convex Auth](https://www.convex.dev/auth) a try instead?

It's all very new stuff, but it seemed to work quite well. I think I have a bit more tinkering to do with it, but I was pleasantly surprised by how smooth everything worked.

## Project Status & Conclusions

For now, this is still very much a personal project that I'm going to keep tinkering with and adding to as I need it.

I was thinking of releasing the source, but I decided not to just yet, as everything is a bit all over the place, and I'm likely to change stuff over the next several months. If you're super interested in having a look, let me know, and I can sort something out. :)

I may revisit this project in a future post, so stay tuned!



I enjoy reading [Ian Macartney's](https://stack.convex.dev/author/ian-macartney) posts on the Convex blog. When I saw his piece on [Work Stealing](https://stack.convex.dev/work-stealing), a strategy for distributing compute-heavy workloads, I decided to try it myself.

# TL;DR

Check out the demo video below to see what I built:

<iframe width="100%" height="400" src="https://www.youtube.com/embed/sovYE3sWszY" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

Code: [https://github.com/mikecann/whisper-farm](https://github.com/mikecann/whisper-farm)

# Whisper Farm

I aimed to speed up podcast transcription by parallelizing the task into separate "jobs" and performing each in parallel on [Fly.io's GPU machines](https://fly.io/gpu).

Each Fly.io machine runs a single Docker container with a Whisper binary from [whisper-standalone-win](https://github.com/Purfview/whisper-standalone-win), an [FFmpeg](https://github.com/kribblo/node-ffmpeg-installer) binary, and a Node.js "worker" for "chunking" or "transcription" jobs.

To orchestrate this, I used [Convex](https://convex.dev), an excellent backend as a service that I’ve discussed [many times before](https://mikecann.blog/tags/convex).

# Challenges

This project was more challenging than I initially thought.

Most difficulties were related to Docker and Fly.io, while the Convex part was problem-free.

## Docker

Not being a Docker expert caused several headaches when packaging the Whisper model and code.

I started off in high hopes after reading [this blog post](https://fly.io/blog/transcribing-on-fly-gpu-machines/) from Fly. However, I soon realized I didn't want to run it as a standalone container. Instead, I wanted my worker code to run alongside it, simplifying scaling and cost management. I wanted a self-contained worker.

Merging two Dockerfiles turned out to be complex. Eventually, I abandoned that approach and used a [Whisper binary](https://github.com/Purfview/whisper-standalone-win), dynamically downloading and unzipping it when the container was constructed.

Another issue was the large Docker image size, around 15 GB, causing problems on Fly.io. Machines wouldn't start or took a long time, likely due to the image size. Fly.io's error messages weren't helpful here.

To reduce the Docker image size, I learned (thanks, ChatGPT!) that each "RUN" command creates a new layer. By rearranging and combining "RUN" commands, I reduced the image size from 15 GB to 5 GB.

![](./dockerimagesize.webp)

This experience taught me that I probably need to learn a bit more about Docker fundamentals.

# UI - Shadcn & Tailwind

Another side quest was experimenting with "the new hotness" in web UI design.

![](./shadcnui.webp)

[Shadcn/ui](https://ui.shadcn.com/) is popular right now. The idea is to copy and paste component code directly into your project and modify it, creating your own component library.

Shadcn uses Tailwind for styling. Although I’ve avoided Tailwind due to its "[stringly typed](https://wiki.c2.com/?StringlyTyped)" nature, I decided to try it since it’s widely used.

My conclusions?

I’m just not sold on Tailwind. I dislike its stringly typed nature and the need for additional tools like `prettier-plugin-tailwindcss` and extra linting rules. Managing className attributes requires more libraries like `tailwind-merge` and `class-variance-authority` which irks me. Tailwind also needs its own compiler/toolchain which is yet another headache to deal with.

Shadcn/ui was also disappointing. While the copy-paste nature is quick, the components lacked features I expected from a UI library. Modifying components that often looked like this is just simply confusing:

![](./tailwind.png)

# Issues and Future Work

Back to the main point of this post.

I think I proved the concept of work-stealing and learned a lot along the way. There is however more work that would be needed to take this further.

Some key areas include:

- Transcription results might exceed the 1 MB row limit in the database (https://docs.convex.dev/production/state/limits), so storing it as a file might be necessary.
- Error handling for Fly.io machine startup needs improvement.
- More testing is required to ensure stability.
- The code is messy and needs tidying up.
- There’s no authorization or authentication.
- Worker count limits are needed to prevent potential issues.
- The UI is basic and was more of an experiment with Shadcn and Tailwind.



I've been meaning to tinker with Temporal for quite some time now, as it intersects some of my key interests: [Event Sourcing](https://mikecann.blog/posts/serverless-databaseless-event-sourcing), [durable execution](https://mikecann.blog/posts/tech-to-tinker-with-in-2022), and [cool application architectures](https://mikecann.blog/posts/tinkering-with-convex).

# What is Temporal?

From their [website](https://temporal.io/):

> Durable Execution is a development abstraction that preserves complete application state so that upon host or software failure, it can seamlessly migrate execution to another machine.

But what does that mean exactly?

From a coder's perspective, it means you can define "Workflows" in TypeScript such as:

```ts
export async function SubscriptionWorkflow(email: string, trialPeriod: string | number) {
  await sendWelcomeEmailToUser(email);
  await sleep(trialPeriod);
  await sendSubscriptionEndedEmailToUser(email);
}
```

Temporal ensures this function continues to exist even if the server that runs it shuts down. When the server starts up again, it can resume from the correct location, making it "durable." Temporal also handles errors and retries the steps in the Workflow if they fail.

If this doesn't immediately seem impressive, consider how difficult it is to resume a function's execution at any arbitrary point after the fact, especially when dealing with non-deterministic states like DateTimes and random numbers.

# Exploring Temporal

My goal with any "tinkering" I do is to understand the technology enough to form an opinion about it.

I started with [the docs](https://docs.temporal.io/), which are quite thorough. Setting up the environment included installing the Temporal CLI and running their local service, which even comes with a nice WebUI to display your Workflows:

![](./webui.png)

After reading through the initial pages of the docs, I summarized the key structure and terms with this diagram:

![](./diagram.png)

Clients start Workflows, which can contain several Activities. Workflows enter a Task Queue from which Workers pull and execute tasks. If activities fail, they can be retried an infinite (configurable) number of times.

Every "[Action](https://docs.temporal.io/cloud/pricing#action)" the system takes (starting a workflow, running an activity, signals, queries, etc.) is an event recorded within the system, which is then recorded against your workflow so you can view exactly what happened and when:

![](./events.png)

## Event Sourcing

It's worth taking a tangent to discuss another application architecture dear to my heart: [Event Sourcing](https://martinfowler.com/eaaDev/EventSourcing.html).

I won't explain all of Event Sourcing here, as I've covered it before on this blog and there are many good deep-dives available online. The basic idea is that your entire application should be described with immutable events. To get the current state of your application, you fold/reduce your events down to a state. For example, you might have a "UserCreated" event with the user's name "Dave." Later, if Dave changes his name to "Davina," the system triggers a "UserChangedName" event.

Because we record all the events in order and each event is immutable, we can always reconstruct the current state of the user at a later date and see exactly what led to that state. This state reconstruction is called "Projection" in Event Sourcing terminology and is fundamental to Event Sourcing.

Now, suppose you want to model a "Process" like the Temporal Workflow example at the start of this post.

1. A user clicking a button creates a "UserTrialSubscriptionStartRequested" event.
2. A "Process Manager" picks up that event, sends the user an email, and emits a "UserTrialSubscriptionStarted" event.
3. It could also set up a timer so that after the trial period ends, a "UserTrialPeriodEnded" event is fired.
4. The Process Manager detects that event, sends the user another email to let them know their trial has ended, and emits a "UserTrialSubscriptionEnded" event.

What I've outlined with "Process Managers" is exactly what a Temporal "Workflow" does but with a nicer developer experience. Temporal uses clever build-time tooling to ensure that Activities within a Workflow are the entry points when an event occurs. Because side effects are constrained to Activities, we can replay a Workflow to resume a paused state.

# Why?

So why would you want to do this? Many applications (finance, health, military, industry, etc.) need to ensure something happens and have a clear record of exactly what happened to potentially reconstruct events.

Event-based architectures like Event Sourcing and Temporal capture the system as events, then reconstruct the world from those events, rather than the other way around (a typical CRUD system). Temporal.io cleverly combines the best parts of Event Sourcing (the Process Managers) into an entirely standalone product and names it Durable Execution.

# Unanswered Questions

The Temporal docs are extensive, and there's a lot I haven't explored yet.

I've run out of time for this tinkering session, but next time I'd like to build a simple application to see what works and what doesn't. Here are some notes for next time:

- How does input validation on Workflows work? Is there input validation at all?
- Signals and Queries look interesting but a bit convoluted—need to explore those more.
- Should you use Temporal for your entire application state or just Workflow-based state? If not, how do the two combine?

# Pricing

Temporal uses a per-Action-based pricing model:

![](./actionpricing.png)

One million "actions" costs $25. This seems quite expensive since everything results in an action. For comparison, [Convex](https://www.convex.dev/pricing) charges $25 per month for 25 million function calls, and [Cloudflare](https://developers.cloudflare.com/workers/platform/pricing/) charges $0.3 per 1 million function calls.

However, I'd need to make a real app to get a proper sense of how expensive Temporal would be in practice.

# Thinking in Convex

Speaking of Convex, I can't help but think about how I might implement a "Workflow-like" structure on Convex.

I've been considering building an Event-Sourced application on Convex for a while, but I think a simpler structure via State Machines might achieve most of what you want... 🤔

Stay tuned—I may well tinker with this in the future!



As is [rapidly becoming a trend](https://mikecann.blog/posts/tinkering-with-spacetime-db) in my tinkering adventures, today's post chronicles a bit of a failed adventure. But that's okay, it's always good to explore and learn, particularly in the rapidly evolving field of AI.

# LazyAI

There are a lot of these text-to-app startups around at the moment. One of the most famous is [Devin from Cognition.ai](https://www.cognition.ai/introducing-devin). That one is not available yet, but I wanted to explore another one that has been getting some buzz lately: [Lazy.ai](https://www.getlazy.ai/).

![](./tagline.png)

Its tagline is "Idea to software 10X faster." Let's see how it does.

# The Project

As I am [a massive Convex.dev fan](https://mikecann.blog/posts/im-now-a-convex-developer-advocate), I knew it had to be something Convex related. I felt like this could be tough for the AI, as Convex is not as well-known yet, and so the LLM may not have as much pre-trained knowledge.

Something I had wanted to experiment with for a while was some sort of visualization for Convex database schemas so you can see the relationship between tables and types. I was imagining some sort of class diagram:

![](./classdiagram.png)

Or even better, a program that can generate the diagram dynamically such as [TSDiagram](https://tsdiagram.com/).

![](./tsdiagram.png)

# LazyAI Conversation

So, with that, I entered the following prompt into LazyAI:

> I would like to build an app that takes in a convex database schema and generates a Directed Acyclic Graph of the relationships between the tables and types.

It came back with a helpful plan of attack.

![](./lazy1.png)

I felt like maybe I was being a bit tough on it, so I gave it a bit more info:

> My project is TypeScript based. I want to be able to run this tool as a TypeScript script and have it analyze the convex.dev database schema that I give it. For example:

```ts
const schema = defineSchema({
  messages: defineTable({
    authorId: v.id("users"),
    body: v.string(),
    likes: v.int64(),
    replies: v.int64(),
    isReplyToMessageId: v.optional(v.id("messages")),
    imageId: v.optional(v.string()),
  }).searchIndex("search_by_body", {
    searchField: "body",
    filterFields: ["authorId"],
  }),

  users: defineTable({
    handle: v.string(),
    name: v.string(),
    pictureUrl: v.union(v.string(), v.null()),
    tokenIdentifier: v.string(),
  })
    .index("by_token", ["tokenIdentifier"])
    .index("by_handle", ["handle"]),

  lists: defineTable(
    v.union(
      v.object({
        kind: v.literal("all_messages"),
        ownerId: v.id("users"),
        name: v.string(),
      }),
      v.object({
        kind: v.literal("search"),
        ownerId: v.id("users"),
        name: v.string(),
        query: v.string(),
        includeReplies: v.boolean(),
      })
    )
  ).index("by_ownerId", ["ownerId"]),

  likes: defineTable({
    likerId: v.id("users"),
    messageId: v.id("messages"),
  })
    .index("by_likerId", ["likerId"])
    .index("by_messageId", ["messageId"])
    .index("by_messageId_likerId", ["messageId", "likerId"]),
});
```

The response it came back with was:

![](./lazy2.png)

I felt like that was actually a reasonable plan and told it to go ahead.

Now, the way the app works is that it's split into three parts: Test, Code, and Env Secrets.

![](./lazyparts.png)

So in theory, I should be able to test the output it generates. Well, this is where things unfortunately start to go off the rails a bit because to test (even your first project), you need to sign up for a pro membership.

![](./lazypro.png)

Which I would have been happy to do if I felt like the tool was going to give me some value, but the pricing scared me off.

![](./lazypricing.png)

$39.89 per month just to see if the code works and then usage costs on top of that?! No chance I was going to pay that just to check it out.

So after a little bit more back and forth with the AI, I decided to take a look at the code and copy it into VSCode to see if I could get it to run myself.

Well, unfortunately, I was to be disappointed again.

![](./lazyerrors.png)

There was no chance this code would compile or even run. There are TypeScript type errors all over the place and the imports wouldn't work from the wrong packages, etc.

I tried to give it the benefit of the doubt though and fixed the compile errors and import errors and tried to run it. Sure enough, no dice.

![](./lazyrunerror.png)

# LazyAI Conclusion

It's not ready yet. I think the task I gave it was quite tricky and maybe I was asking too much, but I think I was willing to give it the benefit of the doubt until I saw the pricing for it. Then my sympathy evaporated.

Fortunately, there are a lot of these "AI Project Generation" projects out there and as I still had a bit of time left to tinker, I thought I would give another one a go.

# Pythagora.ai

https://www.pythagora.ai/

![](./pythagora.png)

This one touts itself as a "dev tool that builds apps from scratch by talking to you." Sounds great, let's give it a shot.

This one works a little differently. It is a VSCode extension that you need to install [from the store](https://marketplace.visualstudio.com/items?itemName=PythagoraTechnologies.gpt-pilot-vs-code&ssr=false#review-details). So I headed over there and immediately was discouraged to see that it was only 3 stars out of 5. I was not off to a good start.

![](./pyreviews.png)

After a bit of a confusing setup (you have to first install another tool, gpt-pilot apparently) I had it working.

![](./pyworking.png)

(just a side note, having an AI running on my local system from an unknown developer with full access makes me kind of nervous.)

This time I was a little more generous with the initial prompt:

> I would like to build a Node.js TypeScript app that takes in a convex.dev database schema and generates a graph of the relationships between the tables and types.
>
> I want to be able to run this tool as a TypeScript script inside of my convex project and have it analyze the convex.dev database schema that I give it.
>
> I want the output to be an image that looks like something like a class diagram from classic UML.
>
> This is an example convex schema:

```ts
const schema = defineSchema({
  messages: defineTable({
    authorId: v.id("users"),
    body: v.string(),
    likes: v.int64(),
    replies: v.int64(),
    isReplyToMessageId: v.optional(v.id("messages")),
    imageId: v.optional(v.string()),
  }).searchIndex("search_by_body", {
    searchField: "body",
    filterFields: ["authorId"],
  }),

  users: defineTable({
    handle: v.string(),
    name: v.string(),
    pictureUrl: v.union(v.string(), v.null()),
    tokenIdentifier: v.string(),
  })
    .index("by_token", ["tokenIdentifier"])
    .index("by_handle", ["handle"]),

  lists: defineTable(
    v.union(
      v.object({
        kind: v.literal("all_messages"),
        ownerId: v.id("users"),
        name: v.string(),
      }),
      v.object({
        kind: v.literal("search"),
        ownerId: v.id("users"),
        name: v.string(),
        query: v.string(),
        includeReplies: v.boolean(),
      })
    )
  ).index("by_ownerId", ["ownerId"]),

  likes: defineTable({
    likerId: v.id("users"),
    messageId: v.id("messages"),
  })
    .index("by_likerId", ["likerId"])
    .index("by_messageId", ["messageId"])
    .index("by_messageId_likerId", ["messageId", "likerId"]),
});
```

Then followed a plan that the AI came up with and interestingly, it asks me before it runs commands:

![](./pycommands.png)

Ughh, it seems like it gets stuck quite easily though when something isn't installed that it needs:

[

![](./pydot.png)](./pydot.png)

I didn't want to install anything else right now, so I just clicked past it.

It seemed to continue just fine, then began installing a bunch of Node packages and setting up a TypeScript project for me, which was kind of nice.

It stops every now and then to check with you to make sure everything is looking good, which is nice.

![](./pyreview.png)

It started to generate some TypeScript. It looked like there were some errors, but I was starting to feel confident that it might be able to debug its way out of it. Then I hit:

![](./pyfreetrialover.png)

Fortunately, their pricing is much more reasonable than LazyAI and even lets you use your own OpenAI keys!

![](./pyapikey.png)

I was keen to see where this went, so I decided to spend $10 (and tip the developer) to find out.

I put together this little video to give you a sense of what the process feels like:

<iframe width="853" height="480" src="https://www.youtube.com/embed/YmhPVFl-dVE" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>

Unfortunately, as can be seen from the video, the code is very broken and would not run even if I followed the instructions they gave me.

# Conclusion

Unfortunately, I had now run out of time to tinker with this any more, but I felt like it was possible that I could have gotten to something usable with Pythagora, which I didn't think was likely with LazyAI.

Could I build a graph visualization faster myself? Probably, but that's not the point. The point is that I can potentially hand this task off to my "junior developer" and have them work on it for me while I do something else, like touching grass for example (ewww).

So my takeaway is that it's not ready yet, at least these two aren't ready.

LazyAI has a long way to go, but I think I do prefer the running code in an online sandbox process over Pythagora's run the code on your local system approach, which quite frankly makes me nervous.

Running in a sandbox also means that the AI doesn't have to continually pause to ask me if it's okay to run a command (like Pythagora does), as it can simply run it without fear of damaging the underlying operating system.

I am looking forward to future versions of App Generators. In particular, [Devin](https://www.cognition.ai/introducing-devin) looks very promising and also runs in a sandbox-like environment. I added myself to their waitlist, so stay tuned. I may well revisit this in a future blog post!



Just a short one this month as I have been working super hard with the team on the mobile port of [our game BattleTabs](https://mikecann.blog/posts/battletabs-in-7-minutes). But as this is a personal blog I thought I would share something I think is quite cool.

I have recently really been into the back-end platform [Convex.dev](https://www.convex.dev/) writing this review on it back in August: https://mikecann.blog/posts/tinkering-with-convex then entering the WebDevCody competition and coming third in this post: https://mikecann.blog/posts/chatter-craft-collaborative-art-with-just-your-voice.

So when Convex reached out to me a few weeks ago to let me know they were starting a brand new Developer Champion program and would like to invite me to be a part of it I was super excited and signed up immediately.

# What are the benefits?

From the Convex docs on the topic:

- Consistent and transparent AMA with leadership
- Exclusive Convex Champion Swag (coming soon)
- Individual [Stack](https://stack.convex.dev/) feature: Case study, profile or project feature
- Profile featured on a new champions page on [Convex.dev](http://Convex.dev)
- Sponsored trips to conferences if your presentation about Convex is accepted
- Complimentary Professional Plan for one team.
  - $0/month, in perpetuity
  - Up to five team members
  - Not for resale or transfer.
  - Includes only built-in monthly Professional resource limits.

Pretty cool!

# Whats involved?

Straight from Convex's docs on the topic:

- Creating blog posts or videos about Convex
- Attending meetups or conferences to give talks about Convex
- Promoting Convex, only if relevant
- Helping users be successful in the Discord

So what does it mean for me? Not much! Im still going to be focusing 99.9% of my time on Gangbusters but should I decide I want to start giving more talks its awesome that the program is there to help sponsor me if I were to give a Convex talk.

Ill still be writing blog posts on whatever interests me so theres no obligation there.

I really enjoy the power and speed of building things with Convex so no doubt you will be hearing a lot more about Convex powered projects on this blog, stay tuned!
