triplit

Обзор

TripLit-это база данных с открытым исходным кодом, которая синхронизирует данные между сервером и браузером в режиме реального времени.

TripLit предоставляет хранилище данных в реальном времени, которое вы можете бросить в свое приложение в качестве пакета TypeScript. TripLit обрабатывает хранение ваших данных на сервере и интеллектуально синхронизирует ваши запросы для ваших клиентов. Мы называем этот тип системы «базой данных полной стека» - вы можете посмотреть нашу презентацию местному сообществу первого сообщества в этой новой парадигме здесь.

TripLit объединяет:

Синхронизация в реальном времени с постепенными обновлениями и разрешением конфликтов на уровне собственности

? Локальное кэширование, работающее на полноценной базе данных на стороне клиента

? Прочное хранилище на стороне сервера с административной панелью

? Поставщики плановых хранилищ, такие как SQLite, IndexedDB, LevelDB, память и т. Д.

? Оптимистичные обновления , чтобы каждые взаимодействие чувствовали себя быстро

? Реляционные запросы для сложных моделей данных

? Автономный режим с гарантиями автоматического переподключения и согласованности

? Откат и повторение управления в неудачных обновлениях

Схемы для безопасности данных и автоматического заполнения типографии

? Авторизация , которая применяется на сервере как для чтения, так и для записи

? Сотрудничество/многопользовательский питание от CRDTS

️ Низкая задержка с минимальным сетевым трафиком с использованием патчей Delta

Простой API для запроса и мутирования данных в ванильном JavaScript и React

✅ Полностью открытый источник!

Обзор монорепо

В triplit/packages вы можете найти различные проекты, которые Power TripLit:

• Triplitdb - разработан для работы в любой среде JS (браузер, узел, Deno, React Native и т. Д.) И обеспечить выразительные, быстрые и живые запросы обновления, сохраняя при этом согласованность со многими авторами по сети.
• Клиент - библиотека браузеров для взаимодействия с локальными и удаленными TripLitdbs.
• CLI - CLI Tool с командами для каркаса проекта, запустите среду разработки полного стека, переносить сервер и многое другое.
• React - React Bindings для @triplit/client.
• Svelte - Svelte Bindings для @triplit/client.
• Консоль - приложение для просмотра и мутирования данных в проектах TripLit и управления их схемами.
• Сервер - Сервер узлов для синхронизации данных между клиентами TripLit.
• Сервер -ядер - библиотека агностической протокола для строительства серверов под управлением TripLit.
• Документы - TripLit Docs, построенные с Nextra.
• Типы - общие типы для различных проектов TripLit.
• Пользовательский интерфейс - общие компоненты пользовательского интерфейса для проектов TripLit Frontend, построенные с Shadcn.

Быстрый старт

Начните новый проект.

npm create triplit-app@latest my-app

Или добавить зависимости к существующему проекту.

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

Определите схему в 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 ;

Запустите сервер Sync Development Development.

npm run triplit dev

Это выведет некоторые важные переменные среды, которые вам нужно будет синхронизировать с сервером. Добавьте их в свой файл .env (пример VITE ниже).

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

Определите запрос в вашем приложении (React Reale).

 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 >
  );
}

Начните свое приложение, откройте другую вкладку браузера и посмотрите синхронизацию данных в режиме реального времени.

Прочитайте полное начало работы здесь. Для еще более подробного и объяснительного учебника, ознакомьтесь с этим пошаговым руководством по созданию приложения TODO в режиме реального времени с TripLit, VITE и React.

Связаться с нами

Если вы заинтересованы в раннем доступе к TripLit Cloud (в настоящее время в предварительном просмотре разработчика), зарегистрируйтесь здесь, чтобы присоединиться к списку ожидания.

Лучший способ связаться с нами - присоединиться к нашему разногласию! Мы здесь, чтобы ответить на вопросы, помочь разработчикам начать с TripLit и предварительно просмотреть новые функции.

Вы можете подписаться на нас в Twitter/X, чтобы увидеть наши последние объявления.