Build a vanilla app with SkyState
Draft
This tutorial track is not written yet.
Build the same cumulative app as the React track, but use @skystate/core directly instead of React hooks.
Estimated time: 60 minutes.
What you'll build
- A public welcome value read with
client.publicState.get. - Hosted sign-in.
- A counter stored separately for each signed-in user.
- A notes list for each signed-in user.
- A settings form backed by a user-state draft.
Prerequisites
Node.js 20 or later (npm ships with it).
Part 1: Read a public value
Planned shape:
- Scaffold a plain TypeScript app.
- Install
@skystate/core. - Create a SkyState project with the CLI.
- Create a client with
createSkyStateClient. - Call
client.init(). - Read
welcomeTextwithclient.publicState.get('welcomeText', 'Hello!'). - Push a new public value with
sky state public push.
Part 2: Add sign-in and user state
Planned shape:
- Configure hosted sign-in.
- Complete the hosted sign-in flow.
- Read and update a
countvalue throughclient.userState. - Verify that each signed-in user gets their own counter.
Part 3: Save notes for each user
Planned shape:
- Read
noteswithclient.userState.get. - Append and remove notes through user-state writes.
- Verify that reload keeps the saved notes.
Part 4: Build a settings form
Planned shape:
- Create a user-state draft handle.
- Hold edits with
draft.set. - Save with
draft.push(). - Discard with
draft.discard().