# HN에 공개: Triplit – 서버와 클라이언트에서 실행되는 오픈 소스 동기화 데이터베이스

> Clean Markdown view of GeekNews topic #15542. Use the original source for factual precision when an external source URL is present.

## Metadata

- GeekNews HTML: [https://news.hada.io/topic?id=15542](https://news.hada.io/topic?id=15542)
- GeekNews Markdown: [https://news.hada.io/topic/15542.md](https://news.hada.io/topic/15542.md)
- Type: GN+
- Author: [neo](https://news.hada.io/@neo)
- Published: 2024-06-27T09:47:25+09:00
- Updated: 2024-06-27T09:47:25+09:00
- Original source: [github.com/aspen-cloud](https://github.com/aspen-cloud/triplit)
- Points: 2
- Comments: 1

## Topic Body

### Triplit 개요

Triplit은 서버와 브라우저 간 데이터를 실시간으로 동기화하는 오픈소스 데이터베이스임. Typescript 패키지로 제공되며, 서버에 데이터를 저장하고 클라이언트에 지능적으로 동기화함.

- **실시간 동기화**: 속성 수준에서 증분 업데이트와 충돌 해결 제공
- **로컬 캐싱**: 클라이언트 측 데이터베이스로 구동
- **내구성 있는 서버 측 저장소**: 관리자 대시보드 포함
- **플러그형 저장소 제공자**: SQLite, IndexedDB, LevelDB, Memory 등 지원
- **낙관적 업데이트**: 빠른 상호작용 제공
- **관계형 쿼리**: 복잡한 데이터 모델 지원
- **오프라인 모드**: 자동 재연결 및 일관성 보장
- **롤백 및 재시도 관리**: 업데이트 실패 시 처리
- **스키마**: 데이터 안전성과 Typescript 자동 완성 제공
- **권한 관리**: 서버에서 읽기 및 쓰기 권한 강제
- **협업/멀티플레이어**: CRDTs로 구동
- **저지연**: 델타 패치를 사용한 최소 네트워크 트래픽
- **간단한 API**: Javascript와 React에서 데이터 쿼리 및 변형 지원
- **완전한 오픈소스**

### Monorepo 개요

`triplit/packages`에는 Triplit을 구동하는 다양한 프로젝트가 포함됨:

- **TriplitDB**: 브라우저, Node, Deno, React Native 등 모든 JS 환경에서 실행 가능하며, 네트워크 상에서 여러 작성자와 일관성을 유지하면서 빠르고 실시간으로 업데이트되는 쿼리 제공
- **Client**: 로컬 및 원격 TriplitDB와 상호작용하는 브라우저 라이브러리
- **CLI**: 프로젝트 스캐폴딩, 풀스택 개발 환경 실행, 서버 마이그레이션 등을 위한 명령어 제공
- **React**: @triplit/client를 위한 React 바인딩
- **Svelte**: @triplit/client를 위한 Svelte 바인딩
- **Console**: Triplit 프로젝트의 데이터 보기 및 변형, 스키마 관리 앱
- **Server**: Triplit 클라이언트 간 데이터 동기화를 위한 Node 서버
- **Server-core**: Triplit을 실행하는 서버를 구축하기 위한 프로토콜 무관 라이브러리
- **Docs**: Nextra로 구축된 Triplit 문서
- **Types**: 다양한 Triplit 프로젝트를 위한 공유 타입
- **UI**: shadcn으로 구축된 Triplit 프론트엔드 프로젝트를 위한 공유 UI 컴포넌트

### 빠른 시작

새 프로젝트 시작:

```bash
npm create triplit-app@latest my-app
```

기존 프로젝트에 종속성 추가:

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

스키마 정의 (`my-app/triplit/schema.ts`):

```typescript
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;
```

Triplit 개발 동기화 서버 시작:

```bash
npm run triplit dev
```

환경 변수 설정 (`.env` 파일):

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

앱에서 쿼리 정의 (React 예시):

```typescript
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}
        &lt;/div&gt;
      ))}
    &lt;/div&gt;
  );
}
```

앱 시작, 다른 브라우저 탭 열고 실시간 데이터 동기화 확인.

### GN⁺의 의견

- Triplit은 실시간 동기화와 로컬 캐싱을 결합하여 빠르고 일관된 사용자 경험을 제공함.
- 다양한 저장소 제공자를 지원하여 유연한 데이터 관리가 가능함.
- 오프라인 모드와 자동 재연결 기능은 네트워크 불안정 상황에서도 데이터 일관성을 유지함.
- 간단한 API와 다양한 프레임워크 지원으로 개발자 친화적임.
- 그러나 초기 설정과 환경 변수 관리가 다소 복잡할 수 있음.

## Comments



### Comment 26644

- Author: neo
- Created: 2024-06-27T09:47:25+09:00
- Points: 1

###### [Hacker News 의견](https://news.ycombinator.com/item?id=40788648) 
- **Triplit 사용 경험 공유**: Triplit을 프로젝트에 사용 중이며, 데이터 모델이 분산형(P2P)으로 잘 맞음. 그러나 서버 인증 토큰 생성과 쿼리 언어의 표현력 부족이 아쉬움.

- **Evolu와 비교**: Triplit과 Evolu의 차이점으로 Triplit의 `.subscribe()` 기능과 Evolu의 고급 쿼리 기능(SQL 기반) 및 브라우저에서 사용하는 데이터베이스 종류가 다름.

- **오프라인 동기화와 스키마 진화**: 오프라인 동기화 프로토콜을 사용하는 데이터베이스에서 클라이언트 버전이 다를 때 스키마 진화 문제를 어떻게 해결하는지 궁금함.

- **클라이언트가 데이터베이스에 직접 쓰는 것에 대한 의문**: 클라이언트가 데이터베이스에 직접 쓰는 것이 허용되는 앱이 이해되지 않음. Supabase와 Firestore에 대해서도 같은 의문이 있음.

- **Triplit의 사용자 설정 관리**: Triplit을 사용하여 사용자 설정을 관리하며, 오프라인에서도 앱이 잘 작동하도록 함. 지원팀의 빠른 대응이 인상적임.

- **AGPL 라이선스 선택 이유**: Triplit이 AGPL 라이선스를 선택한 이유가 궁금함.

- **로컬 우선 접근 방식**: 로컬 우선 접근 방식을 모바일 앱에 사용 중이며, 다른 솔루션들과 비교하여 Triplit이 클라이언트-서버 동기화 솔루션을 제공하는 이유가 궁금함.

- **Rust 바인딩 요청**: Rust 바인딩이 추가되면 Tauri와 함께 사용할 수 있어 오프라인 우선 앱 개발에 도움이 될 것임.

- **React Native에서의 Triplit 사용 경험**: Triplit을 React Native 앱에서 사용 중이며, 쿼리 언어, TypeScript 지원, 오프라인 지원, React Native 지원이 뛰어남. 오픈 소스와 자체 호스팅 가능성도 장점임.

- **미래의 앱 개발**: Triplit이 앱 개발의 미래처럼 느껴지지만, RethinkDB와의 비교 및 그들의 실패 이유에 대한 생각이 궁금함.

- **MongoDB와 Triplit의 조합 가능성**: 서버 측에서 MongoDB를 사용하고 React 측에서 Triplit을 사용할 수 있는지, 아니면 Triplit을 새로운 데이터베이스로 사용해야 하는지 궁금함.