| 1 | # Orbiter |
| 2 | |
| 3 | import { Button } from 'vocs/components' |
| 4 | |
| 5 | <img src="https://docs.orbiter.host/light_logo.svg" alt="orbiter" className="mx-auto" /> |
| 6 | |
| 7 | Much like the [inspiration](/why-bhvr) behind bhvr, [Orbiter](https://orbiter.host) is a site hosting platform built on the principles that the web should be open and without walled gardens. It features many of the things every dev wants: |
| 8 | |
| 9 | - Simple CLI for local builds and deployments |
| 10 | - Custom Domains |
| 11 | - Analytics |
| 12 | - Version Control for easy rollbacks |
| 13 | - GitHub actions for automated deployments |
| 14 | - Serverless Functions |
| 15 | |
| 16 | In this guide we'll show you how to deploy your [`client`](/packages/client) to Orbiter in no time at all. |
| 17 | |
| 18 | ## Client Deployment |
| 19 | |
| 20 | ::::note |
| 21 | Orbiter is currently only for client side rendered sites (aka static sites) |
| 22 | :::: |
| 23 | |
| 24 | ::::steps |
| 25 | |
| 26 | ### Setup Orbiter Account |
| 27 | |
| 28 | Visit [app.orbiter.host](https://app.orbiter.host) to create a free account and make an API key on the [App Dashboard](https://app.orbiter.host) or on the [Keys Page](https://app.orbiter.host/api-keys) |
| 29 | |
| 30 | ### Install the Orbiter CLI and Authorize |
| 31 | |
| 32 | ```bash [terminal] |
| 33 | bun add -g orbiter-cli |
| 34 | ``` |
| 35 | |
| 36 | ```bash [terminal] |
| 37 | orbiter auth |
| 38 | ``` |
| 39 | |
| 40 | ### Deploy `client` |
| 41 | |
| 42 | Move into the `client` package and run the `deploy` command |
| 43 | |
| 44 | ```bash [terminal] |
| 45 | cd client |
| 46 | |
| 47 | orbiter deploy |
| 48 | ``` |
| 49 | |
| 50 | :::: |
| 51 | |
| 52 | ## GitHub Actions |
| 53 | |
| 54 | Orbiter also offers GitHub Actions which can be used to deployment automatically. |
| 55 | |
| 56 | If you haven't already, [create a free account](https://app.orbiter.host) and create your first site. Then you will need the following information: |
| 57 | |
| 58 | - Project Name: This would be the name you chose when you made the site. For example, the site `mysite.orbiter.website` the name would be `mysite` |
| 59 | - Build Directory: The name your build directory, e.g. `dist`, `out`, `public`, etc |
| 60 | - Orbiter API Key: This can be created on the [API Keys Page](https://app.orbiter.host/api-keys) of the Orbiter App |
| 61 | - Node Version (Optional): Define the version of Node you want to use, will default to v20 |
| 62 | - Build Command (Optional): Define the command used to build, default is `npm run build` |
| 63 | |
| 64 | Once you have all of this info prepared make a new directory called `.github` in the root of your folder, then add a directory called `worflows` to it. Finally make a new file called `deploy.yaml`. |
| 65 | |
| 66 | Alternatively run this in terminal: |
| 67 | |
| 68 | ```bash |
| 69 | mkdir -p .github/workflows && touch .github/workflows/deploy.yaml |
| 70 | ``` |
| 71 | |
| 72 | Paste in the following code into the `deploy.yaml` file with your config listed earlier |
| 73 | |
| 74 | ```yaml |
| 75 | name: Deploy |
| 76 | on: |
| 77 | push: |
| 78 | branches: [main] |
| 79 | |
| 80 | jobs: |
| 81 | deploy: |
| 82 | runs-on: ubuntu-latest |
| 83 | |
| 84 | steps: |
| 85 | - uses: actions/checkout@v3 |
| 86 | |
| 87 | - name: Deploy to Orbiter |
| 88 | uses: orbiterhost/orbiter-github-actions@v0.1.4 # Update with latest version |
| 89 | with: |
| 90 | project-name: "mysite" # Name of your project |
| 91 | build-dir: "./dist" # Name of the build output directory |
| 92 | api-key: ${{ secrets.ORBITER_API_KEY }} # Will use repository secret |
| 93 | # Optional inputs with their defaults |
| 94 | node-version: "20.x" # Optional, defaults to '20.x' |
| 95 | build-command: "npm run build" # Optional, defaults to 'npm run build' |
| 96 | ``` |
| 97 | |
| 98 | Lastly you will need to add your Orbiter API Key as a Repository Secret. Navigate GitHub project Settings > Secrets and Variables > Actions. Click `New repository secret`, then use `ORBITER_API_KEY` as the name, and then paste the secret into the box below. |
| 99 | |
| 100 | Then you're all set! On your next deployment you can check the `Actions` tab of the GitHub project to make sure it deployed successfully. |
| 101 | |
| 102 | ## Further Reference |
| 103 | |
| 104 | For more information about how to use Orbiter visit the official docs with the link below |
| 105 | |
| 106 | <Button href="https://docs.orbiter.host">Orbiter Docs</Button> |