chrisnicholas.dev
Developer experience @liveblocks.io • Interactive articles on chrisnicholas.dev
180 posts
232 followers
288 following
Regular Contributor
Active Commenter
comment in response to
post
Been collaborating on this with our API design dream team @nvie.com and @marcbouchenoire.com today! Excited to share more.
We'll be rolling our more @liveblocks.io private beta invites to this soon. It's going to be the best way to add an advanced chat to your app.
liveblocks.io/ai-copilots
comment in response to
post
There's no structure to the JSON here, it's just an easy way for AI to understand you.
Interestingly, these results won't ever be shown to the end user—they're purely for the AI, to help it understand what to do, and how to respond.
comment in response to
post
…returning free form JSON data works too, with AI often gaining deeper insight from it.
Below we're telling AI it worked, returning the data, and giving it a hint about what to do next. Picture this in the context of an AI chat, and you have a seriously capable tool.
comment in response to
post
This is part of our first day free billing policy, learn more about this, and our other updates, in our monthly blog post.
lblcks.io/jEEouK4
comment in response to
post
More info, and a link to the upgrade guide, in our changelog.
lblcks.io/week-18-2025
comment in response to
post
The repo's here—if you're a @liveblocks.io customer, feel free to clone it and use it as a starting point for your own MCP servers.
github.com/liveblocks/...
comment in response to
post
I've written a setup guide in our docs.
liveblocks.io/docs/tools/...
comment in response to
post
It can also understand errors, and call new tools to fix them.
For example, if you ask it to update metadata in a room, but the room doesn't exist, it will create the room for you:
comment in response to
post
I love that AI will string multiple tool calls together—it's smart.
Say you want to find the newest comment in the newest room. AI will call three different tools in succession:
comment in response to
post
Built by @marcbouchenoire.com for @liveblocks.io!
bsky.app/profile/mar...
comment in response to
post
Get it here.
frimousse.liveblocks.io
comment in response to
post
bsky.app/profile/ver...
comment in response to
post
More info in this thread. Thanks for reaching out @jessmart.in and
@schickling.dev!
bsky.app/profile/loc...
comment in response to
post
You can find the page here.
localfirst.fm/landscape
comment in response to
post
Get on the waiting list.
lblcks.io/ai-copilots
comment in response to
post
Check out the upcoming features page—there's lots of info on what we'll be enabling.
lblcks.io/fCzvmWy
comment in response to
post
Learn more in our blog post.
lblcks.io/first-day-free
comment in response to
post
Here's the technical explanation—a user is defined by a `userId`, sent from your database/auth. If a user connects to Liveblocks, disconnects before 00:00 UTC, and never returns, they do not count towards your MAUs.
comment in response to
post
Sign up and we'll email you when it's ready.
liveblocks.io/ai-copilots
comment in response to
post
I'm so excited to talk about this, I'm seeing such a huge amount of velocity internally, the team's killing it. This is genuinely going to be the best way to add fully-featured AI to your product.
comment in response to
post
Try a live demo here.
nextjs-starter-kit.liveblocks.app
comment in response to
post
We've also just added support for editing Storage on the server, meaning you can have AI generate real-time document data for you.
Learn more in today's blog post.
lblcks.io/qrULpuS
comment in response to
post
This is a really simple demo, but you can use also Storage to hold much more complex data, for example deeply nested JSON trees, with full conflict resolution per object/list/map.
Picture apps like Figma, Pitch, Spline. Plus, you can make @tldraw.com multiplayer!
liveblocks.io/examples/tl...
comment in response to
post
There's a couple of other steps where you set up your types and authenticate your users, but you only need to do it once.
Setting up an emoji picker is essentially the same, just you also need an awesome emoji picker component like frimousse.liveblocks.io too.
comment in response to
post
Next, we want to render the current colour.
We can add `useStorage` for this, which returns the current colour string, and updates in real-time whenever there's a change.
Pretty easy, huh? That's all it takes to add a new real-time component.
comment in response to
post
Let's start with the colour changer, and create a button that changes the cover to red.
With `useMutation` we can access the real-time document state, and create a function that modifies it. We'll store the colour in the `cover` property.
comment in response to
post
Learn more on our blog.
lblcks.io/EWcuhKq
comment in response to
post
You can also use multiple editors on one page.
comment in response to
post
You can also use the rest of our real-time infrastructure to add custom features, for example below I'm doing our Next.js Starter Kit with a real-time icon and cover.
comment in response to
post
We have an offline support options, which means your BlockNote editor can load instantly, after the initial load. Feels like Linear.
comment in response to
post
We provide an inbox for you, and when you're mentioned in the editor, or new comments are added to a thread, you'll receive notifications linking to the correct place.
comment in response to
post
Annotate text, leaving threads and comments. Use attachments, reactions, rich-text, and more.
Comments update in real-time and let you know when there's a new message.
comment in response to
post
lblcks.io/orKNPMm