Skip to main content

1-9

Vue-Chart.js​

  • 因 vue-chart 套件會渲染出 html template，所以寫 vue 檔時不用寫 template
  • 若直接引入此 vue 檔，無法渲染出來，需註冊成全域組件

LocalStorage​

  • localStorage.setItem('key', 'value')
  • localStorage.getItem('key')
  • 全域物件，可直接使用
  • value 只能是字串，故需存成 Json 格式字串，撈出來再 parse

SessionStorage 相關知識點​

Shell Script 執行權限​

$ ls -l    
total 16
-rw-r--r-- 1 zhuangbocheng staff 806 9 7 12:21 deploy.sh
drwxr-xr-x 7 zhuangbocheng staff 224 8 16 2019 dist
-rw-r--r-- 1 zhuangbocheng staff 1632 9 7 12:04 template.yaml
  • 執行 chmod +x deploy.sh ，可增加執行權限
-rwxr-xr-x  1 zhuangbocheng  staff   806  9  7 12:21 deploy.sh

Shell Script 參數​

  • projectName=test ./deploy.sh 參數可帶在最前面，使用： echo ${projectName}
  • 參數可帶後面，但要用＄照順序取得：
  • ./shell_test.sh var1 var2 var3
## ./shell_test
echo "Total argument: $#"
echo "Script name: $0"
echo "Argument 1: $1"
echo "Argument 3: $3"
  • 結果
Total argument: 3
Script name: ./shell_test.sh
Argument 1: var1
Argument 2: var2
Argument 3: var3

AWS CloudFront​

  • 新建 CloudFront 與 S3 關聯需要等一小時左右才能用 CDN 網址 access 到檔案
  • error response 會被 cache 住，預設5分鐘
  • cache 住時就算有解掉問題，也還是會回一樣的錯誤
  • 故用 CloudFront access S3 時，error response cache 可以設最少的 5秒鐘
  • 一般來說是不建議設 cache 時限這麼短，因為會容易被攻擊，但因為我們是用 S3 不是用自架伺服器，所以沒關係
  • https://www.youtube.com/watch?v=GsP0xDmnzi0

高流量 scale-out 與 Panel 切割​

網頁實時更新方法​

Shell Script 判斷程式成功失敗執行下一步​

if command ; then
        echo "Command succeeded"
    else
        echo "Command failed"
fi

sam cli​

  • sam package 上傳至 bucket 可帶前綴參數指定資料夾路徑 --s3-prefix packaged ，不用 / 開頭

AWS cli​

  • head-bucket 指令可查詢 bucket 是否存在與是否有操作權
  • aws s3api head-bucket --bucket bucketName --profile profile
  • create-bucket 時，region 在兩個地方都要設置
  • aws s3api create-bucket --bucket bucketName **--region region** **--create-bucket-configuration LocationConstraint=region** --profile profile

Node.JS fs.readFile和fs.readFileSync​

  • 前者方法為異步讀取檔案，有 callback 函式含 err 與 data 兩個參數可用；後者為同步，執行到這段時需停下等完成並回傳結果(類似 await)，有錯誤需用 try catch 處理
  • 讀取檔案若為二進制，沒帶編碼參數的話得到的會是 buffer

ES6 class 語法糖 & Prototype 差別​

Vue i18n 格式化​

  • i18n 字串內能用 {0} {1} {2} 或 {msg} {name} 語法來做動態資料
  • <p>{{ $t('text', {'0': 'hello'}) }}</p> 或 <p>{{ $t('text', { msg: 'hello' }) }}</p>

Vue i18n 插值​

其他​

CSS & 預處理器 calc​

  • CSS3 的 calc 為執行階段處理，所以能在算式內使用多種單位，但預處理器為預編譯，所以只能用一種單位做計算
Last updated on