在目錄資料夾下./ 創建一個 jenkins_home目錄 docker-compose version: '3.4' services: jenkins: image: jenkins/jenkins:2.249.2-lts container_name: jenkins volumes:

Node Node 是能夠運行 JavaScript 的開放原始碼、跨平台執行環境。 NVM (node version manager) nvm 為管理 node 版本的套件 使用說明：如果有某個專案的建置環境為 node v16 的版本，但現在最新的 node 版本是 v18，那麼就需要 nvm 來管理電腦的 node 版本，可以快速切換個版本。 查看當前電腦的nvm是使用那個node版本 $ nvm current

近期在研究 React Native 的架構，就剛好把筆記整理一下並記錄下來，大多數內容來至於上面教學網站，然後透過自己的經驗消化後寫一個簡單的版本做紀錄，使用 RN 的版本為 v0.71 。 Base React Native 兩種開發專案類型 React Native CLI 初始建立專案 React Native 目錄架構 & LifeCycle React Native 使用套件說明 Develop React Native WebView 使用介紹 建立 Native Module 給 React Native 使用（RN 呼叫 Native）

iOS 環境需求Node v19.5.0Ruby v2.7.5（用 rbenv 去安裝）mac 預設是 2.6.8，會遇到下面錯誤訊息，需要升級 Ruby 版本才可以使用使用 Homebrew 安裝 Ruby 2.7.5 方式：Xcode14.0.1CocoaPods1.11.3Watchman(Options)2023.02.20.00 Android 環境需求Java （可以用 brew 安裝 Zulu OpenJDK）Android Studio 需要包含以下項目Android SDKAndroid SDK PlatformAndroid Virtual Device進入 Android Studio 安裝 Android 12 （ SDK Manager ）設定電腦環境 ANDROID_HOMEexport ANDROID_HOME=$HOME/Library/Android/sdk export PATH=$PATH:$ANDROID_HOME/emulator export PATH=$PATH:$ANDROID_HOME/platform-tools iOS 及 Android 環境配置好後，就可以使用 RN CLI 建立專案npx react-native@0.71.4 init <ProjectName> 運行 Android 專案npx react-native run-android 運行 iOS 專案npx react-native run-ios 運行專案時，會開啟 Metro，不要關閉它

iOS 專案在 Archive 的時候會自動將 main.jsbundle 加入到 ipa 中。 但可以手動產出 main.jsbundle。 react-native bundle --entry-file index.js --platform ios --dev false --bundle-output ios/main.jsbundle --assets-dest ios 使用 Xcode 開啟專案（ ios/~.xcworkspace），執行 Archive 會自動產生 main.jsbundle 於 IPA 中。 使用 Xcode 開啟專案（ ios/~.xcworkspace），如果是用 RUN ，會啟動 Metro Server，若未執行 Metro Server 則會看到以下錯誤訊息。

React Native 有 2 種方式，可選擇其中一種開發方式 Expo React Native CLI Expo 無需設定環境即可開發雙平台的架構，Exop 已經安裝好執行環境，可以免除建置開發 Android 跟 iOS 環境的需求，非常方便學習及練習用，但相對的缺點就是如果用 Expo 開發時，若要針對 Native 去撰寫一些客製化的功能可能會比較麻煩。 因次建議初學者可以使用 Expo 學習 React Native 的開發方式，或是評估目標 APP 只會使用到簡單的功能都有包含在 Exop SDK 下。

起因 一直都聽說docker的厲害及方便，寫前端的我其實也根本懶得去碰後台，所以只有網路上看一些文章了解一下下，但剛好最近負責後台的同事有警急任務上身，不想一直打擾他作業的情況下，我就跟同事提出你簡單說明一下，我自行研究看看怎麼使用docker，自己去後台來使用，就不用一直麻煩你了，同事就說可以喔，非常簡單你只要docker-compose up -d 就萬事ok，然後就丟了一個文件docker-compose.yml檔給我，我說～這麼簡單？？？同事露出邪惡的笑容說就是那麼簡單，然後我就採坑了一個禮拜，才把它給up起來，所以就一一把過程記錄下來，提醒自己順便給需要的人看看吧！ 介紹 這次是我需要架設一個獨立的環境，來提供網頁來運行，所以用docker把前後端全部一次打包起來，這個環境包有： 前端網頁：目前用 vue 打包出來的disk檔 後台資料庫：mysql+phpmyadmin nginx：docker 裡面的伺服器管理 http service : (apache felix)

docker 教學：https://yeasy.gitbooks.io/docker_practice/content/compose/introduction.html docker 命令： https://www.runoob.com/docker/docker-command-manual.html docker build 命令： https://www.runoob.com/docker/docker-build-command.html dockerfile 解說： https://www.jinnsblog.com/2018/12/docker-dockerfile-guide.html

