如何做出會隨時間變化的同心圓？ 發表於 2019-09-06 更新於 2020-12-05 分類於 THE F2E 文章目的在做今年的 THE F2E 第一週番茄鐘時，遇到最大難題就是要做一個隨時間逐漸填滿的同心圓，想藉由此文章為製作流程做個紀錄。 閱讀全文 »
Vue Cli 3 環境變數設定 發表於 2019-09-04 更新於 2020-12-05 分類於 Vue.js 文章目的之前是用 VueCli 2 做開發，那 VueCli 3 一樣有環境變數的設定，但設定方式會與 2 不太一樣，因此透過此文章來做紀錄。 閱讀全文 »
CSS 小技巧紀錄園地 發表於 2019-08-29 更新於 2020-12-05 分類於 CSS 文章目的有鑑於在練習前端過程中，會遇到一些好用的 css 程式碼來呈現需要的網頁效果，但因為只是小技巧，不適合寫成一篇文章，因此利用此文章來為這些小技巧做個紀錄。 閱讀全文 »
利用 CSS 做出 offcanvas 遮罩效果 發表於 2019-08-22 更新於 2020-12-05 分類於 CSS 文章目的我們在逛一些具有響應式設計的網站時，在較小裝置點開 offcanvas 的 menu 時會有類似遮罩效果出現在畫面上，此文章將用來記錄如何利用 css 做出一樣的效果。 閱讀全文 »
利用 CSS 做出簡單的按鈕 hover 動畫回饋 發表於 2019-08-21 更新於 2020-12-05 分類於 CSS 文章目的因為最近在練習製作電商網站，學到了一個不錯的按鈕 hover 回饋小技巧，想藉此篇文章做個紀錄。 閱讀全文 »
Vue.js 電商練習技術整理 -- 利用 v-model 技巧建立表單篩選功能 發表於 2019-08-20 更新於 2020-12-05 分類於 Vue.js 文章目的當我們在使用電商網站時無論是前後台都會因為資料過多，無法即時找到含有特定條件的資料，本文將示範利用 v-model 簡單建立出後台的訂單篩選功能。 閱讀全文 »
Vue 小技術小工具園地 發表於 2019-08-13 更新於 2020-12-05 分類於 Vue.js 文章目的有鑑於現在在練習利用 Vue 開發電商網站，中間會發現一些前端前輩提供的好用程式碼，或是一些好用的套件、工具，想透過此文章記錄下來，方便以後回憶查找。若陸續發現好用的工具與程式碼會持續更新，或許會出好幾回XD 閱讀全文 »
Vue.js 電商練習技術整理 -- 使用 VeeValidate 輕鬆建立表單驗證 發表於 2019-08-09 更新於 2020-12-05 分類於 Vue.js 文章目的我們應該都有經驗在網路上購買東西，填寫資料時若資料填寫不完整，會導致表單無法送出，無法完成訂單程序，往往使用者在填寫訂單時會需要填入一些必要的資料。本文章將用來記錄用 Vue.js 開發時如何使用 VeeValidate 來驗證使用者資料正不正確，若不正確就阻止資料的送出。 閱讀全文 »
Vue.js 電商練習技術整理 -- event bus 元件間的溝通橋樑 發表於 2019-08-06 更新於 2020-12-05 分類於 Vue.js 文章目的在我們開發 Vue 的專案時，每個元件檔案間都會有內外層的差別，例：一個 Root 下有兩個 side 每個 side 底下又有3個元件，當我們需要利用內層的資料來觸發外層的事件時，會需要一層一層的將資料向上傳遞，這會顯得較為麻煩，因此我們可以利用 event bus 的方式，直接將我們內層的資料傳遞給外層作使用。 閱讀全文 »
Vue.js 電商練習技術整理 -- 製作讀取動畫增加使用者體驗 發表於 2019-08-05 更新於 2020-12-05 分類於 Vue.js 文章目的我們時常在逛其他網站時，讀取過程中會看到一些動畫呈現，此文章用來記錄在用 Vue 開發網站時，如何製作同樣的動畫效果。 閱讀全文 »
