Skip to content

A fork of James Long's CRDT example app, annotated with extra code comments and a NOTES.md

Notifications You must be signed in to change notification settings

clintharris/crdt-example-app_annotated

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

25 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

This is a demo app used for my dotJS 2019 talk "CRDTs for Mortals".

Slides here: https://jlongster.com/s/dotjs-crdt-slides.pdf

View this app here: https://crdt.jlongster.com

It contains a full implementation of hybrid logical clocks to generate timestamp for causal ordering of messages. Using these timestamps, CRDTs can be easily used to change local data that also syncs to multiple devices. This also contains an implementation of a merkle tree to check consistency of the data to make sure all clients are in sync.

It provides a server to store and retrieve messages, so that clients don't have to connect peer-to-peer.

The entire implementation is tiny, but provides a robust mechanism for writing distributed apps:

  • Server: 132 lines of JS
  • Client: 639 lines of JS

(This does not include main.js in the client which is the implementation of the app. This is just showing the tiny size of everything needed to build an app)

Links:

How to Run

You can just open client/index.html in a browser (i.e., access via file:// URI). Alternatively, you can serve it from a web server (e.g., npx serve and open http://localhost:5000/client/).

By default, the UI will sync with the data hosted at https://crdt.jlongster.com/server/sync. See instructions below for syncing with your own local server.

Optional: Run the server to sync with your own database

  1. yarn install
  2. ./run to start the server (this will create server/db.sqlite).
  3. Open server/db.sqlite in a SQLite client and run server/init.sql to create the schema.
  4. Modify the UI to sync with your local server: edit client/sync.js:post() to use http://localhost:8006/sync instead of https://crdt.jlongster.com/server/sync.

About

A fork of James Long's CRDT example app, annotated with extra code comments and a NOTES.md

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 98.9%
  • Other 1.1%