![[筆記] 使用 Gulp 進行網頁前端自動化 – 架設簡易伺服器和壓縮程式碼](https://smlpoints.com/wp-content/uploads/notes-using-gulp-to-automate-your-website-intro-1.jpg "[筆記] 使用 Gulp 進行網頁前端自動化 – 架設簡易伺服器和壓縮程式碼")
[筆記] 使用 Gulp 進行網頁前端自動化 – 架設簡易伺服器和壓縮程式碼
這篇要筆記下的是讓前端開發時可以擺脫伺服器，達成編譯完後可以自動打開瀏覽器瀏覽，同時壓縮你的程式碼。 架設 WebService 1. 先安裝 BrowserS Read More …
分類: 網頁開發 Web Development
![[指南] 如何使用 Google 所提供的 Material Icon](https://smlpoints.com/wp-content/uploads/guide-how-to-use-material-icon-1.jpg "[指南] 如何使用 Google 所提供的 Material Icon"){kind=icon}
[指南] 如何使用 Google 所提供的 Material Icon
Google 所維護的 Material icon 是一個公開且可商用的資料庫，由於是向量圖形式，所以無論螢幕尺寸是何大小，都可以輕鬆的看清楚。預設提供 SVG Read More …
[筆記] 使用 Gulp 進行網頁前端自動化 – Gulp 和 Bower 串接
Gulp 搭配上 Bower 和 Bootstrap 4 前端套件，可以快速的做到前端樣板管理。不過 Gulp 4 和前一版的作法有些不同，這邊筆記一下串接的方 Read More …
![[筆記] 網頁切版直播班 2020 春季班 – 第六週](https://smlpoints.com/wp-content/uploads/notes-slicing-live-broadcast-2020-hex-school-week1-1.jpg "[筆記] 網頁切版直播班 2020 春季班 – 第六週")
[筆記] 網頁切版直播班 2020 春季班 – 第六週
Bootstrap 是使用 mobile first 的架構，但要用 desktop first 來撰寫也是可以的。藉由格線系統的幫助下，讓排版不再是一件難事。 Read More …
[筆記] 使用 Gulp 進行網頁前端自動化 – PostCSS 自動加上前綴 & Load Plugins
這篇筆記下用 gulp-postcss、autoprefixer……等等套件，節省你的時間和加強瀏覽器相容性。 加強 CSS 相容性 由 Read More …
[筆記] 網頁切版直播班 2020 春季班 – 第五週
這週的內容主題放在「表單」，這個讓設計師、工程師往往爭論不休、對使用者來說稀鬆平常的部分。除了表單標籤的必備成員外，也提到了手機版的呈現差異。接著進入 Boot Read More …
![[筆記] Carbon 程式碼使用 讓你的網頁程式碼顯示的更漂亮](https://smlpoints.com/wp-content/uploads/notes-carbon-show-your-image-1.jpg "[筆記] Carbon 程式碼使用 讓你的網頁程式碼顯示的更漂亮")
[筆記] Carbon 程式碼使用 讓你的網頁程式碼顯示的更漂亮
當你想在自己的個人網站顯示一些程式碼時，若在不安裝一些外掛的情況下，要呈現 Highlight 版本就是一件很有挑戰的事。這個 Carbon 的網站就是提供這樣 Read More …
[筆記] 使用 Gulp 進行網頁前端自動化 – 初始化你的第一個 Gulp 編譯專案
這篇筆記下用 Gulp 來編譯你的檔案，需要安裝 gulp-jade, gulp-sass, gulp-plumber 後，再 gulpfile.js 進行修改 Read More …
![[筆記] 開始使用 Github Pages](https://smlpoints.com/wp-content/uploads/notes-git-ignore-ds_store-files-and-so-on-gitignore-1.jpg "[筆記] 開始使用 Github Pages")
[筆記] 開始使用 Github Pages
身為數一數二知名的程式碼平台 – Github，如果你願意的話，你可以把你的簡易網頁托管在這邊，讓其他人容易瀏覽，並同步觀看你的程式碼。以下筆記如何 Read More …
