You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/stately-sky-getting-started.mdx
+12-9Lines changed: 12 additions & 9 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -10,9 +10,8 @@ This guide will walk you through the process of creating a simple traffic light
10
10
## Prerequisites
11
11
12
12
1. A Stately account with a [Pro or Enterprise subscription](https://stately.ai/pricing)
13
-
2.The starter project. [Clone the repo on your local machine](https://github.com/statelyai/sky-starter-app/tree/main)
13
+
2.Our Stately Sky starter project. [Clone the repo to your local machine](https://github.com/statelyai/sky-starter-app)
14
14
3. A machine to deploy as an actor. To test, feel free to fork our [stop light example](https://stately.ai/registry/editor/eb3e89f5-5936-439f-8254-2f6ea4303659?machineId=15fd8071-b80c-4a6f-b9f5-60b6cf578ee5)
15
-
4. A package manager, like [NPM](https://www.npmjs.com/package/npm) or [Yarn](https://yarnpkg.com/)
16
15
17
16
## Step 1: Create a machine in the Studio
18
17
@@ -42,15 +41,19 @@ Now that the API key is generated, you can deploy your machine to Sky as a runni
42
41
43
42
## Step 4: Add your API key to the starter project
44
43
45
-
Open the starter project in your code editor. At the root of the project, create a `.env` file to hold your API key.
46
-
There are 2 variables that need to be set in the `.env` file: `SKY_API_KEY` and `VITE_SKY_API_KEY`. Paste your API key as the value for both these keys.
44
+
Start by opening [the starter project](https://github.com/statelyai/sky-starter-app) in your code editor. Next install the packages using your package manager of choice:
The starter project relies on Vite to run the app. Vite uses the `VITE_` prefix for environment variables, so any code processed by Vite will not have access to any environment variables without that prefix.
52
-
For code that Vite doesn't touch, however, we rely on the `SKY_API_KEY` variable. This is why we set both variables to the same value.
53
-
:::
50
+
At the root of the project, create a `.env` file to hold your API key.
51
+
There are 2 variables that need to be set in the `.env` file, paste your API key as the value for both these keys:
52
+
53
+
1.`SKY_API_KEY` (used by the `@xstate/cli` to fetch the machine config).
54
+
2.`VITE_SKY_API_KEY` (used by the Vite React app to connect to Sky).
0 commit comments