Skip to content

Commit ce6ff4d

Browse files
Filmbostock
andauthored
document deploys (#1648)
* document deploys * changes, per Toph's review * copy edits --------- Co-authored-by: Mike Bostock <[email protected]>
1 parent 25d986d commit ce6ff4d

File tree

1 file changed

+29
-7
lines changed

1 file changed

+29
-7
lines changed

docs/deploying.md

Lines changed: 29 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
# Deploying
22

3-
You can host your built Framework app on any static site hosting service, or self-host it with any static site server. This guide covers deploying to [Observable](https://observablehq.com), which is the easiest way to host your Framework app as support is built-in. We’ll also cover setting up automated deploys with GitHub Actions.
3+
You can host your built Framework app on any static site hosting service, or self-host it with any static site server. This guide covers deploying to [Observable Cloud](https://observablehq.com/platform/cloud), which is the easiest way to host your Framework app as support is built-in. We’ll also cover setting up automated deploys with GitHub Actions.
44

55
<div class="tip">
66

7-
If you don’t already have an app ready to deploy, create one by following our [Getting started guide](./getting-started).
7+
If you don’t yet have an app ready to deploy, create one by following our [Getting started guide](./getting-started).
88

99
</div>
1010

@@ -24,9 +24,17 @@ npm run deploy
2424

2525
The first time you deploy an app, you will be prompted to configure the app’s _slug_ (which determines its URL), access level, and other details. If you aren’t yet signed-in to Observable, you will also be prompted to sign-in.
2626

27-
When the deploy command finishes, it prints a link to observablehq.cloud where you can view your deployed app. If you choose *private* as the access level, that link will only be accessible to members of your Observable workspace. (You can invite people to your workspace by going to observablehq.com.) If you chose *public*, you can share your app link with anyone. You can change the access level of an app later [from your workspace projects <!-- TODO apps --> page](https://observablehq.com/select-workspace?next=projects).
27+
When the deploy command finishes, it prints a link to observablehq.cloud where you can view your deployed app. If you choose _private_ as the access level, that link will only be accessible to members of your Observable workspace. (You can invite people to your workspace by going to observablehq.com.) If you choose _public_, you can share your app link with anyone. You can change the access level of an app later [from your Data apps page](https://observablehq.com/select-workspace?next=projects).
2828

29-
<div class="tip">To see more available options when deploying:<pre><code class="language-sh">npm run deploy -- --help</code></pre></div>
29+
<div class="tip">
30+
31+
To see more available options when deploying:
32+
33+
```sh run=false
34+
npm run deploy -- --help
35+
```
36+
37+
</div>
3038

3139
## Deploy configuration
3240

@@ -42,7 +50,11 @@ The contents of the deploy config file look like this:
4250
}
4351
```
4452

45-
A deploy config file is required for automated deploys. You will need to commit this file to git to deploy via GitHub Actions.
53+
<div class="note">
54+
55+
A deploy config file is required for automated deploys. You should commit this file to git.
56+
57+
</div>
4658

4759
To store the deploy config file somewhere else, use the `--deploy-config` argument. For example, to create a “staging” deploy to share early versions of your app, you could use a `deploy-staging.json` like so:
4860

@@ -54,7 +66,17 @@ If the specified config file does not yet exist, you will again be prompted to c
5466

5567
## Automated deploys
5668

57-
To set up automatic deploys (also known as *continuous deployment* or *CD*), we recommend [GitHub Actions](https://github.com/features/actions). In your git repository, create and commit a file at `.github/workflows/deploy.yml`. Here is a starting example:
69+
Once the app has been set up, you can have Observable build the next deploys for you. You can build automatically _on commit_ (whenever you push a new commit to your project’s default branch) and _on schedule_ (such as daily or weekly).
70+
71+
Automatic deploys — also known as _continuous deployment_ or _CD_ — ensure that your data is up to date, and that any changes you make to your app are immediately reflected in the deployed version.
72+
73+
On your app settings page on Observable, open the **Build settings** tab to set up a link to a GitHub repository hosting your project’s files. Observable will then listen for changes in the repo and deploy the app automatically.
74+
75+
The settings page also allows you to trigger a build manually, add secrets (for data loaders to use private APIs and passwords), view logs, configure sharing, _etc._ For details, see the [Building & deploying](https://observablehq.com/documentation/data-apps/deploys) documentation.
76+
77+
## GitHub Actions
78+
79+
As an alternative to building on Observable Cloud, you can use [GitHub Actions](https://github.com/features/actions) and have GitHub build a new version of your app and deploy it to Observable. In your git repository, create and commit a file at `.github/workflows/deploy.yml`. Here is a starting example:
5880

5981
```yaml
6082
name: Deploy
@@ -88,7 +110,7 @@ jobs:
88110
89111
<div class="tip">As shown above, deploy messages can be set using <code>--message</code>. This is especially useful for continuous deployment from a git repository: the message can include the SHA, author, and message of the latest commit.</div>
90112
91-
When deploying automatically, you can’t sign-in in your browser the way you did for manual deploys; instead, your GitHub action will authenticate using an Observable API key (also known as a *token* and referred to as `OBSERVABLE_TOKEN` above).
113+
When deploying automatically, you can’t sign-in in your browser the way you did for manual deploys; instead, your GitHub action will authenticate using an Observable API key (also known as a _token_ and referred to as `OBSERVABLE_TOKEN` above).
92114

93115
To create an API key:
94116

0 commit comments

Comments
 (0)