Triplit | The Fullstack Database

5 min read Original article ↗

Live updating queries

Triplit's queries are reactive by default, so you can build apps that update in real-time without any extra work.

Automatic caching and syncing on the client

Full relational support for querying connected data

Typescript support for all data returned from queries

React Hooks to subscribe to queries in your UI

Learn more

use-messages.ts

import { useQuery } from "@triplit/react"
import { client } from "@/lib/triplit"

export function useMessages(convoId: string) {
  const deliveredMessagesQuery = client
    .query("messages")
    .Where("conversationId", "=", convoId)
    .Order("created_at", "DESC")

  const {
    results: messages,
    fetchingRemote,
    fetching,
    error,
  } = useQuery(client, 
        deliveredMessagesQuery, 
        { syncStatus: 'confirmed' });
}

use-messages.ts

import { useQuery } from "@triplit/react"
import { client } from "@/lib/triplit"

export function useMessages(convoId: string) {
  const deliveredMessagesQuery = client
    .query("messages")
    .Where("conversationId", "=", convoId)
    .Order("created_at", "DESC")

  const {
    results: messages,
    fetchingRemote,
    fetching,
    error,
  } = useQuery(client, 
        deliveredMessagesQuery, 
        { syncStatus: 'confirmed' });
}

Triplit would be [...] your MongoDB or MySQL, but it’s also your Drizzle, your schema definition and query language. But then it’s also your Tanstack query which you use on the client side. It’s everything.

Zero downtime

Let your users keep working even when their network connection isn't.

Durable storage to ensure no edits are lost

Retry and reconnect seamlessly restarts syncing

Conflict resolution algorithms automatically handle concurrent edits

Learn more

After a thorough evaluation of similar tools, we decided on Triplit as a key technology in a technically demanding client project and haven’t looked back since! Triplit has allowed us to move faster than ever when it comes to reliably syncing data between many users while keeping every interaction fast, even when users don’t have good connections. We are looking forward to using it in future projects.

Code first schemas

Write your schemas in Typescript instead of config files or split across a dozen SQL files.

Automatic migrations generated from your edits

Type hinting in your editor

Data validation at runtime on client and server

Learn more

schema.ts

import { Schema as S } from "@triplit/client";
  
export const schema = S.Collections({
  todos: {
    schema: S.Schema({
      completed: S.Boolean(),
      created_at: S.String({ 
        default: S.Default.now()
      }),
      id: S.Id(),
      listId: S.String({ nullable: true }),
      text: S.String(),
    }),
  },
});

schema.ts

import { Schema as S } from "@triplit/client";
  
export const schema = S.Collections({
  todos: {
    schema: S.Schema({
      completed: S.Boolean(),
      created_at: S.String({ 
        default: S.Default.now()
      }),
      id: S.Id(),
      listId: S.String({ nullable: true }),
      text: S.String(),
    }),
  },
});

I've been using Triplit on my React native app for a while and it works great. Highly recommend. It's the only local-first database that hits these points for me: 1) Good and sane query language (not SQL). 2) Great typescript support. 3) Offline support. The cherry on top is that it's open-source and self-hostable.

Tanishq Kancharla picture

Tanishq Kancharla

Software Engineer

ShortwaveShortwave

Complete data management

A full-featured database console for inspecting your data and schemas means you have all the control you'd expect from a production-ready database.

Triplit directly integrates with your UI framework

With first party support for React, Svelte, Solid and more.

With features rarely found in a traditional database

Relational, live, embedded, and open-source

Features

Triplit

Open-source

Relational

JSON

Runs on client

Live queries

Schemas

Conflict Resolution

What people are saying about Triplit

"

Overall Triplit has been really great, both as a frontend dx and also their support - whenever we find an issue or have a feature it gets handled very quickly by the team which is awesome!

"

"

Anyway, really enjoying using Triplit so far. It's the only one of all the local-first-y tools I've found that actually hits everything for me.

"

"

Also thank you for building triplit, it solves a big part of building collaborative and local first software

"

"

This looks like the future. Nice!

"

"

I can’t believe I didn’t know about Triplit earlier… the update API blew my mind.

"

"

I just wanted to say that Triplit DB is awesome —I fell in love with it!

"

"

great how you make even small updates exciting with meaningful DX improvements - that's the attention to (design) detail that I appreciate in tech!

"

"

Hello, I've played around with Triplit in the last days and I must say it looks very promising, probably one of the best takes on local-first dev I've seen so far, thank you guys! One of the most interesting things to me is the possibility to self host it, not just as a standalone sync engine, but as an npm package I can run as part of my web server.

"

"

Honestly sick - quite impressed with what you guys are building here! I've tried a dozen local-first tools now and I've always run into frustration but you seem to have thought of *a lot* already. Hats off!

"

"

Thanks for the explanation and hard work on Triplit, I've been trying a few different lo-fi type projects and this one is a breeze to work with

"

"

Hello! First of all, really good work on this lib, it's easy to use/install/self host (and fully typed!)

"

"

.@triplit_dev is a do-everything-for-me kind of platform

"

"

just gotta say, thanks so much for building this. I've been tearing through building out my app, and have been able to focus almost completely on UI & business logic. I just built out a bookmarking feature in 30 mins and most of that was adjusting the UI elements.

"

Backed byYC