[譯] 教學：如何使用實際按鈕將應用程式部署到生產環境

softnshare發表於2019-03-01

原文 Tutorial: How to deploy an app to production with an actual button

如果你熟悉部署流程，那麼你很有可能熟悉在推送到生產環境之前必須完成的一系列重複步驟。 這不是一個被描述為”有趣”的流程，但它仍然是一個重要的過程。

但是，如果我們可以使用一個真正的按鈕來部署和釋出一個應用程式呢？ 在這篇文章中，我們將討論如何製作自己的 “ship it” 按鈕來部署一個新版本。

Ship it GIF

先決條件

為了跟進這個教程，你需要:

  1. 一個 AWS IoT Dash 按鈕: 為了快速啟動，我們將使用一個預製的物聯網按鈕，你可以在亞馬遜上購買

  2. 一個 AWS 賬戶: 建立一個 AWS 賬戶。 即使你有一個 Amazon.com 賬號，你也需要建立一個。 我們將使用 AWS Lambda 工具呼叫 GitHub API。

    注意: 此服務為您使用的資料收費。 您也可以從您的手機使用虛擬的 dash 按鈕服務。 而且我們的指南中的程式碼可以連線到任何應用程式，而不僅僅是 AWS。
  3. 建立你的開發環境：在與 AWS Lambda 連線時，我們將使用Node.js 6.10。下載最新的 node 版本，或者只是用 Lambda 來開發
  4. 一個 GitHub 賬戶: 建立一個 GitHub 帳戶。 它快速，簡單，當然，是免費的

  5. 一個 GitHub API 訪問令牌:產生一個一個個人訪問令牌允許你在通過 API 或以其他方式使用 GitHub 時認證您是誰。 :

    • 到 github.com/settings/to…
    • 點選生成新的令牌
    • 選擇我們將用於教程的範圍: repo_ deployment, write:packages, read:package

一旦你完成了所有的先決條件，就開始安裝流程的其餘部分。

步驟1: 編寫 GitHub API 呼叫

使用 Node.js 呼叫 GitHub API 和 Octokit / rest.js程式庫來包裝 API 呼叫。 和其他任何程式庫一樣，Ocatkit 使用 GitHub REST API 端點ーー但它也允許我們使用 await、promise、和 callback 包裝。 此外，我們可以在開始時進行身份驗證，然後執行我們的呼叫。

讓我們看一下我們將建立的

index.js

檔案。

步驟 1a: 設定 Octopkit

在檔案的頂部，我們包含了我們的 Octokit npm 套件:

const octokit = require(`@octokit/rest`)()
複製程式碼

Step 1b: Authenticating

步驟 1b : 認證

然後我們使用我們新建立的個人訪問令牌與 GitHub 進行身份驗證:

octokit.authenticate({
type: `token`,
token: process.env.GH_TOKEN
})
複製程式碼

步驟 1c: 設定事件處理程式

為了使用 AWS Lambda，我們需要一個處理程式來理解當按鈕被點選時該怎麼做。 我們新增了包裝:

exports.handler = (event, context, callback) => {
console.log(`Received event: ${event}`)
let tag_name
const owner = process.env.GH_LOGIN
const repo = process.env.GH_REPO
}
複製程式碼

Step 1d: Retrieving and creating the latest release

步驟 1d: 取出並建立最新的版本

在exports.handler函式中，你會發現releases。 GitHub Releases API 是一個隱藏的寶石，在 Repository API 下方。 您可以建立一個草案，預先發布，設定釋出來源的分支，這一個 API 呼叫還有更多功能。

為了這個情況，我們將取得最新發布版本，並將其增加一個版號。 然後每次點選按鈕，我們都會釋出一個新版本。

下面這兩個方法都是Promises，一旦最新版本被取出，將會建立一個新的版本。 要做到這一點，我們需要我們的 GitHub 使用者名稱，我們想要釋出的 repository，以及一個將建立的tag_name。 我們可以新增一些可選的細節，但是這邊都是最基本的設定:

 octokit.repos.getLatestRelease({
owner,
repo
}).then(result => {
tag_name = (parseInt(result.data.tag_name) + 1.0).toString() + `.0`

octokit.repos.createRelease({
owner,
repo,
tag_name
}, (error, result) => {
if (error) throw new Error()
if (result) console.log(`Created Release: ${JSON.stringify(result)}`)
})
})
複製程式碼

步驟 1e: 建立一個部署

除了建立一個釋出版本，我們將通過呼叫 GitHub 部署 API 來開始部署。 我們可以通過指定登入帳號、repo、要部屬的分支來實現這一目標:

 octokit.repos.createDeployment({
owner,
repo,
ref: `master`,
description: `Deploying ${tag_name} version`
}, (error, result) => {
if (error) throw new Error()
if (result) console.log(`Created Deployment: ${JSON.stringify(result)}`)
})
複製程式碼

一旦釋出和部署方法在事件處理程式中，程式碼幾乎就已經設定好了。 我們使用 Node.js，所以確保執行npm init和npm install @octokit/rest 來確保環境被設定好。

在這整個設定流程中一個 repository 已經建立好了，當我們需要在程式碼中呼叫時，你可以在步驟3中找到連結。 為了實際執行程式碼，讓我們首先配置新的 AWS IoT 按鈕。

步驟2: 配置 AWS 物聯網按鈕

要設定按鈕，請按照 AWS 快速啟動指南或者下載 AWS IoT Button Dev 應用程式，可以在 iOS 或者 Android 上使用。

一旦你的按鈕配置了 WiFi，請隨意測試 lambda 範例函式，比如傳送文字或電子郵件。 接下來我們將建立一個新的函式。