Docker Run 使用 $ docker run --name some-nginx -p 8888:80 -v /some/content:/usr/share/nginx/html:ro -d nginx -d 背景執行 -v 把nginx內預設/usr/share/nginx/html的目錄指向/some/content :ro 指定為唯讀 -p 對外開Port 8888:80 DockerFile 使用 Docker Compose 使用 K8S 使用

如何設定讓git不要對某些文件及檔案做管理？ 建立一個.gitignore檔案，裡面的路徑檔就不會被追蹤 dist //整個目錄 dist/*.js //目錄下的所有.js檔案 dist/aaa.html //特定檔案 ＊＊＊如果.gitignore檔案是之後才加上，原本已經有的還是在git上面，必須先取消git上的追蹤，並刪除 $ git rm -r --cached dist //資料夾

http://mt116.blogspot.com/2017/11/homebrew.html https://shockerli.net/post/macos-homebrew-manual/ 安裝brew，用macOS的ruby安裝brew $ /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)" //安裝brew $ brew update //更新電腦上全部的 Formulae $ brew upgrade //更新所有已安裝的套件 $ brew help

File file = new File(path); FileInputStream fin = new FileInputStream(file); ServletOutputStream out = resp.getOutputStream(); // 一個一個讀取 read() 他會回傳下一個的字節data int ch = 0; while ((ch = fin.read()) != -1) { out.write(ch); } out.close();

Angular 上傳進度條使用 const reqVideo = new HttpRequest( 'POST', '/api/upload/video', this.videoFile, { reportProgress: true, } );

JSONP（JSON with Padding）是解決跨網域限制的方法之一 使用angular http jsonp 第二個參數可以帶入callback 名稱，他會帶上一個value，那個 value 就是伺服器要回傳script callback 的function名稱 前端：(此範例是使用 NG-ZORRO select ) this.http .jsonp<{ result: Array<{ recno: number; content: string }> }>( `http://aaa.bbb.ccc/api/jsonp`, 'callback'

首先在app下 創建一個 action 跟 reducer root-action.ts import { createAction, props } from '@ngrx/store'; export const changeAuth = createAction('ChangeAuth', props<{ auth: string }>()); root-reducer.ts

el-input 使用@keypress.enter會沒有反應的bug 必須加上native @keypress.enter.native ="submitForm('loginForm')" //中文輸入 element UI select 下拉選單如果設定了position:fixed 有可能導致選單會對應不到，解決辦法加上 !important .el-select-dropdown { top: 128px !important; }

認證流程圖 graph TD A1[使用者] --要求line notify的授權code--> C C[跳轉到line notify介面] --> |還沒登入line|E[登入介面] E --> |登入| F C --> |已登入過|F[選擇要發送的群組介面] C --> |手機會直接取得line app|F[選擇要發送的群組介面] F --> |確認發送對象後 帶上code及state跳轉回設定|G[原本設定畫面] G -.-> |url上會帶有code 及 state 用code去跟line認證後拿到access token 此token可以發送|H[end]

google目前把TTS納入收費模式 這個api還可以使用，但是不確定google哪時候會把這個api關閉 http://translate.google.com/translate_tts?ie=UTF-8&total=1&idx=0&textlen=32&client=tw-ob&q=%E5%B7%B2%E7%B6%93%E5%B9%AB%E4%BD%A0%E6%89%93%E9%96%8B%E9%9B%BB%E7%87%88&tl=zh-cn 串接google cloud api 服務憑證一直失敗，找不到解決原因，最後用api金鑰的方式串接 POST 的方式送出http api google tts api

# HTML JS CSS 網頁好用小撇步 ###### tags: `HTML` `CSS` `JavaScript` # JavaScript ## JS阻止冒泡和取消默认事件(默认行为) ``` event.stopPropagation() //防阻捕獲及冒泡事件傳遞 event.preventDefault() //取消默認事件 ``` ## 刪除cookie 如果該cookie的domain不在當下的domain 必須要把path 與 domain都設定一至才可以刪除 ``` var keys = document.cookie.match(/[^ =;]+(?=\=)/g); if (keys) { for (var i = keys.length; i--; ){ document.cookie = keys[i] + "=0;expires=" + new Date(0).toUTCString()+";domain=??;path=??"; } } ``` ## img 加載錯誤預設圖片 ``` // 圖片家載錯誤

# JavaScript 基本用法 ###### tags: `JavaScript` ## 物件陣列的判斷 [{},{}]： 用map將要判斷的物件陣列成新的陣列 再透過新的陣列去做判斷 ``` var result = array.map(value => value.property) ``` ## JavaScript取出”陣列-物件“重複/不重複值的方法 ``` result = arr.filter(item => !set.has(item.name) ? set.add(item.name) : false); ``` # 2018/10/30學習筆記 ## Array.splice用法 splice(index位置,刪除數,新增資料) ``` array.splice(0,1) //刪除index=0的資料 ``` ## FormData使用 ``` var fileData = new FormData(); fileData.append("key",value) //新增 fileData.delete(key) //刪除 f