triplit

Überblick

Triplit ist eine Open-Source-Datenbank, die Daten zwischen Server und Browser in Echtzeit synchronisiert.

Triplit bietet einen Echtzeit-Synchronisierungsdatastore, den Sie als TypeScript-Paket in Ihre App einbringen können. Triplit übernimmt das Speichern Ihrer Daten auf dem Server und synchronisiert Ihre Abfragen intelligent an Ihre Kunden. Wir nennen diese Art von System eine „vollständige Stack -Datenbank“ - Sie können unsere Präsentation hier vor der lokalen ersten Community in diesem neuen Paradigma ansehen.

Triplit vereint:

Echtzeit-Synchronisierung mit inkrementellen Aktualisierungen und Konfliktlösung auf Immobilienebene

? Lokales Caching, das von einer vollwertigen clientseitigen Datenbank betrieben wird

? Haltbarer serverseitiger Speicher mit einem Admin-Dashboard

? Steckdierbarspeicheranbieter wie SQLite, IndexedDB, LevelDB, Speicher usw.

? Optimistische Updates , damit sich jede Interaktion schnell anfühlt

? Relationale Abfragen für komplexe Datenmodelle

? Offline-Modus mit automatischer Wiederverbindung und Konsistenzgarantien

? Rollback- und Wiederholungsverwaltung bei fehlgeschlagenen Updates

Schemas für die Datensicherheit und die Automobile von Typenkripten

? Autorisierung , die auf dem Server sowohl für Lesen als auch für Schreibvorgänge erzwungen wird

? Zusammenarbeit/Multiplayer, die von CRDTS betrieben werden

? ️ niedrige Latenz mit minimalem Netzwerkverkehr mit Delta -Patches

Einfache API zum Abfragen und Mutieren von Daten in Vanille -JavaScript und React

✅ Ganze Open-Source!

Monorepo -Übersicht

In triplit/packages finden Sie die verschiedenen Projekte, die Triplit betreiben:

• TriplitDB - entwickelt, um in jeder JS -Umgebung (Browser, Knoten, Deno, React Native usw.) zu betreiben und ausdrucksstarke, schnelle und live -Aktualisierungsabfragen bereitzustellen und gleichzeitig die Konsistenz mit vielen Autoren über ein Netzwerk aufrechtzuerhalten.
• Client - Browserbibliothek für die Interaktion mit lokalen und Remote Triplitdbs.
• CLI - CLI -Tool mit Befehlen zum Gerüst eines Projekts, der Full -Stack -Entwicklungsumgebung ausführen, einen Server migrieren und vieles mehr.
• React - React Bindings für @Triplit/Client.
• Svelte - Svelte -Bindungen für @Triplit/Client.
• Konsole - App zum Anzeigen und Mutieren von Daten in dreifachen Projekten und Verwaltung ihrer Schemas.
• Server - Knotenserver zum Synchronisieren von Daten zwischen Triplit -Clients.
• Server -Core - Protokoll Agnostische Bibliothek zum Erstellen von Servern, die dreifach ausgeführt werden.
• DOCS - Triplit Docs, gebaut mit Nextra.
• Typen - gemeinsame Typen für verschiedene dreifache Projekte.
• UI - Shared UI -Komponenten für dreifache Frontend -Projekte, die mit Shadcn erstellt wurden.

Schneller Start

Starten Sie ein neues Projekt.

npm create triplit-app@latest my-app

Oder fügen Sie die Abhängigkeiten zu einem vorhandenen Projekt hinzu.

npm install --save-dev @triplit/cli
npm run triplit init

Definieren Sie ein Schema in my-app/triplit/schema.ts .

 import { Schema as S , ClientSchema } from '@triplit/client' ;

export const schema = {
  todos : {
    schema : S . Schema ( {
      id : S . Id ( ) ,
      text : S . String ( ) ,
      completed : S . Boolean ( { default : false } ) ,
    } ) ,
  } ,
} satisfies ClientSchema ;

Starten Sie den Triplit Development Sync Server.

npm run triplit dev

Dies gibt einige wichtige Umgebungsvariablen aus, die Ihre App mit dem Server synchronisieren muss. Fügen Sie sie Ihrer .env -Datei hinzu (vite Beispiel unten).

VITE_TRIPLIT_SERVER_URL=http://localhost:6543
VITE_TRIPLIT_TOKEN=copied-in-from-triplit-dev

Definieren Sie eine Abfrage in Ihrer App (React -Beispiel unten).

 import { TriplitClient } from '@triplit/client' ;
import { useQuery } from '@triplit/react' ;
import { schema } from '../triplit/schema' ;

const client = new TriplitClient ( {
  schema ,
  serverUrl : import . meta . env . VITE_TRIPLIT_SERVER_URL ,
  token : import . meta . env . VITE_TRIPLIT_TOKEN ,
} ) ;

function App ( ) {
  const { results : todos } = useQuery ( client . query ( 'todos' ) ) ;

  return (
    < div >
      { Array . from ( todos . values ( ) ) . map ( ( todo ) => (
        < div key = { todo . id } >
          < input
            type = "checkbox"
            checked = { todo . completed }
            onChange = { ( ) =>
              client . update ( 'todos' , todo . id , ( todo ) => ( {
                todo . completed = ! todo . completed ,
              } )
            }
          / >
          { todo . text }
        </ div >
      ) ) }
    </ div >
  );
}

Starten Sie Ihre App, öffnen Sie einen anderen Browser-Registerkarte und sehen Sie sich die Datensynchronisierung in Echtzeit an.

Lesen Sie hier den vollständigen Anleitung für den Einstieg. Eine noch detailliertere und erklärende Tutorial finden Sie in dieser Schritt-für-Schritt-Anleitung, um eine Echtzeit-Todo-App mit dreifacher, vite und reagieren zu erstellen.

Kontaktieren Sie uns

Wenn Sie sich für einen frühen Zugriff auf Triplit Cloud (derzeit in Entwicklervorschau) interessieren, melden Sie sich hier an, um der Warteliste beizutreten.

Der beste Weg, um in Kontakt zu treten, besteht darin, sich unserer Zwietracht anzuschließen! Wir sind hier, um Fragen zu beantworten, Entwicklern zu helfen, mit Triplit und Vorschau auf neue Funktionen zu beginnen.

Sie können uns auf Twitter/X folgen, um unsere neuesten Ankündigungen zu sehen.