做者 | 江昱來源 | 阿里巴巴雲原生公衆號只有本身吃本身的狗糧，本身作的東西纔不「🐶」。Serverless Devs 自發展之處到如今，已經經歷了幾個月的時間，在這幾個月，Serverless Devs 的成長是迅速的，這很大一部分的緣由是「咱們在吃本身的狗糧」，咱們相信，若是本身都用不爽的東西，你們必定很難用的起來。今天這篇文章，是一個關於 Serverless Devs 官網建設的文章，文章很簡單，也頗有趣。html

什麼是 Serverless Devs?

「Serverless Devs」是由阿里雲開源的 Serverless 開發者平臺，致力於爲開發者提供強大的工具鏈體系。經過該平臺，開發者能夠一鍵體驗多雲 Serverless 產品，極速部署 Serverless 項目。Serverless Devs 讓開發者以更短的路徑體驗到多個主流雲廠商 Serverless 產品，以更快的速度建立和部署 Serverless 應用，以更簡單、更自動化的方法進行項目管理和運維，Serverless 項目經過該平臺完成全自動化後，可節省 99.9% 的管理成本。 node

Github 地址：https://github.com/serverless-devs
Gitee 地址：https://gitee.com/organizations/serverless-devs/projects
Serverless Devs 官網：https://www.serverless-devs.com

Serverless Devs 與 Docusaurus

衆所周知，開源項目的官網不宜太複雜，其實簡簡單單的就好，因此咱們通過了很長時間的對比，最終選擇了 Docusaurus 做爲官網的框架選型。那麼問題來了，咱們選型結束以後，咱們要如何來建設官網？通過一些簡單的調研，咱們決定用 Serverless Devs 建設 Serverless Devs 官網，並將其部署到 Serverless 架構上，很繞嘴是吧？可是，這個過程卻真的很「經典」：咱們經過 Serverless devs 初始化了 Docusaurus：s init devsapp/website-docusaurus，這一部分能夠參考文檔：https://github.com/devsapp/website-example。講真，雖然也就是一行代碼的事情，可是整個初始化仍是比較「賞心悅目」的，做爲一個 Serverless 應用全生命週期的工具，Serverless Devs 在腳手架和引導層面仍是下了不少功夫的： git

能夠看到，初始化的時候，系統引導式的讓咱們填寫了項目名，存儲桶名，以及須要的密鑰信息，同時完成以後，還告訴咱們： github

You could [cd /Users/jiangyu/Desktop/start-fc/website/serverless-website] and enjoy your serverless journey!

感受仍是很貼心的。接下來，按照指引：web

能夠看到幫助文檔： npm

當執行 s website-starter -h 以後，首次運行幫助信息，可能涉及到組件加載過程，稍等片刻，能夠看到幫助信息： ubuntu

此時，咱們要將項目部署到線上，只須要執行 s deploy 便可。固然，咱們還須要對項目進行必定的配置，以及對咱們的官網進行必定的建設。關於網站建設，能夠參考 Docusaurus 的官網文檔，關於 Serverless Devs 的 website 組件配置，能夠參考上圖給咱們 🧭 More information: https://github.com/devsapp/website：架構

在文檔中能夠了解更多的配置內容，最終生成咱們的 s.yaml：app

edition: 1.0.0
access: website_access

services:
  website:
    component: devsapp/website
    actions:
      pre-deploy:
        - run: npm install
          path: ./
        - run: npm run build
          path: ./
    props:
      bucket: serverless-devs-website
      src:
        codeUri: ./
        publishDir: ./build
        index: index.html
        subDir:
          type: index
      region: cn-hongkong

CD 與 Serverless Devs

當咱們創建好了網站頁面，在本地也能夠正常運行，經過本地的 s deploy 也能夠順利部署了，這個時候面臨了新的問題：我如何更新個人網站？每次都要手動的在本地發佈麼？是否能夠利用 Github Action，接入自動化的能力呢？因此：框架

咱們建立了一個倉庫：https://github.com/Serverless-Devs/website
咱們將代碼推送到倉庫以後，建立了一個 Github Action 的配置：

name: Website Publish

on:
  push:
    branches: [ master ]

jobs:
  publish-website:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - uses: actions/setup-node@v2
        with:
          node-version: 12
          registry-url: https://registry.npmjs.org/
      - run: npm install
      - run: npm install -g @serverless-devs/s
      - run: s config add --AccountID ${{secrets.ALIYUN_ACCOUNT_ID}} --AccessKeyID ${{secrets.ALIYUN_ACCESS_KEY_ID}} --AccessKeySecret ${{secrets.ALIYUN_ACCESS_KEY_SECRET}} -a website_access
      - run: s deploy

此時我再 push 代碼，就能夠自動將網站發佈出來了。

這裏面的核心點以下所示：

安裝 Serverless Devs：run: npm install -g @serverless-devs/s
配置密鑰信息：run: s config add --AccountID ${{secrets.ALIYUN_ACCOUNT_ID}} --AccessKeyID ${{secrets.ALIYUN_ACCESS_KEY_ID}} --AccessKeySecret ${{secrets.ALIYUN_ACCESS_KEY_SECRET}} -a website_access
部署：run: s deploy

整個效果：

部署後的頁面：

這裏要說明，此處配置密鑰信息，使用了 Github 的 Secrets 功能，這個功能仍是比較基礎的，因此很少贅述，主要就是將發佈的所須要的密鑰信息配置到 Secrets 裏面。

總結

其實，目前來講不少人的博客，部分的官網都是經過靜態網站等進行部署，經過 Serverless Devs 走這一套仍是比較方便的：

得益於 Serverless Devs 的行爲描述，咱們能夠更簡單地將 npm install，npm run build 等指令集成到項目中。
得益於 Serverless Devs 的引導能力，包括建立、入門，以及密鑰配置時的獲取連接，Serverless Devs 確實在不斷的從細節出發，爲便利而努力。
得益於 Serverless Devs 的靈活性，只須要兩三行代碼，就能夠配置出 Github 的 CD 能力，將網站持續發出去，我的以爲這個仍是挺爽的。

固然，目前來看仍是有一些問題等待去作的：

Serverless Devs 的場景仍是有待豐富的。
這個社區官網只有 CD，沒有 CI 其實仍是有必定風險的，要慢慢的完善起來。

Serverless Devs 的官網是如何經過 Serverless Devs 部署的

什麼是 Serverless Devs?

Serverless Devs 與 Docusaurus

CD 與 Serverless Devs

總結