導航狀態常用於頁面間的資料傳遞
特別適合單向的數據傳遞(只管數據帶到下一頁,不管帶回上一頁)
使用上直觀且簡單
另外現代瀏覽器多半有緩存機制可以保存各頁面的狀態
即便客戶端進行 Reload, 或點擊上下頁依然可以保存狀態

應用上像是商品目錄頁進到商品內頁
可以藉由導航狀態先將部分資訊帶入內頁渲染
剩餘的資訊再藉由動態請求補齊
可以有效提升使用者體驗

底下以 React Router v6 為例
來說明導航狀態的實際應用：

• useNavigate

Nginx 是常見的網頁伺服器
預設的情況下會將客戶端的所有請求轉發到後端的真實路徑
部署多頁式的網頁應用並沒有什麼問題 但是如果是單頁式應用呢

React 是典型的單頁式應用 SPA (Single App Application)
React Router 提供多種類型的路由 如 BrowserRouter, HashRouter, MemoryRouter etc.
其中 React Router 官方最推薦的 Router 就是 BrowserRouter

BrowserRouter 會根據每次路徑的變化都和後端發送請求

但實際上 React 只會有一個 index.html 位於 Nginx 的網站根目錄
此時如果 Nginx 嘗試將每個前端路由的的請求都轉發到後端的真實路徑
就會因為找不到實際的檔案可以回傳 而發生 404 Not Found

底下就來說明如何解決這個問題

• nginx 設定檔配置

上拉加載 下拉更新 原本是 APP 很常見的功能
現在 Web 也很常見 因為越來越多的 Web 得做得和 APP 越來越像 …

今天這篇先講上拉加載的部分：

• scrollHeight + clientHeight + scrollTop

網頁應用常見的資源網址除了 http URL 外,
還有 Data URL 及 Blob URL

這兩種類型的網址，也很常用在資源下載及顯示
內文將介紹這兩種 URL 的基本使用方法

• Data URL (資料網址)
• Blob URL (二進制大型物件網址)
• 附註常見的 MIME 類型 （Media Type）

部落格近3年久違的更新
回憶起這個部落格只有在建立初起比較常使用
後續就默默的擺著

幾乎所有應用只要一陣子沒更新就會出問題
這個部落格也不例外

底下就來講講這裡曾經發生過的事吧

• 部落格起源
• Hexo 選用的主題不再更新 而導致版面出問題
• 網域沒有續約 網址失效 導致網站無法正常訪問
• google 搜尋引擎找不到部落格的文章了

最近在 app 上寫一個簡單的欄位試算功能
有用到去抖動這個小技巧
和大家簡單分享一下

內文:

• Debounce

將一個網頁放到一個網頁空間
再用一個網域指向你的網頁空間即可
現在你有一個網站了,只要在瀏覽器的網址列輸入網址,人人都可以連到你的網站囉!

內文

• 如何擁有網頁
• 如何擁有網域
• 如何擁有網頁空間

耶 第二彈 !!

內文

• 取連續陣列 方法一
• 取連續陣列 方法二
• log 開關
• undefined 簡寫
• 取外部 IP

A: 預檢不過 …
B: … postman 沒問題啊
A: Ummm…瀏覽器不太一樣…

內文

• 關於跨域
  • 同源政策
  • 請求類型
  • preflight
• 如何解決跨域
  • 設置正確標頭
  • 使用套件

重構代碼第二彈!!!
在沒有寫第二彈前…
我ㄧ直在想會不會所有規劃好的系列文 都只有一回…XD

內文

• 更好的 function (參數給予預設值)
• 更好的 array callback（ function 獨立拆出並給予命名）
• 更好的 邏輯運算子 || (改用陣列過濾)