vlcn-io / js

Components to build apps in JavaScript atop cr-sqlite
MIT License
51 stars 6 forks source link

crsqlite-js

JavaScript packages to use cr-sqlite in the browser, node, react and other JS frameworks & environments.

Quickstart

Scaffolding a new project -- https://github.com/vlcn-io/vite-starter/tree/main

Example apps:

Video overview

Browser

import initWasm from "@vlcn.io/crsqlite-wasm";
import wasmUrl from "@vlcn.io/crsqlite-wasm/crsqlite.wasm?url";

const crsqlite = await initWasm(wasmUrl);
const db = await sqlite.open("db-name");

...

db.close();

NodeJS

import Database from "better-sqlite3";

const db = new Database(":memory:");
import { extensionPath } from "@vlcn.io/crsqlite";
db.loadExtension(extensionPath);

...

db.close();

React

function TodoList() {
  const allTodos: readonly Todo[] = useQuery<Todo>(
    ctx,
    "SELECT * FROM todo ORDER BY id DESC"
  ).data;

  return (
    <div>
      {allTodos.map((t) => (
        <Todo item={t} />
      ))}
    </div>
  );
}

Sync

See official docs or the vite-starter

Packages

Storage

Sync

UI

Other

Integration Tests

Contributing

If you want to build these projects from source and/or hack on them or contribute, you'll need to clone the workspace repository:

git clone --recurse-submodules git@github.com:vlcn-io/workspace.git

Running make in that directory will get you set up. Ensure you have the rust nightly toolchain installed and activated before running make.