vue 的axios interceptors error希望彈出element-ui 通知

, ,

通常在 vue 專案中，我們會把 axios 單獨出一隻檔案，在裡面會創建 axios 實例、實作 request 和 response 的攔截器…等等。

閱讀更多
0
/0 評論/通過：

在gitlab部署vue專案到cloud run

, ,

vue 專案目前放在 gitlab 上管理，為什麼不放在 github？因為環境變數.env、config 檔案都無法進入 git 記錄，很麻煩。如果你是想要展示作品，可以放在 github，但是如果是一個有機密資料的專案，我還是都會選擇放到 gitlab，而且 gitlab 的 CICD 自動化部署真的是很方便。

閱讀更多
0
/0 評論/通過：

express + firebase-admin push notification to react-native

,

要推送通知到 react native，除了可以從 firebase 網頁去發送以外，也可以透過安裝firebase-admin套件把發送的方法傳到 api 裡，實現利用打 api 來發送通知。

大綱：

  1. 新增firebase專案 & 設定
  2. 安裝firebase-admin & 設定
  3. router中引用
閱讀更多
0
/0 評論/通過：

把本地 mysql 資料轉移到GCP SQL

,

在本地開發的專案，最終都會需要放到遠端，這時候我就遇到一個問題，除了前後端都要上GCP之外，還有database也要上去啊！！

這邊題外話，每次進到GCP，就會有種莫名恐懼，選項好多，好怕亂按就執行甚麼毀滅性任務，如果你有跟我一樣的感覺，表示我不孤單，新手總是有很多無法掌控的不安全感ＸＤＤＤ

閱讀更多
0
/0 評論/通過：

安裝Google Cloud SDK

,

想要把本地的檔案推到 GCP 上面，一定就會使用到Google Cloud SDK，官網上面有說明安裝的步驟，但是都是英文，所以這邊硬是把它翻譯一下，拆解步驟：

這邊是使用 macOS 系統， windows 的指令可能會有不同，所以如果是 windows 的系統，指令部分還是要參考官網。

閱讀更多
0
/0 評論/通過：

如何使用 Docker 打包 vue 專案

,

部署 vue 的 spa 網站到 GCP，可以直接部署靜態網站到 GCP 的 App Engine，也可以用 docker 打包 image，推到 GCP 的 Container Registry。

你必須先完成的事：

  1. 在電腦安裝docker
  2. cd到你的專案路徑下
閱讀更多
0
/0 評論/通過：

express 使用 JWT 製作登入 token 機制

,

現在碰到的每個網站幾乎都會需要登入機制，就算網站的內容不用登入也可以查看，還是有很多人喜歡加一個會員登入機制，搜集使用者資訊，進行再行銷。

在公司與其他後端合作，登入機制其實就只要打後端開好的 api 就可以了，給後端帳密，他們就會回傳 token，因此我從來沒有好好了解登入是怎樣的運作，token 又是怎樣產生的XD

最近剛好要做一個自己登山要用的系統，裡面存放有一些敏感資訊，但是又想要把網站上線給其他山友使用，所以就想做一個登入機制，讓本女王幫你創建帳號才可以進去看＾3 ^ ~~

由於原理我也是上網查資料的，都是別人辛苦寫作的心血，這邊就不複製貼上了，著重在我自己實驗的結果。

大綱：

  1. 安裝 jsonwebtoken
  2. 登入時回傳token
  3. 使用 middleware
閱讀更多
0
/0 評論/通過：

express + socket.io 推送訊息至前端

,

由於我們後端工程師實在是忙得不可開交，而且交給老闆看的demo總不能一直

「這邊等後端好之後就會收到了」、

「那邊我目前先寫死，等有資料後就能運作」…

一堆這種讓老闆有機可乘說你只做90分的理由，

因此我決定來著手弄個最最最簡單的 server，express 就是最適合做這種小小實驗性質的 mock server，又剛好我只需要會寫 javascript，那就一步一步來吧。

閱讀更多
0
/0 評論/通過：

使用 Gitlab cicd 佈署 React Native專案

,

現在大部分公司的專案都會放在自己的機台，並安裝 Gitlab 做管理，其實身為一個前端工程師，一定會在各種時候需要略懂一些其他領域的知識，就像這篇我要記錄的自動化部署 ，讓每個協作者開發完成後，發佈新版本時候確保專案有適時載入所有 package 與成品有正確上傳到線上環境。只需要額外撰寫 .gitlab-ci.yml 放在根目錄，Gitlab Runner 就可以自動去跑部署流程囉！

因為每間公司的流程跟限制不同，以我自己的例子，我們公司只會有兩種環境 : development、production。另外在 Gitlab Runner 那端由 IT 人員處理，所以這邊無法多作說明，這邊主要就是以前端的角度去實踐。

要做到自動化部署，會經歷以下幾件事 :

  1. 撰寫package.json的script
  2. 撰寫deploy.sh
  3. 撰寫.gitlab-ci.yml
閱讀更多
2+
/0 評論/通過：

React Native Remote Notification

,

如何使用 react native + react-native-push-notification + firebase cloud messaging 傳送遠端測試通知到 android emulator。

本篇使用的設備跟環境：

  1. windows電腦
  2. 已安裝android studio並且依照RN官網做好設定
  3. npm

要在電腦上的emulator上收到遠端通知，需要準備以下幾件事 :

  1. 創建一個firebase專案
  2. 為firebase專案加入android applications
  3. RN專案安裝react-native-push-notification套件
  4. RN專案設定firebase相關依賴
  5. RN專案訂閱channel
  6. 檢查android emulator是否符合FCM設備要求
  7. 從firebase cloud messaging發送測試通知
  8. 查看是否收到通知

如果你有自己的後端 server（像是 express），似乎你還是需要創建 firebase 專案，差別只在於你可以不用進行第7步驟，其他步驟一樣都是必須的。

閱讀更多
0
/0 評論/通過：