《技術管理觀點》電子報

工作到現在，覺得還是需要把自己的管理觀點寫下來，但又覺得不太適合寫在這個 Blog 內（還是想把這個 Blog 維持比較技術、新產品類的分享）。所以另外開了一個 Substack 的平台：《技術管理觀點》電子報。

目前固定週一會推出一篇技術管理的文章，包含軟體工程師的面試、報到、培育、績效評估、晉升等。也有不定期出刊的閒聊文章，例如談技術債。

如果對管理有興趣，想與我討論的話，可以在平台內留言，或是到 Facebook 粉絲團：技術管理觀點 私訊唷！

MCO Visa debit 卡，在台灣可以申請到的加密貨幣金屬卡

實體的卡片照片，在台灣難得可以拿到的金屬卡

這是一張蠻特別的卡片，由加密貨幣交易所新創 crypto.com 發行。需要抵押 50 MCO（約新台幣 8,000）元六個月，即可取得一張「金屬」的 debit card。六個月後，可以把這 8,000 取回，可以直接刷卡花掉，或是透過 ATM 提領出來（國泰世華ATM不收手續費）。

我在 4 月申請的，因為疫情的關係，卡片五月中才到；但最近改用 DHL 寄送之後，通常兩三天就會到了。

到六月底為止，在家樂福（需用 line pay）、UberEats 消費，皆回饋 10%

你可以透過信用卡儲值（手續費1%）到卡片內，再透過卡片消費，或是將比特幣、以太幣換成法幣後再消費也可以。

如果透過我的連結申請 https://platinum.crypto.com/r/gbb3ut2h5g，當抵押完成後，我們雙方都可以獲得等值美金 50 元的 MCO 幣。你可以直接換成法幣然後在家樂福消費。

2019 年的 SEO…

Backlinko 分享了在 2019 年的 SEO 指南，用淺顯易懂的方式介紹了 Google 的 RankBrain：一個根據使用者行為來學習的搜尋結果排名方式。另外 Google 也提出了 Dwell Time 的概念──瀏覽者在搜尋的目的頁面待了多久的時間，來幫助 Machine Learning 的 Model 更加完善搜尋結果的排名。

另外值得一提的點是，Voice Search（就是 Google Home / Alexa）等，可能是未來在 SEO 領域會越來越重視的地方。當 FAANG 這些大廠商在智慧家電領域投資越來越多的時候，人機的交互介面可能從傳統的鍵盤滑鼠螢幕，轉換到影像聲音。目前智慧音箱仍然沒有特別的殺手級應用，並不像智慧手機十年前剛出現的時候迅速的改變世界；另外智慧音箱仍有隱私的爭議，這些問題仍然是未來智慧家電必須要一個一個解決的。

最後，傳統的SEO觀念，包含連入連結、原創內容，以及喊了很久的 Mobile First 策略，仍然是 2019 年 SEO 觀念中很重要且不可或缺的要點。基本功仍然要紮實，才有可能在其他的 Add-on 脫穎而出。

HCE 手機信用卡體驗心得

新聞說台灣年底前會開放 Apple Pay、Android Pay 跟 Samsung Pay，但是 HCE 手機信用卡已經先開放使用了（需安裝 tWallet+）。目前支援的銀行（台銀、華南、永豐等…）都不是發卡量最大的幾家，而且只支援 Master 卡，但整體來說使用上還蠻方便的。

之前就申請了 HCE 信用卡，但一直沒機會測試，今天到了遠百剛好有機會可以試試看。
首先要先輸入密碼：

店員看到還以為是 Friday 錢包…XD 我直接跟店員說用信用卡模式就刷過了，一次 OK。

刷卡後馬上就能查到消費紀錄：

目前只支援 Master 卡，希望能儘快支援 JCB…
我猜 Apple Pay 跟 Android Pay 初期也只會支援發卡量大的銀行（中信、國泰）的卡，但目前我的主力卡都不是這幾家啊…XD

GitHub 的 chatop (2016)

在 Velocity 2016 裡面，GitHub 分享了如何用 Slack 為平台，建立機器人來輔助開發流程（如 CI、Deployment、Monitor等等）。

對於開發者來說，可以一邊討論就一邊把事情完成，整合了 README 等文件撰寫的工作；對於 Operator 來說，由於討論的過程在 Slack 上，也可以設計一個流程，當有事件發生時就 Alert OP，這樣可以讓 OP 在開發過程中也被告知，獲得必要資訊。

缺點就是資訊流通太快了，可能開完一個一小時會議之後，事情跟前一個小時差距就變得很大 XD 這點是需要團隊成員適應的地方。

安裝 Let’s Encrypt 的憑證與支援 HTTP/2

昨天花了一個多小時的時間，申請了 Let’s Encrypt 的憑證並更新上去，並且升級到 Apache 2.4.17 來安裝 HTTP/2 Module。

Let’s Encrypt 使用的 ACME Client 程式，目前有實驗性的支援 FreeBSD，基本上按照信件中的說明安裝即可。如果是 FreeBSD 9.x 的話，需要按照這個 GitHub Issue 的方式，自行編譯 trunk 版本的 pyca/cryptography，即可完成 ACME Client 的安裝。

安裝完成後，可以指定 webroot 當作認證檔案存放的位置，來給 Let’s Encrypt 驗證這個網域確實是申請人所有：


./letsencrypt-auto --agree-dev-preview --server https://acme-v01.api.letsencrypt.org/directory -a webroot --webroot-path /home/data/websites/jnlin.org/webroot certonly

