clockworklabs / clockworklabs/SpacetimeDB

TypeScript Client QuickStart Updates

Open
#249 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

possibly-stale
Dominant language
Rust
Stars
25.2k
Forks
1.1k
Avg merge
2d 7h
Merged PRs (30d)
46

Description

Hi there -

A few things I noticed for the TypeScript QuickStart:

  1. useRef is used in the code but not imported, I added it to the import on line 1, so it is now import React, {useEffect, useState, useRef} from "react";
  2. The logo import on line 2 is not used, so I removed that line.
  3. For the line : var user = User.filterByIdentity(local_identity?.current?.toUint8Array()!); It should not be converted to a Uint8Array, so the line I got working was: var user = User.filterByIdentity(local_identity?.current!);
  4. I had to update the tsconfig.json file that was generated by create-react-app to say target=es6 in order to get the iterators to work. I'd suggest changing the instruction to tell folks they'll have to do that, as it doesn't appear to be possible to make it es6 as part of create-react-app.
  5. For the line: var identityStr = new Identity(user.identity).toHexString(); it does need to be converted to match the constructor, so the line I got working was: var identityStr = new Identity(user.identity.toUint8Array()).toHexString();
  6. For the line: var spacetimeDBClient = new SpacetimeDBClient("ws://localhost:3000", "chat", token); the text says 'replace <module_name> with the name you chose', but <module_name> isn't in the code, it's hard-set to chat. So I believe that line should be var spacetimeDBClient = new SpacetimeDBClient("ws://localhost:3000", "<module_name>", token);
  7. local_identity isn't a very Typescript-y variable name, so it should probably be tweaked to localIdentity or something like that.

It's possible this Issue should be over in this repo, since thats where this example code lives, but I'm not sure.

I think that's all the tweaks I had to make to get it running. I hope that helps! 👍🏻

One general piece of feedback would be to put working versions of the whole thing into a repo somewhere so it can be copied in one go rather than pieced together. I like the explanations a lot, but some of the "go back to this function and add this line" stuff was a bit tricky. I see there is a PR on the typescript-sdk repo that tries to do this, but has extra stuff.

Cheers!

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the linked TypeScript QuickStart guide and compare its imports, identity handling, client construction, naming, and tsconfig.json instructions with the reported working versions. Check the referenced typescript-sdk repository and branch to confirm where the example lives. Done means the guide's code and setup steps work as written in a fresh React TypeScript app.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
documentation
Issue type
Documentation
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
55/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.