半熟前端

軟體工程師 / 台灣人 / 在前端的路上一邊探索其他領域的可能性

本部落格使用 Gatsby 製作

本部落格有使用 Google Analytic 及 Cookie

Tag: 前端

前端

前端焦慮症

警告:本篇文章僅為表達自身觀點與想法,對於同行業人員沒有任何批判之意。 逐漸成熟的前端領域 我認為目前前端領域(此處指網頁開發)逐漸趨於成熟,前端框架採用元件化的中心思想與響應式機制,搭配框架特有的語法、開發手法與哲學,可以應付大部分的使用場景。目前大部分的改進是針對建構工具,例如透過 esbuild、vite、snowpack 來提高轉譯速度與開發體驗,或是在既有的框架上做各種優化,例如 vue3 推出 composition API、React 最近發表的 React Server…

繼續閱讀...#前端
前端

在瀏覽器上透過 Arduino 讀取溫濕度 - Web Serial API

Serial API 是什麼? Google Chrome 89 推出了 Web Serial API 讓外接設備能夠透過瀏覽器的 API 直接互動,包含 USB 設備或是有 Serial 介面的藍牙設備。這樣一來瀏覽器就能與硬體直接溝通。 以往在做類似的應用時需要另外寫 Server 串接 serial 送過來的資料,再透過 API 或是 WebSocket…

繼續閱讀...#前端
前端

form 標籤與 FormData 的應用

上一篇文章中,我們介紹了 multipart/form-data 的請求格式以及它想解決的問題。這篇文章中會以實際開發上遇到的問題跟應用做解說。 具體來說,這篇文章會包含下列幾個有關於表單應用的部分: <form/> 標籤背後做了哪些事 FormData 在 JavaScript 當中的應用 FormData 與 fetch 的搭配 JavaScript 如何操作檔案上傳 再談 form 標籤 HTML 的 form…

繼續閱讀...#前端
前端

Hotwire 與 Turbolinks

前言 DHH (Ruby on Rails 的作者)發了一則推特,在講他的新作 Hotwire。DHH 是個 SPA 黑粉(從推文上可以略知一二),因此他極力避免在開發上加入太多 JavaScript。這則推文在推特上引起熱烈討論,在這邊稍微做個整理。 關於 Hotwire 的介紹在這邊直接引用官方上面的說明: Hotwire is an alternative approach to building modern web applications without using much…

繼續閱讀...#前端
前端

iOS mousedown 事件觸發問題

iOS 在某些版本下 mousedown 處理器不會正確運作,不過在其他裝置上(像 Android 等等),mousedown 仍然是可以正確運作的。 解決方法是在手機上不要用 mousedown 處理器,用 touchStart 來處理,但不知道觸發順序是否會受到影響?原本在 click 事件當中,是 blur 會先觸發(如果有)再觸發 click 事件,為了躲掉這個點才用 mousedown 取代。 在 codepen 上進行簡單的實驗: 可以發現觸發順序會是 touchstart…

繼續閱讀...#前端