Coder Social home page Coder Social logo

sdb-ts's Introduction

SDB-TS

sdb-ts is a TypeScript shim for ShareDB.

This project is undergoing sporadic development.

NPM Install:

To install via npm, run:

npm install sdb-ts

Client-side Usage

For client-side code, use built/sdb-client-bundle.js.

window.SDB will contain SDBClient, SDBDoc, and SDBSubDoc

Usage Examples

Creating a server (in Node.js):

If no argument is provided, the server will pick a port:

import { SDBServer } from '../built/index'; 
async(() => {
	const sdbServer = new SDBServer();
	const { port }  = await sdbServer.address();

	await sdbServer.listening();
	console.log(`Created server on port ${port}`);
});

Otherwise, the constructor can be called with the server passed in:

import * as WebSocket from 'ws';
import * as http from 'http';
import { SDBServer } from '../built/index'; 

const server = http.createServer(8000);
const wss = new WebSocket.Server({ server });
const sdbServer = new SDBServer(wss);
server.listen();
const address = server.address() as AddressInfo;

Working with Documents

import { SDBServer, SDBDoc } from '../built/index'; 
//...

interface CounterDoc {
	counter: number;
	sd: {
		strEx: string;
		numEx: number;
	};
}

const sCounterDoc: SDBDoc<CounterDoc> = sdbServer.get('ex', 'counter');

sCounterDoc.createIfEmpty({
	counter: 0,
	sd: {
		strEx: 'ABC',
		numEx: 3
	}
});
scounterDoc.subscribe((eventType: string, ops, source, data) => {
	if(eventType === null) {
		console.log('subscribed', data);
	} else if(eventType === 'create') {
		console.log('create', data);
	} else if(eventType === 'op') {
		console.log(ops);
	}
	console.log(scounterDoc.getData());
	console.log(sCounterDoc.traverse(['sd', 'numEx']));
});

sCounterDoc.submitNumberAddOp(['counter'], 1);

const subDoc = d.subDoc(['sd']);
subDoc.subscribe();

subDoc.submitObjectReplaceOp(['numEx'], 33);

Connecting a Client (in browser):

const sdbClient = new SDB.SDBClient(ws);
const doc:SDB.SDBDoc<CounterDoc> = sdbClient.get('ex', 'counter');
doc.subscribe(() => {
	console.log('update');
});

Building

npm install .
npx tsc
npx webpack

To watch:

npx tsc --watch

or (if building for client-side)

npx webpack --watch

Testing

npm test

Auto-generated Documentation

sdb-ts's People

Contributors

soney avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.