diff --git a/public/logos/zerops.svg b/public/logos/zerops.svg new file mode 100644 index 0000000000000..8388d06ef727c --- /dev/null +++ b/public/logos/zerops.svg @@ -0,0 +1,7 @@ + + + + + + diff --git a/src/components/DeployGuidesNav.astro b/src/components/DeployGuidesNav.astro index ad13f3dc4e8b6..06109ce488d9f 100644 --- a/src/components/DeployGuidesNav.astro +++ b/src/components/DeployGuidesNav.astro @@ -43,6 +43,7 @@ const services: Service[] = [ { title: 'Kinsta', slug: 'kinsta', supports: ['ssr', 'static'] }, { title: 'Deta Space', slug: 'space', supports: ['ssr', 'static'] }, { title: 'Zeabur', slug: 'zeabur', supports: ['ssr', 'static'] }, + { title: 'Zerops', slug: 'zerops', supports: ['ssr'] }, ]; --- diff --git a/src/content/docs/en/guides/deploy/zerops.mdx b/src/content/docs/en/guides/deploy/zerops.mdx new file mode 100644 index 0000000000000..ba47aa195b64b --- /dev/null +++ b/src/content/docs/en/guides/deploy/zerops.mdx @@ -0,0 +1,164 @@ +--- +title: Deploy your Astro Site to Zerops +description: How to deploy your Astro site to the web using Zerops. +type: deploy +i18nReady: true +--- +import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro' +import { Steps } from '@astrojs/starlight/components'; + +[Zerops](https://zerops.io/) is a dev-first cloud platform that can be used to deploy an SSR Astro site. + +This guide will walk you through deploying an Astro project using the Node.js adapter to Zerops. + +## Prerequisites + +- **An Astro project using the [`@astrojs/node` SSR adapter](/en/guides/integrations-guide/node/)** +- **A Zerops account** - If you don’t already have one, you can [create a Zerops account](https://zerops.io/) for free. + +:::tip[Start from a template] +The [Zerops x Astro - Node.js example app](https://github.com/zeropsio/recipe-astro-nodejs) can be imported directly into your [Zerops Dashboard](https://app.zerops.io/dashboard/projects), and deployed in one click! + +```yaml +project: + name: astro +services: + - hostname: astronode + type: nodejs@20 + buildFromGit: https://github.com/zeropsio/recipe-astro-nodejs + ports: + - port: 4321 + httpSupport: true + enableSubdomainAccess: true + minContainers: 1 +``` +::: + +## Creating a Zerops Node.js project + +You can create a Node.js service for your Astro site through the [Zerops `project add` wizard](https://app.zerops.io/dashboard/project-add), or by importing an Astro site using `.yaml`. + +The following YAML structure will setup a project called `my-astro-sites` with a Node.js v20 service called `hellothere`. One Zerops project can contain many Astro apps. + +```yaml +project: + name: my-astro-sites +services: + - hostname: hellothere + type: nodejs@20 + ports: + - port: 4321 + httpSupport: true + minContainers: 1 +``` + + +## Building and deploying your app to Zerops + +Now that you've prepared a Node.js service on Zerops, you will need to create a `zerops.yml` file at the root of your project to trigger the build and deploy pipeline on Zerops. + +The following example shows configuring the required build and run operations for the example project with hostname `hellothere`: + + + + ```yaml title="zerops.yml" + zerops: + - setup: hellothere + build: + base: nodejs@20 + buildCommands: + - npm i + - npm run build + deploy: + - dist + - package.json + - node_modules + cache: + - node_modules + - package-lock.json + run: + start: node dist/server/entry.mjs + envVariables: + HOST: 0.0.0.0 + NODE_ENV: production + ``` + + + ```yaml title="zerops.yml" + zerops: + - setup: hellothere + build: + base: nodejs@20 + buildCommands: + - pnpm i + - pnpm run build + deploy: + - dist + - package.json + - node_modules + cache: + - node_modules + - pnpm-lock.json + run: + start: node dist/server/entry.mjs + envVariables: + HOST: 0.0.0.0 + NODE_ENV: production + ``` + + + ```yaml title="zerops.yml" + zerops: + - setup: astronode + build: + base: nodejs@20 + buildCommands: + - yarn + - yarn build + deploy: + - dist + - package.json + - node_modules + cache: + - node_modules + - yarn.lock + run: + start: node dist/server/entry.mjs + envVariables: + HOST: 0.0.0.0 + NODE_ENV: production + ``` + + + +### Trigger the pipeline using GitHub / GitLab +To setup continuous deployment on either a push to a branch or on a new release, go to your Node.js service detail and connect your Zerops service with a GitHub or GitLab repository. + + +### Trigger the pipeline Using Zerops CLI (zcli) + + +1. Install the Zerops CLI. + ```shell + # To download the zcli binary directly, + # use https://github.com/zeropsio/zcli/releases + npm i -g @zerops/zcli + ``` + +2. Open [`Settings > Access Token Management`](https://app.zerops.io/settings/token-management) in the Zerops app and generate a new access token. + +3. Log in using your access token with the following command: + ```shell + zcli login + ``` + +4. Navigate to the root of your app (where `zerops.yml` is located) and run the following command to trigger the deploy: + ```shell + zcli push + ``` + + +## Resources + +- [Deploying Astro to Zerops in 3 mins](https://medium.com/@arjunaditya/how-to-deploy-astro-to-zerops-4230816a62b4) +- [Detailed guide to creating a Zerops Node.js service](https://docs.zerops.io/nodejs/how-to/create) diff --git a/src/data/logos.ts b/src/data/logos.ts index 797eb09bc76de..a080f3aa862bb 100644 --- a/src/data/logos.ts +++ b/src/data/logos.ts @@ -88,6 +88,7 @@ export const logos = LogoCheck({ 'kontent-ai': { file: 'kontent-ai.svg', padding: '.15em' }, keystatic: { file: 'keystatic.svg', padding: '0' }, zeabur: { file: 'zeabur.svg', padding: '.2em' }, + zerops: { file: 'zerops.svg', padding: '.2em' }, apostrophecms: { file: 'apostrophecms.svg', padding: '.15em .15em' }, db: { file: 'db.svg', padding: '.1em' }, });