步驟3: 設定 AWS Lambda 函式

一旦我們設定好 lambda 函式，我們就可以準備釋出了！ 瀏覽到 AWS Lambda 函式控制檯。

步驟 3a: 建立函式

在橘色中，你會看到一個”Create Function”按鈕，不管你是在檢視儀表板還是函式。 下面是詳細的步驟，以走訪這個流程。 如果你被卡住了，試著看看這段視訊。

  • 點選 Create Function 和 Author from Scratch
  • 輸入一個 “Name”
  • 確認執行環境是 Node.js 6.10
  • 在”Role” 底下，選擇 Create new role from template(s)
  • 輸入”Role Name”。 它可以和”Name”一樣
  • 在”Policy Templates”下方，選擇AWS IoT Permissions

步驟 3b: 新增按鈕觸發器

一旦你的函式被建立，你將看到它有一些我們可以配置的不同的設定。 我們將編輯函式的 “Designer”、”Function Code”和”Environment Variables” 等方面功能。 讓我們從”Designer”開始。

  • 在”Designer”中新增 AWS 物聯網觸發器。 應該會出現 “Configure Triggers” 方框
  • 選擇 IoT Button 作為物聯網型別
  • 輸入位於按鈕背面的裝置序列號
  • 確認檢查 Enable the Trigger 後，然後單擊新增

步驟 3c: 上傳程式碼

現在我們已經設定了按鈕觸發器，我們需要確保程式碼是正確的。 我們將從步驟2中獲取程式碼並上傳 zip 檔案。

如果你想使用你之前寫的程式碼，請用zip -r ShipItButton.zip ./*將資料夾的根目錄打包壓縮。 否則你將會收到一個cannot find /index.js error的錯誤，除此以外用git clone https://github.com/ani6gup/ShipItButton.git複製 repository 的內容。 確保

ShipItButtonLambda.zip

檔案是這個 repository 的內容複製。

一旦你有了 zip 檔案:

  • 在”Designer”中按下”Function Name”方框以顯示”Function Code”方框
  • 移動到”Function Code”
  • 在”Code Entry Type”下，選擇Upload a .zip file
  • 上傳你的檔案後，點選”Save“。 你現在應該有能力作”Edit Code Inline”

步驟 3d: 加入環境變數

  • 移動到”Environment Variables”
  • 建立GH_LOGIN, GH_REPO, 和GH_TOKEN 為你的環境變數，設定你的 GitHub login，你希望釋出的 GitHub repository，以及你先前建立的 GitHub 個人訪問令牌

步驟 3e: 測試

現在我們準備用下面的步驟來測試我們的按鈕:

  • 點選 Test，彈出名稱為”Configure Test Event”的按鈕
  • 選擇 Hello World Event Template (Default)
  • 輸入一個 “Event Name”
  • 點選 Create

當你點選 Test 前，你應該能夠在你的 github repository 中看到新的釋出版本，這些新的釋出版本被建立有Created Deployment 和 Created Release 的日誌。

注意: 只有一個既有的釋出版本存在數字格式(例如1.0)，這個釋出版本才會發揮作用

。

你可以檢視你的新的釋出版本是否建立在你的 repositoryurl / release 目錄中。 檢查日誌以確保沒有發生錯誤。 如果你看到{message: not found}或{message: bad credentials} 檢查你的 Github 個人訪問令牌。

步驟4：點選按鈕

現在回到”Configure Trigger Stage”，確保你的按鈕已經設定好。 你應該可以點選這個按鈕，並且得到和你測試時一樣的結果。

接下來我們將詳細討論如何在不同工作流程中將你所觸發的 GitHub 事件合併到一起。

步驟5(可選) : 在你的工作流程中整合

點選這個按鈕會觸發一個釋出和部署ーー但是你怎麼處理這些資訊呢？ 此時，您可以將其配置到你的工作流程或部署流程中。 下面的圖表概述瞭如何在按鈕或”Tooling”、 GitHub 和我們的伺服器之間進行通訊。

Tutorial__How_to_deploy_an_app_to_production_with_an_actual_button___The_GitHub_Blog

有幾個部署服務和供應商可供選擇。 在 GitHub，我們使用 Heaven 直接部署我們的聊天機器人Hubot。 一些公司甚至將其調整為自己的流程。 還有一些應用程式在 GitHub Marketplace，特別是幫助開發人員快速和簡單的部署。

為了部署一個應用程式，我們使用 Probot，一個建立 GitHub Apps 的工具，並以一種快速簡單的方式自動化您的工作流。 在這種情況下，它充當第三方來監聽部署事件，並通過建立 issues 發回部署狀態。

步驟5a (可選) : 使用 Probot 自制的部署伺服器

該應用程式基於 GitHub 交付部署指南，但是修改為 Node.js，以為了要使用 Probot。

在這種情境下，bot 會監聽特定的 GitHub 事件，這意味著當有人按下按鈕來建立部署時，應用程式知道建立和推動新的 Buildー並提供部署狀態。 這個按鈕部署到 heroku ー他們的 Build 和Release API 允許我們推送 GitHub 釋出包並立即從一個單獨的 POST 請求中部署。

如果你想看一看或者自己試試，可以在the Deployment Status Bot repository中學習更多。

結論

雖然你可能不會透過單擊一個實體按鈕來定期將應用程式部署到生產環境中，但你總是可以觸發這些 GitHub 事件來混合重複的部署流程。

如果你需要任何額外的資源或幫助，請隨意瀏覽 GitHub 應用程式快速啟動指南。 或者註冊 GitHub 開發者程式，在 GitHub 平臺論壇上提問。

更多 Soft & Share 分享內容

相關文章