簽好的憑證會放在 /etc/letsencrypt/ 裡面，效期 90 天。官方建議每 60 天 renew 一次。我自己打算先手動 renew 一次，沒問題的話就丟到 cron 裡面，兩個月自動 renew 一次。

安裝 Apache 2.4 + HTTP/2 Module 就沒什麼特別的，直接 ports 安裝，結束之後，把憑證設定上去，即可打開 HTTP/2 的功能。反倒是解決 WordPress 的 mixed content 問題花了比較多時間 XD

Google Tag Manager 簡介 (3) – 自訂代碼

雖然 Google Tag Manager 有支援很多代碼，但沒有支援的代碼，一樣可以用自訂的方式設定上去。

自訂代碼分為兩種：HTML 與圖片代碼。當觸發條件被滿足時，指定的 HTML 或圖片代碼會被載入到頁面上。

在代碼中，可以用 {{ 變數名稱 }} 來帶入變數的值。
設定好之後，使用的方法跟套用 Google Analytics 一樣。

如果要利用 Google Tag Manager 來套用 Mixpanel 追蹤的話，可以參考這篇 Mixpanel 分享的說明。

Google Tag Manager 簡介 (2) – 建立變數與自訂事件

上一篇文章中，我們建立了簡單的事件。但除了 PV 之外，我們還要追蹤網站上元素的點擊，或是其他特殊的事件。Google Tag Manager 已經有內建一些變數，可以指定條件，讓我們不需要寫程式就能追蹤部份的事件。

我們必須到「變數」這個 Tab 去啟用這些內建的變數。

目前支援的變數列表如下：

  • Page URL
    • Page Hostname
    • Page Path
    • Referrer
  • 公用程式
    • Event
    • Container ID
    • Container Version
    • Random Number
    • HTML ID
  • 錯誤
    • Error Message
    • Error URL
    • Error Line
    • Debug Mode
  • 點擊
    • Click Element
    • Click Classes
    • Click ID
    • Click Target
    • Click URL
    • Click Text
  • 表單
    • Form Element
    • Form Classes
    • Form ID
    • Form Target
    • Form URL
    • Form Text
  • 歷史紀錄
    • New History Fragment
    • Old History Fragment
    • New History State
    • Old History State
    • History Source

以下我們以「當使用者點擊頁面上 id 為 “to-be-clicked” 的物件」為例，建立一個事件：

1. 首先到「變數」，啟用「Click ID」這個變數。

2. 新增一個「觸發條件」，事件類型為「點擊」，觸發條件為「所有元素」，啟動時機為「部分點擊」。接著在啟動時機內設定條件為「Click ID 等於 “to-be-clicked”」。

3. 新增一個「代碼」，指定該「觸發條件」要發出的 Event 內容與要記錄到的 Google Analytics ID。

如果我們想設定的變數不在預設列表中，也可以用程式自訂一個變數。作法如下：

1. 新增一個「使用者定義的變數」，類型選擇「自訂 javascript」。

2. 輸入一個 javascript 函式，傳回值為變數值。例如：

function () {return $('body').data('state'); }

表示傳回 <body> 的 state 這個 data attribute。

另外，我們也可以在程式裡面觸發 Tag Manager 的自訂事件。首先先建立一個觸發條件，選擇「自訂事件」：

接著在程式內觸發此事件：

dataLayer.push({"event": "custom-event"});

Google Tag Manager 簡介 (1) – 建立事件

為了收集使用者資料與行為，現代的 Web App 或 Mobile App 都會埋很多 Tracking Code，例如 Google Analytics、Mixpanel 或是 Flurry 之類的。當埋的 Tracking Code 或需要追蹤的事件開始變多的時候，管理就會變的越來越複雜。另外，隨著分工越來越細，工程師們會常常接收到來自產品、數據或營運部門的資料紀錄需求。當資料需求越來愈多的時候，紀錄事件這件事情就變得很瑣碎。尤其，面對的是 Mobile App 時，由於每次要收集新的紀錄時，就必須將 App 重新送審，比起 Web App 來說會花費更多時間。

Google Tag Manager 提供一個「簡單滿足紀錄需求」的介面，讓紀錄事件這件事變得不一定要工程師寫程式來達成。不過需要對寫程式邏輯有一定的熟悉度，對於一般「企劃人員」可能還是有些門檻在。

在 Web 使用 Google Tag Manager 的方式很簡單，直接申請之後，會給你一串 HTML：

接著要到 Google Tag Manager 的頁面中建立要記錄到的服務。在 Google Tag Manager 介面中選擇「新增代碼」，可看到除了 Google Analytics 以外，還有以下的 Tracking Code 可以選擇：

設定完並存檔之後，我們就有一個代碼用來紀錄 Page View 了。接著在「觸發條件」這裡，設定想要追蹤的事件類型：

例如，建立一個「計時器」觸發條件，當網頁載入後超過 1 秒鐘，送出 timer1s 事件：

然後回到「代碼」這裡，再建立一個 GA 代碼，但這次「追蹤類型」要選擇「事件」，並且將剛剛建立的觸發條件設定為「啟動時機」：

這樣我們就順利建立了一個事件。最後，要記得要按下右上角的「發布」，剛剛設定的條件才會被佈署到正式的平台上，事件也才會被記錄到 Google Analytics 中：

下一篇文章，將會介紹「自訂事件」與「變數」的設定方式。