除非你設計的網頁是故意在手機上只要顯示一部分，一般在 RWD 網頁上，我們都會設成網頁同裝置寬度，就像下面的設定： <meta name="viewport" content="width=device-width, initial...
不管你是愛、還是恨（說得有點超過），但是真的很多 Rails 人乾脆把 Turbolinks 關掉了。 我還是繼續使用中...
什麼是 Turbolinks? 好處？ Turbolinks 是一個 Javascript 程式，它的目...
時間處理，或是一段時間的資料收集，可能是很多網路應用上必定要有的功能，但是寫程式時，尤其是當面對多時區時，真的要頭腦清晰，在 Rails 中，有很多與時間相關的設定與使用方式，我也真的常會搞錯，所以這篇主要是自己做參考用的記錄用，但是應該也...
寫動態網頁，少不了就是字串變來變去，我們這篇來探討幾個很重要的關鍵： 字串跳脫 先說簡單的，在 Ruby 中，我們要如何處理字串內的單雙引號及換行等的特殊符號，看完以下實例就很清楚了：
HTML Escape / Unescap...
UJS 是啥？ 寫 Rails 的人，一定會常聽到 UJS，但是 UJS 到底是啥？我想很多人也不會去深度研究，反正，好像也感覺不到，直到有一天，被咬到了，才會「哇」，笑。 UJS 是 Unobtrusive JavaScript 英文...
閒來無事，真的是沒事不要亂改 code，改了就會出事，還好...... 沒人發現，老闆也不知道！ 話說，有一天讀到，在 HTML5 的 <html> 中，要加入 lang= 來標註網頁的語系，這樣，除了瀏覽器能更正確的編碼，對...
網站，少不了要用到外部的 Javascript，fontawesome、google analytics、adsense 等等，通常都有一大串，這外部的 Javascript 其實很容易拖累網頁的下載速度，所以，就有了以下三種寫法：
可是...
Bootstrap3 應該算是最流行的 CSS 架構了，用起來簡單，用的人也最多，用來做 RWD 響應式網頁開發也很快，對 RWD 設計，它有一個很方便的架構，但是，如果真的深入的用，就會碰到一些問題，我們就來看看一個常用的手機顯示順序與寬...
我本來以為SVG是一個很簡單的易懂的東西，結果不是，就開始研究，這一篇算是一個學習文，希望對大家能有幫助。 很厲害的部落客ＯＸＸＯ寫了31篇中文介紹，真的很厲害，有要深入研究者，一定要讀，對各個功能解說得很詳細：SVG 完整教學 31 天 ...
我剛剛碰到了一個有趣的問題，我要用 jQuery 來檢查網頁的位置，當網頁轉到那裡時，就把一個 DOM 顯示出來，很簡單，就給 window 裝上一個 scroll event 吧：
如果你是在沒有 Turbolinks 的環境下，就這麼...
本篇教學文章說明如何使用 ESP8266，透過 MQTT 連線至 QIoT Suite Lite 以收發資料。 由於 ESP8266 具有不同的韌體、規格和用法，因此分成兩種方式：
準備工作（使用 Arduino IDE 安裝程式庫並建立...
現在的網頁開發已經離不該 JavaScript 了，JavaScript 開發的人大概都是用各自喜歡的開發平台，每天網路上的談論都是那個新平台好，那個不老，應該要學那個，最近最不熱門的應該就是 jQuery 了，很多人也已經棄船不用 jQu...
要有好看的不發毛圖，就一定要使用向量圖，用 Adobe 的人，就一定知道 AI 跟 PhotoShop 的不同，在網頁中，就是要用 SVG，在 Rails 中要使用 SVG，其實很簡單，
方法一：植入法
其中最簡單的方法就是將 ...
很多事情，真的是不遇到不知道，寫個電腦程式也真的是太難了。 題目：需求超簡單，給一個字串，判斷是不是合法的 URL，傳回真假。
用 RegExp，竟然有可能超慢，我還以為當機了 第一個直覺就是用 RegExp 寫，比較字串，就是 R...
又到了英文課時間了，今天要講的是 CSS 的 selectors 選擇器⋯⋯ 說笑了，其實，只是我自己想做個筆記，一切又是因為那個萬惡的 Turbolinks，我又碰到了奇怪的怪異 javascript 行為，一路查 Bug 到無解，因為 B...
我有一個免費網站，它有 Google AdSense，倒也不是想要靠 AdSense 賺大錢，但是如果能多少補一些網站代管費用，總是好事。 這網站的流量上上下下，有一陣子還不錯，日流量幾千人，但是最近又掉了下來，低的時候就幾百，有趣的是，...
我一直很喜歡 JQuery，很簡單又好用，但是啊，就會一直被人家笑，說 JQ 很慢，說厲害的都要用 JavaScript，只有初學的人，才會用 JQ... 我也這麼覺得，所以，我就開始用 JavaScript 了。 結果，我今天花了一整天...
轉換 HTML 到 一般網頁上可以顯示的純文字... 簡單？ 其實，很不容易的，一般用 Rails 內建的 Strip_tags 以為就好，但是會碰到跳脫文字的問題：& > < ... 很多網路上的建議是用 gsub...
在 Rails 中，我們很常用到 javascript，通常不管是用 jQuery 或是其他的 ajax call，透過 routes.rb 中指定的 controller action，它就會去執行對應的 action_name.js.erb...
這一定要寫下來，就在剛要放棄時，突然仔細看了文件，證明，要看書，不要老是在網路找解答。 Rails 的 I18n 有很好用的翻譯 YAML，以前我都是用條件判斷來做單複數翻譯：
日子照過，今天想要來改成 Rails I18n 自己...
這是一個 JavaScript 的小品，我只是發現很少人在討論這個，就順手寫了下來。 Javascript global object 在 JS 中，window 一直是個我們常用來查瀏覽器狀況的物件，例如，我們要查瀏覽器的內部寬度：wi...
我剛踩到一個很大的雷，害我多花了快兩個小時，趕快記起來，幾本上，就是：
避免檔案名稱中有數字！
我喜歡用 generate scaffold，雖然很多情況下都不一定要會用到 views，但是，總覺得有一天可能要用，今天剛好要新增...
在 AJAX 呼叫 Rails 的 Controller 後，我想最重要的就是知道 server 這邊處理的結果，一般我們都會用一個與 controller 同名的 view.js 去自動執行，一般都是 refresh 網頁啊，或是跳到另一...
Unicode u2018 跟 u2019，也就是英文稱為 Smart Quotes 或是 Curly Qoutes 的 ‘ ’ 一對寶，這是個很神奇的字符，當在特定狀況時，瀏覽器會在前或後面自己加“空白”，而且有問題的話，問題會發生在英文版...
Rails 就是 Ruby，Ruby 2.3 版以後，我想現在大家應該也都是使用這些版本了，有一個很好用的功能，就是 Safe Navigation，Safe Navigation 在中文的世界中，好像沒人翻譯過，事實上，連英文都很難猜懂，...
在網頁上排版，我們最常希望的就是設定一個固定大小的框，但是如果碰到中文與英文混合的情況，最討厭的就是，很難這定他們的長度與高度，怎麼弄他們的長度不一樣，下面就是一個例子：
也就是說，我們在 server 上，因為 UTF8 的不定碼數...
寫網頁，到後來就會走火入魔，想要跟人比拼速度，當然啦，後面還有一個 Google 大神在鞭策，一天到晚在恐嚇著我們這些可憐寫程式的，說：你的網頁太慢，ＳＥＯ 就會很爛，哼，我就不相信，如果我的內容是個寶，你敢不連我，可是，我知道，我的內容就不是...
寫這個很心虛，因為有太多的不確定，我也是剛在摸索，我當作是紀錄，有緣的讀者就當作是笑話來看吧。
我想大家辛苦做出來的網站上線後，不管是被 PageSpeed Insights 建議，或是要用 CDN，或是自己突然想到，大概都會把 HTTP...
Google 搞了一個 PageSpeed Insights 來讓大家練武功，比拼速度，好玩的是，他還自己出了一個外掛：mod_pagespeed，只是，它真的有用嗎？
這個外掛是給 Apache 或是 Nginx 用的，兩個版本不同，安...
Lazy Loading 的重要： Lazy Loading 就是「懶惰的載入」。 目前 Lazy loading 都是用在圖檔，所以，Lazy Loading 就是：「懶惰的只載入網頁中看的到的部分圖檔」。有什麼用呢？有大用，而且很重要，...
