相信大家可能都會有這種經驗: 當你在開發某一功能時，突然被PM打斷，要求你現在要先去修正一個急單，這時候你可以有兩個選擇: 直接下commit，然後開始改急單...
Basic config 最基本的寫法就是在 src/router/index.ts 的 routes 內設定像這樣 const routes: Array&l...
今天來介紹 vue 的生命週期，什麼是生命週期呢？講簡單一點就是從你用瀏覽器打開網頁開始，到網頁內的元件一個一個生成，到整個完整的網頁建立的過程就叫生命週期，完...
嗨，大家好！我是珊迪，還有點菜味的前端工程師。這是我第一次參加鐵人賽，希望能在這趟旅程中，為自己立下一個小小的里程碑，紀念 Hello World 一週年。 為...
v-bind v-bind 可以讓 template 內的標籤去綁定 script 內定義的變數，舉個例子 <template> <div...
定義路由 首先先來定義路由，先把上一篇寫的 home.vue 定義在根路由。 打開 src/router/index.ts，在 routes 內定義 {...
在寫頁面之前，先來介紹 Vue 頁面結構。 首先先在 src/components 底下建立一個 home.vue 跟寫一個 html 頁面很像，一樣是分成...
專案建好了，那先來講 Vue 的專案架構 詳細內容很多，所以我挑重點講 public index.html public/index.html 是 Vue 頁...
前言 Vue 在過去的一兩年內快速發展，寫法也一直改變，我在過去一年多也更改了兩次寫法，這 30 天我將以最新的 composition api + types...
最近愛上以玩遊戲的方式去學習CSSヽ(✿ﾟ▽ﾟ)ノ好快樂~ 尤其是之前對選擇器和Grid Layout一直沒有很熟練，透過遊戲，印象更深刻，也不失為一個不錯的學...
【工作內容】 依照UX/UI 設計稿進行網頁開發 功能評估並規劃時程 與後端團隊合作，串接 API 資料 撰寫前端單元測試、整合測試 調整網頁渲染效能 (SS...
為何我想了解 webpack？ 不知道你是否也會好奇，不論是透過vue-cli或是react-create-app建立的專案 ，只要執行: npm start...
前言 由於 CKEditor 的客製化需要仰賴 Webpack，無法在 Vite 的專案上使用因此需要改使用 TinyMCE，發現網路上太多用很不直覺且奇怪的方...
經過前面二十九天的的練習與學習，相信大家應該在表單的實作上都熟悉了不少，只要不是太複雜、太特別的表單應該也都難不倒你們。 今天是本系列文的最後一天，就讓我們來...
昨天跟大家分享了自訂表單元件的作法，但昨天的作法只適用於一個欄位、一個 FormControl 。 雖然 FormControl 裡是可以設 {} 的值，但如...
經過了這段時間的練習與學習，相信大家應該越來越能體會 Angular 表單的強大與便利。 不過既然 Angular 表單這麼好用，如果能讓自己做的 Compo...
今天想要跟大家分享的是跨欄位驗證的小技巧，這個小技巧其實沒有多厲害或多特別，只是可能滿多人剛好不知道原來可以這樣用。 而我們在 Day 23 - Reacti...
之前在開發表單的時候，我們都是使用 Angular 所提供的驗證器來驗證表單欄位裡的值是否符合我們的需求。 雖然 Angular 已經這麼貼心地提供了這麼多驗...
大家在日常生活中，應該看過滿多表單的某個欄位會隨著另個欄位的改變，而造成該欄位的驗證邏輯需要改變的情況吧？ 舉例來說，可能會有個欄位叫做聯絡資訊，使用者可以選...
昨天跟大家分享了 Cypress 有多厲害之後，大家有沒有很期待呢？ 這兩天就讓我來跟大家介紹 Cypress 到底有多厲害吧！ 由於 Cypress 的功...
在這個各種前端框架、開發工具層出不窮、百花齊放、百鳥齊鳴的美好時代， E2E 自動化測試工具的選擇自然也很多。 今天我們會先來初步了解一下目前有哪些 E2E...
這段期間，我們用 Template Driven Forms 與 Reactive Forms 各自做了一個登入表單（靜態）與被保人表單（動態），而且我們也都...
前言 JS 30 是由加拿大的全端工程師 Wes Bos 免費提供的 JavaScript 簡單應用課程，課程主打 No Frameworks、No Compi...
昨天幫我們用 Reactive Forms 所撰寫的被保人表單寫完單元測試之後，今天則是要來為它寫整合測試。 大家還記得整合測試的目標是要測什麼嗎？我幫大家複...
前言 JS 30 是由加拿大的全端工程師 Wes Bos 免費提供的 JavaScript 簡單應用課程，課程主打 No Frameworks、No Compi...
Congratulations to all of us! The final day has already come! Hooray!Pic: Unspla...
What is AJAX? AJAX = Asynchronous JavaScript And XML.AJAX is not a programming l...
今天我們要來為我們用 Reactive Forms 所撰寫的被保人表單寫單元測試，如果還沒有相關程式碼的朋友，趕快前往閱讀第十一天的文章： Reactive...
After introducing about the 2 methods for timing events in the last article, let...
在很多很多的前置作業後 今天終於要開始寫code了 到此為止我們應該流程畫有了 畫面流程也有了今天很多努力終於可以建立前端專案了 這邊終於可以開始建立專案了這邊...
哲嘉 (Zhe-Jia)
珊迪
Leo
Xiang1009
Vida Lin
shrine90459
iThome鐵人賽
看影片追技術