網頁設計09-Laravel-API與其他應用(2hr)

一、JWT身分驗證(15min+15min練習)：

  1. JWT簡介：https://yami.io/jwt/
  2. Bearer-Token簡介：https://blog.yorkxin.org/2013/09/30/oauth2-6-bearer-token.html
  3. Postman軟體：https://www.getpostman.com/downloads/
  4. 使用JWT：https://hackmd.io/@8irD0FCGSQqckvMnLpAmzw/SkqRnxqIM

二、Laravel API(15min+45min練習)：

  1. 與Web差異：不需要View，複製並微調Controller、建立API版的Router、加上JWT身分驗證。
  2. 建立API：https://hackmd.io/@8irD0FCGSQqckvMnLpAmzw/Hk8QeMNLz

三、作業：將課堂練習完成。

四、課程影片(片長：00:28:19)

五、其他應用(參考)

  1. 網頁編輯器：
    1. CKEditor
      1. demo：https://ckeditor.com/ckeditor-5/demo/
      2. 使用：https://ckeditor.com/docs/ckeditor5/latest/builds/guides/quick-start.html
    2. TinyMCE
      1. demo：https://www.tiny.cloud/get-tiny/
      2. 使用：http://yhhuang1966.blogspot.com/2016/01/tinymce.html
  2.  自動寄送Mail：
    1. queue列隊：https://laravel.tw/docs/5.2/queues#introduction
    2. 設定：https://github.com/laravel/laravel/blob/master/config/mail.php
    3. 使用mail功能：https://medium.com/aydenlin/laravel-mailables-gmail-56a733ae0652
  3. JS統計圖表：
    1. 使用：https://www.chartjs.org/samples/latest/、https://www.ucamc.com/e-learning/javascript/270-簡單使用chart-js網頁上畫圖表範例集-javascript-圖表、jquery圖表繪製
  4. Line機器人：
    1. 使用：https://blog.reh.tw/archives/988
  5. 網頁拖曳：
    1. 拖曳效果：https://pjchender.blogspot.com/2017/08/html5-drag-and-drop-api.html
    2. 拖曳檔案上傳：https://fineuploader.com/demos.html#gallery-view、https://ithelp.ithome.com.tw/articles/10196002?sc=iThelpR
  6. Google Map API應用：
    1. 使用：https://medium.com/front-end-augustus-study-notes/google-map-api-1-a4e794b0162f、https://ithelp.ithome.com.tw/users/20103130/ironman/1310
  7. 影音串流：
    1. 網頁錄影：https://pjchender.blogspot.com/2018/02/js-javascript-mediarecorder-api.html
    2. 影片串流播放：http://www.cc.ntu.edu.tw/chinese/epaper/0033/20150620_3308.html
    3. 網頁直播：https://muki.tw/tech/websocket-simple-introduce-and-use/、https://kknews.cc/zh-tw/tech/anvlzgn.html
  8. 條碼：
    1. Bar code：https://zh.wikipedia.org/wiki/條碼
    2. QR code：https://zh.wikipedia.org/wiki/QR碼
    3. 產生：https://github.com/milon/barcode
    4. 掃描：https://github.com/andrastoth/webcodecamjs