現在網路上有提供許多免費或付費的螢幕錄製軟體，在 Mac 上，如果只是單純要錄製電腦螢幕的話，可以使用內建的 QuickTime Player...
2017年5月28日
2017年5月16日
SVG 原地旋轉
SVG 物體旋轉的時候是以 <svg></svg> 的左上角當作圓心進行旋轉，因此當我們直接對 svg 內的元素進行 rotate 時，常常不是我們想要的效果。若我們想要讓物體在原地進行選轉的話，可以使用一些技巧。
操作範例
可以搭配範例看下面的說明，SVG 原地旋轉 @ Codepen
STEP 0: 原本方形的位置
假設我們原本在 <svg></svg> 中畫一個方形：
<svg>
<!-- 原本方形的位置(400, 300) -->
<rect x="400" y="300"...
2017年5月14日
[掘竅] 為什麼畫面沒有隨資料更新 - Vue 響應式原理（Reactivity）
之前在在一開始接觸框架的時候，不是很清楚響應式原理到底是什麼，一直會把它和
responsive
這個東西搞混，因為兩個在中文翻起來都是響應式，官網雖然有提及這個部分的說明，但小時候不懂事就給它忽略過去了。
最近在用 Vue
做一些東西的時候，才慢慢瞭解到
Reactivity
的意思和重要性，在使用
Vue
的過程中，我們會發現當我們修改
JavaScript
的資料時，畫面就會自動的更新產生變化，之所以能這麼方便操作，都是由於
Vue
背後的響應式系統（reactivity
...
2017年5月13日
深入淺出瞭解 JavaScript 閉包（closure）
雖然之前在 Udemy 上課時有整理了幾篇關於閉包的筆記，但其實當時對於閉包的概念和使用上還是不很清楚，只是大概知道有這個概念。
前陣子在 Treehouse 上課時，聽到了另一個用來說明閉包的例子，我覺得講解的非常清楚，在這裡做個筆記記錄一下。
個人覺得先瞭解閉包的應用，接著在回去看之前上 Udemy 時整理的和閉包有關的文章時，在理解上更有幫助。
不使用閉包（closure）的情況
在 JavaScript 中，global variable 的錯用可能會使得我們的程式碼出現不可預期的錯誤。
假設我們現在要做一個計數的程式，一開始我們想要先寫一個給狗的計數函式：//...
2017年5月9日
那些關於 Vue 的小細節 - Computed 中 getter 和 setter 觸發的時間點
文章撰寫時使用 vue@2.3.2
在 Vue 中 computed 是經常會使用到的屬性，因為在 Vue 中透過 computed 會 cache 住沒有改變的資料，因此正確且適當的使用 computed 將可以減少資料重新運算的次數，讓網頁的效能提升。
但是在使用的過程中，有時候會發現 computed 怎麼樣就是不被觸發，這當中有些細節是我們可以進一步瞭解的。
computed 的基本觀念
在 Vue 中，computed 的屬性可以被視為像是 data 一樣，可以讀取和設值，因此在 computed 中可以分成 getter（讀取） 和 setter（設值），在沒有寫...
2017年5月4日
[VSCode] 手殘常常打錯字 Typo？讓 Code SpellChecker 省下你找錯字的時間。
本文章同步刊登於 PJCHENder 前端網頁資源站。
今天要來和大家分享一款 VSCode 的套件。
（PS. 我個人不只用 VSCode，只是最近剛好開發有用 VSCode，而且切換編輯器使用，比較有新鮮感，寫起來不易疲累XD）。
實在是不分享好像卡在喉嚨不太舒服壓！
其實在下載使用前，我覺得這不過就一款普通拼字檢查套件。
但在使用過後，才發現原來我花了很多時間在無意義的拼字錯誤上。
因為你慢慢的會發現，其實大多數的變數、屬性名稱等等的都是以有意義的英文字命名的，沒有意義變數名稱非常少。
因此，你可以省下很多時間在找不知道哪裡來的錯誤，說真的有時候...