[筆記] 使用 Gulp 進行網頁前端自動化 – 用一般 HTML 來製作樣板並排版
雖說用 pug 來進行排版算是很方便，不過對於已經習慣 HTML 標籤格式的我來說，要上手還是有一點難度。於是經過了無數測試和尋找後，最後選定用 gulp-te Read More …
分類: 筆記 Notes
[筆記] 使用 Gulp 進行網頁前端自動化 – 依照開發環境調整佈署內容
這篇筆記下如何依照開發環境來調整佈署的內容，同時在佈署前，自動先清理掉先前產出的靜態檔案內容，並依照現有的檔案來生成全新的檔案，已確保前後檔案的一致性。 交付正 Read More …
[筆記] 使用 Gulp 進行網頁前端自動化 – 架設簡易伺服器和壓縮程式碼
這篇要筆記下的是讓前端開發時可以擺脫伺服器，達成編譯完後可以自動打開瀏覽器瀏覽，同時壓縮你的程式碼。 架設 WebService 1. 先安裝 BrowserS Read More …
[指南] 如何使用 Google 所提供的 Material Icon
Google 所維護的 Material icon 是一個公開且可商用的資料庫，由於是向量圖形式，所以無論螢幕尺寸是何大小，都可以輕鬆的看清楚。預設提供 SVG Read More …
[筆記] 使用 Gulp 進行網頁前端自動化 – Gulp 和 Bower 串接
Gulp 搭配上 Bower 和 Bootstrap 4 前端套件，可以快速的做到前端樣板管理。不過 Gulp 4 和前一版的作法有些不同，這邊筆記一下串接的方 Read More …
[筆記] 網頁切版直播班 2020 春季班 – 第六週
Bootstrap 是使用 mobile first 的架構，但要用 desktop first 來撰寫也是可以的。藉由格線系統的幫助下，讓排版不再是一件難事。 Read More …
[筆記] 使用 Gulp 進行網頁前端自動化 – PostCSS 自動加上前綴 & Load Plugins
這篇筆記下用 gulp-postcss、autoprefixer……等等套件，節省你的時間和加強瀏覽器相容性。 加強 CSS 相容性 由 Read More …
[筆記] 網頁切版直播班 2020 春季班 – 第五週
這週的內容主題放在「表單」，這個讓設計師、工程師往往爭論不休、對使用者來說稀鬆平常的部分。除了表單標籤的必備成員外，也提到了手機版的呈現差異。接著進入 Boot Read More …
[筆記] Carbon 程式碼使用 讓你的網頁程式碼顯示的更漂亮
當你想在自己的個人網站顯示一些程式碼時，若在不安裝一些外掛的情況下，要呈現 Highlight 版本就是一件很有挑戰的事。這個 Carbon 的網站就是提供這樣 Read More …
[筆記] 使用 Gulp 進行網頁前端自動化 – 初始化你的第一個 Gulp 編譯專案
這篇筆記下用 Gulp 來編譯你的檔案，需要安裝 gulp-jade, gulp-sass, gulp-plumber 後，再 gulpfile.js 進行修改 Read More …
[筆記] 開始使用 Github Pages
身為數一數二知名的程式碼平台 – Github，如果你願意的話，你可以把你的簡易網頁托管在這邊，讓其他人容易瀏覽，並同步觀看你的程式碼。以下筆記如何 Read More …
[筆記] 使用 Gulp 進行網頁前端自動化 – 簡介
Gulp 是一個前端自動化工具。由於瀏覽器只認識原生的 HTML, CSS 和 JavaScript (ES6的支援度各瀏覽器不同)，而 Gulp 可以幫你節省 Read More …
[筆記] 網頁切版直播班 2020 春季班 – 第四週
本週的知識含金量比起過往幾週，有者顯著性的提高。這週提及了模組化管理的基礎(像是 Pug 和 Gulp)，也講述了如何製作多頁式網頁，並擅用 SASS 的方式來 Read More …
[筆記] 來訓練你的手指運動 – 英打練習 Typing Pratice
英文打字的快慢，在網頁開發上的影響是有著積少成多的效果。現在要練英文打字，比起過去，不再需要於電腦上安裝軟體，可以直接在瀏覽器上進行即可。這篇是要筆記在 Typ Read More …
[筆記] Emmet 網路開發必備簡碼 加速你的開發流程
Emmet 是網路開發者 (尤其是前端人員) 必備的外掛套件之一。它可以節省你大幅度重複撰寫同樣或是類似程式碼的時間。另外搭配上 TabNine 來補足你在日常 Read More …
[筆記] 網頁切版直播班 2020 春季班 – 第三週
本週主要講究響應式(RWD)網頁的重點，可以運用百分比、CSS、media 等等設定來確保不同螢幕大小，都有良好的使用體驗。 第三週課程重點 基礎知識 網頁要在 Read More …
[筆記] 運用 Moment.js 製作 AM / PM 時間外掛
運用 Vue 和 Moment.js 來將 input-time 的 12 小時制時間，轉換成 24 小時制傳送到後端。 運用套件和方法 1. Vue-rout Read More …
[筆記] HTML5 Input time 時間格式
近日在網頁開發時，遇上要讓使用者填寫時間的狀況。第一直覺會想到 input time ，不過這個時間格式有個隱形的坑，它的 12 / 24 小時的選項，是根據使 Read More …
[筆記] 網頁切版直播班 2020 春季班 – 第二週
第二週的重點主要放在 Flex 的版型運用。從基礎的配置開始，到如何分析一張設計圖的架構，進而切出符合設計稿樣式的結果，是這一週的重點。同時，為了加速開發和熟悉 Read More …
[筆記] 網頁切版直播班 2020 春季班 – 第一週
專注於前端課程的六角學院，近期開了一個切版直播班，手把手的透過直播帶領大家釐清觀念，同時練習各種各樣的版型，大家在日後切版的速度可以更加快且準確。 第一週課程重 Read More …
[IT技術30篇挑戰] 資料結構和演算法實作 DAY12 – 遞迴與迭代解
遞迴和迭代這兩個概念，在任何的程式語言中，都是非常常用的工具，可以簡化你的程式碼並更有邏輯性。 遞迴和迭代 無論是採用何種方法，在開始前，請先注意有無特殊解(邊 Read More …
