Others 彙整 - Let's Write

用 reCAPTCHA v3 來做非機器人驗證

2020-11-18

本篇大綱：本篇要解決的問題。註冊 reCAPTCHA。v3 特有的 2 個值：action、score。頁面使用 reCAPTCHA 方法 1：直接埋 HTML。頁面使用 reCAPTCHA 方法 2：寫 JavaScript 使用。後端向 reCAPTCHA 驗證。

用 reCAPTCHA v2 來做非機器人驗證

2020-11-182020-11-13

本篇大綱：本篇要解決的問題。註冊 reCAPTCHA。頁面使用 reCAPTCHA 方法 1：直接埋 HTML。頁面使用 reCAPTCHA 方法 2：寫 JavaScript 使用。後端向 reCAPTCHA 驗證。取 IP。

Google Optimize A/B Testing 使用筆記

2020-09-15

本篇大綱：本篇要解決的問題。選用 A/B 版本測試。設定 A/B 版。要執行測試的網址規則。連結 GA 並設定目標。埋程式碼。執行測試。結果報表。最近想對本站的右側版面做些排列上的修改，很好奇「請喝咖啡」的區塊移上去，是不是成效會比較好？

用 GCP 建立 Cloud Functions

2020-09-02

本篇大綱：本篇要解決的問題。建立 Functions。測試 Functions。刪除 Functions。GCP 上也有建立 Cloud Functions 的服務，而且還有介面可以操作，對於建立、測試、刪除這些基本步驟，相較於 Firebase 要下命令，更為簡便。

Youtube Iframe API 常用功能

2020-08-252019-11-23

本篇大綱：影片愈來愈重要的這時代，前端會遇到嵌Youtube的相關需求。基本使用：嵌入影片+自動播放。1 html中放一個div，由JS去嵌入。2 html裡直接放個iframe。自製Youtube播放器。監聽Youtube播放狀態。Demo、原始碼。

用Firebase、Google Apps Script、GTM自己做一個讚按鈕

2020-08-262019-08-19

用Firebase、Google Apps Script、GTM自己做一個讚按鈕本篇大綱：為什麼要自己開發一個按鈕、按鈕樣式部份、按鈕功能部份、判斷使用者語系、在google apps script上寫API、cookies、發Google Analytics事件、埋程式碼html、css、js、結論

Google Top Heavy演算法

2020-08-252019-08-01

本篇大綱：頁面上廣告數量多少是很重要的、top heavy演算法關心的是什麼、要如何知道頁面上的廣告是不是過多？實作：設定廣告體驗報告。根據講師課堂上的解釋，top heavye演算法就是：把網頁切一半，如果上半部的廣告數量佔到4個以上，就會扣seo分數，進而影響排名。

Google Material Design 表單標籤效果

2020-08-252019-07-31

自從Google設計了Material Desgin後，除了按鈕的漣漪效果讓人驚豔外，表單label跟input的結合方試也跟著讓很多人「致敬」。最近想用Netflix追劇，在註冊的時候，就發現他們的表單就是用了一樣的效果，想想Google的設計連Netflix都在用了，看來是個好設計，就決定自己來寫一個。