鐵人檔案
寫給剛跳進前端坑之幼苗們的入門綜合大補帖：Git、HTML、CSS、JavaScript、SASS、Pug 、Vue.js、jQuery、API串接。
使用 VS Code、Codepen 編輯。
加入一點簡潔的圖像設計詮釋概念，希望能夠更容易被理解。
祝眾前端小幼苗們持續往大樹的方向前進、成長茁壯！
來寫 code 之前，先用比較白話的方式去理解語法。 記住這三件事: When: 什麼情況下執行？（事件觸發） Who: 指定誰？(抓取物件) How: 執行...
多張圖片切換的幻燈片效果 Basic 基本款 定時淡入淡出 >> CodePen Demo 奉上完整飯粒： HTML <div class=...
CSS 的各種 transxxx (transition / transform / translate )，不熟時候常常寫到茫掉，來篇筆記分類／整理一下好方便...
基本的 樣式設定 / 排版定位 都已經難不倒你了嗎？那就接著要來玩玩動態的部分啦！一開始覺得寫 CSS 能讓醜醜的網頁變漂亮很療癒，而接觸了 CSS 的動畫控制...
本篇以 GET 方法串接 JSON 文件內容示例。 原生JavaScript、jQuery、Axios 三種寫法供參考。 適用於 有基本的 JavaScr...
續前篇，本篇示例將取得的 json 資料應用在頁面上。 完整栗子 >> Codepen Demo 使用的 API 預期資料呈現如下: H...
(以下文章適用於Vue.js 2.X版本) Vue.js 官方手冊 起手式 引入 Vue.js new 一個 Vue 物件 var vm = n...
鐵人賽終於來到最後兩篇（最後一天是廢文心得文） 這兩天來個大顆ㄧ點（跟前幾篇比）的栗子，用 Vue.js 實作一個「一眼瞬間」版的 ToDoList。為什麼叫...
續前一篇的例子： 分段進行： Vue 基本結構及使用到的屬性： var app = new Vue({ el: "#app",,...
最後一篇除了參賽心得之外，也來分享一下切版時常用的線上應用小工具好了～這樣才有寫了「三十篇」技術文的感覺！ 線上應用工具分享 設計 畫Wireframe：...
