Skip to content

Commit 5da256e

Browse files
Gavin/sky announcement post (#261)
* add content and properly sized images * spellcheck run * Add blog post open graph thumbnail image * address feedback * Update blog/2023-11-13-introducing-stately-sky/index.mdx Co-authored-by: Laura Kalbag <[email protected]> * Update blog/2023-11-13-introducing-stately-sky/index.mdx Co-authored-by: Laura Kalbag <[email protected]> * Update blog/2023-11-13-introducing-stately-sky/index.mdx Co-authored-by: Laura Kalbag <[email protected]> * Update blog/2023-11-13-introducing-stately-sky/index.mdx Co-authored-by: Laura Kalbag <[email protected]> * Update blog/2023-11-13-introducing-stately-sky/index.mdx Co-authored-by: Laura Kalbag <[email protected]> * Update blog/2023-11-13-introducing-stately-sky/index.mdx Co-authored-by: Laura Kalbag <[email protected]> * Update blog/2023-11-13-introducing-stately-sky/index.mdx Co-authored-by: Laura Kalbag <[email protected]> * adds starter app demo * Update blog/2023-11-13-introducing-stately-sky/index.mdx Co-authored-by: Laura Kalbag <[email protected]> * embed office hours call video * embeds office hours demo * use the actual youtube component, gavin. * Update gif for latest UI --------- Co-authored-by: laurakalbag <[email protected]>
1 parent 3554d05 commit 5da256e

File tree

6 files changed

+76
-0
lines changed

6 files changed

+76
-0
lines changed
249 KB
Loading
712 KB
Loading
Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
---
2+
title: 'Introducing Stately Sky'
3+
description: Announcing Stately Sky, the new way to run your state machines in the cloud.
4+
authors: [gavin]
5+
tags: [new, sky, serverless, cloud, run, machines, state, stately]
6+
date: 2023-11-13
7+
slug: 2023-11-13-introducing-stately-sky
8+
image: /blog/2023-11-13-introducing-stately-sky.png
9+
---
10+
11+
The Stately team is very excited to announce a new feature we’ve been working on for quite some time! Join us in welcoming Stately Sky to the Studio. Lovingly built with [PartyKit](https://www.partykit.io/), Sky is our new serverless platform for running workflows within the Studio. With Sky, users may now run their statecharts as live machines in minutes, complete with XState v5 actors and multiplayer support.
12+
13+
<!--truncate-->
14+
15+
## Why Sky: a seamless developer experience without the lock-in
16+
17+
We know that state machines are extremely powerful for defining app logic, and Sky supercharges the Studio by allowing developers to **_build and deploy_** workflows to the edge, all defined as state machines! Typically, when we think of building workflows or long running processes, we typically think of two possible paths:
18+
19+
- coding against large cloud services with cumbersome development environments, tons of boilerplate, and painful deployment processes
20+
- relying on low-code or no-code platforms that tend to be inflexible and require vendor lock-in
21+
22+
Sky aims to remove the barriers on both ends of the spectrum. We’ve always allowed developers to export their diagrams in the Studio as code, as JSON, and [more recently, as stories](https://stately.ai/docs/export-as-code#export-formats). There is no vendor lock-in from the Studio. Additionally, deploying workflows couldn’t be easier. Once the user has built and tested their machines in the Studio, they need only to generate an API key and click deploy.
23+
24+
![GIF demonstrating flow generation process](./generateFlow.gif)
25+
26+
After that, developers can interact with their “live actor” in the same way they’ve been able to work with other XState machines. There is an SDK for Sky-based actors, but the syntax is virtually the same, save for the initial connection and configuration:
27+
28+
```tsx
29+
const actor = actorFromStately(
30+
{
31+
url: 'url of the running actor',
32+
sessionId: 'unique session id for multiplayer',
33+
},
34+
skyConfig, //provided after initializing sky in your local dev environment
35+
);
36+
```
37+
38+
The snippet above is all that’s needed in code to connect an application to the live running actor in Stately Sky. For details on all the configuration steps, check out the [“Getting Started” guide](https://stately.ai/docs/stately-sky-getting-started) that walks through the full setup.
39+
40+
## Multiplayer: batteries included
41+
42+
Sky removes the complexity of spinning up a running web server in a cloud platform or hosting it on premise. Thanks to [PartyKit](https://docs.partykit.io/), real-time communication and multiplayer come built-in for the developer. Users don’t have to concern themselves with wrangling and scaling concurrent live connections in Sky. If a client needs to interact with a live actor, they need only the `sessionId` and the rest is handled for them. Both Sky and PartyKit are built using CloudFlare, allowing us to scale with the needs of the user.
43+
44+
## What can you do with Sky?
45+
46+
Since Sky actors are built using the same tools, the good news is that everything users can build in the editor can work with Sky The developer experience is exactly the same. After connecting to their live actors, users can inspect and send events just like they can with any other XState machine.
47+
48+
### Use cases
49+
50+
There are several instances where users would benefit from a live actor, particularly one that can accept requests from multiple sources. Running state machines as actors in Sky gives developers the readability of statecharts with the durability and fault tolerance of cloud compute. For example, long-running workflows where time is a serious constraint can be easily implemented and maintained within Sky. Workflows like:
51+
52+
- Multiplayer-collaboration sessions, like whiteboarding, document editing, and gaming.
53+
- Asynchronous workflows, like fetching large amounts of data in the background
54+
- Long-running backend processes like medical patient onboarding flows or inventory management
55+
56+
### How does it work?
57+
58+
![Diagram showing Stately Sky at the top, which communicates with the Sky SDK inside the user app. Stately Sky also communicates with PartyKit’s state orchestator which in turn talks to the PartyKit Scheduler for delayed transitions and to “machineHub”, which is built on Cloudflare Workers for platforms for stateless compute.](./componentDiagram.png)
59+
60+
Sky makes use of Cloudflare and PartyKit to handle the webserver lifecycle, orchestration, and compute. All those details are abstracted away from the user. Sky’s role is to consume user-defined statecharts and publish them as live actors. So, whenever it is time to interact with that live actor, the user would do so with the Sky SDK. That component is the “tie-in” between the live actor and the rest of the user application. The Sky SDK exposes the live actor to receive events no different from a standard XState actor.
61+
62+
## See Sky in action
63+
64+
Feel free to check out the [Stately Sky Starter app for interactive demos built on Sky](https://sky-starter.stately.ai/?page=trafficlight). They also serve as a great starting point for building your own Sky actors. Our very own Laura Kalbag also built [an interactive collaborative sleep demo built with Sky](https://laurakalbag.github.io/collaborative-sleep-sky/). Be sure to try the demo with multiple tabs open to simulate different users!
65+
66+
## Resources
67+
68+
Check out the resources put together by the team, including our office hours call where we show a preview of Sky in action. For a step-by-step primer, check out the [“Getting Started” guide](https://stately.ai/docs/stately-sky-getting-started) that walks through the full setup.
69+
70+
<YouTube id="_iTjIWq6M1g" />

package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,7 @@
4444
"prism-react-renderer": "^1.3.5",
4545
"react": "^18.2.0",
4646
"react-dom": "^18.2.0",
47+
"typecheck": "^0.1.2",
4748
"xstate": "^4.37.2"
4849
},
4950
"devDependencies": {
257 KB
Loading

yarn.lock

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8481,6 +8481,11 @@ type-is@~1.6.18:
84818481
media-typer "0.3.0"
84828482
mime-types "~2.1.24"
84838483

8484+
typecheck@^0.1.2:
8485+
version "0.1.2"
8486+
resolved "https://registry.yarnpkg.com/typecheck/-/typecheck-0.1.2.tgz#016e200b08c656159c5844698a8bd4ec22ca0435"
8487+
integrity sha512-noA7T++dtHFemmk++XgotLp47kcu8ezbvN3hUUljZvntPGDWi9Ci0c24x6onS92PxOUNZFYChH8KPXRaoCcjgQ==
8488+
84848489
typedarray-to-buffer@^3.1.5:
84858490
version "3.1.5"
84868491
resolved "https://registry.yarnpkg.com/typedarray-to-buffer/-/typedarray-to-buffer-3.1.5.tgz#a97ee7a9ff42691b9f783ff1bc5112fe3fca9080"

0 commit comments

Comments
 (0)