文章列表 頁1

教學

[Vue.js] 官方推薦的非同步工具- axios

要在 vue 裡面使用非同步讀取資料的功能,可以使用 axios 這個官方推薦的工具。

教學

[Vue.js] 使用 computed 把既有的值作轉換

在 Vue.js 裡,常常使用 computed 讓我們就既有的值做進一步的轉換,並比較與 watch 的差別。

教學

[CI] 使用Download 輔助工具產生 Excel 並下載

如果我們要使用程式幫我們產出 Excel,其實只要產出表格並存成 excel 的副檔名 .xls 就可以用 excel 打開了,這邊還利用了 CodeIgniter 的 Dowload Helper 讓我們可以直接把產出的資料下載。

教學

javascript 的變數與常數,var 與 let 的差別

介紹 js 裡 var, const 與 let 的差別。

教學

[CI] 使用 User Agent 取得瀏覽器資訊

使用 CodeIgniter(CI)的 User Agent 可以幫助我們取得使用者的瀏覽器資訊。

教學

使用 CodeIgniter 處理縮圖

上頭的程式碼告訴 image_resize 函式庫去找一個位於 source_image 資料夾裡名叫 mypic.jpg 的圖片,然後呼叫 GD2 image_library 影像函式庫來創建一張尺寸為 1024 X 1024 像素的縮圖,有設定 maintain_ratio 選項時,縮圖會在維持原本的長寬比例下,會盡可能的接近 width 跟 height 的像素尺寸大小,所以這個可以用來設定照片的最長邊,可以搭配伺服器抓到的圖片尺寸來判斷是否要縮圖,而縮圖的檔名會命名為 mypic_thumb.jpg。

教學

取得 youtube 影片縮圖

youtube 影片縮圖網址都有一個規則,只要照著規則把影片 id 輸入即可。

教學

[Vue.js] 使用 v-cloak 解決 Vue Instance 顯示變數的問題

我們使用 Vue.js 的時候,都會有頁面剛進入的時候會看到 vue 的變數像是 {{ data }} 這樣的問題,或是我們設定 v-if 或 v-show,在頁面進入時會先出現一瞬間才消失,這時候我們只要使用 v-cloak 就可以解決了。

教學

script 標籤中的 async 與 defer 的差別

而在 HTML 5 之後,我們可以利用在 script 讀取外部資源的事後加上 async 或 defer 來幫我們優化頁面渲染的時間點,這邊就這兩個的差別簡單的說明一下。

教學

啟發式評估的十條原則

啟發式評估 (Heuristics Evaluation) 是易用性大師 Jakob Nielsen 與他同事在1994年所開發完成的專家易用性評估方法。

教學

[PHP] 使用 php 將 youtube 網址中的 id 過濾出來

使用取得 url 變數的方式或是利用正規表達式幫我們取得 youtube 影片的 id。

教學

使用預設瀏覽器開啟網頁,解決在手機 app WebView 下使用一些功能(例如 facebook 等第三方登入)失效問題

最近在開發專案遇到一個問題,就是當我用 facebook 串接登入時,發現如果是使用 line 分享,就會沒辦法順利登入,原因是手機 app 如果使用 WebView 會限制不少 javascript 的應用還有 cookie 的存取,後來發現能夠解決的方法就是強迫使用者不要在 app 的 WebView 下使用就好了。

教學

[Facebook] 客製化 facebook 登入

使用 facebook javascript SDK 簡單製作登入登出功能。

教學

[PHP] DateTime 時間類別與操作

在開發網站功能的時候滿常會使用到跟時間有關的東西,這邊舉一些常用的類別來說明。

教學

[javascript] 替你的網頁加上密碼

我們可能會遇到一個需求適當網站還沒有正式上線前,避免有人不小心試到網址,或是透過搜尋引擎不小心跑進來,這樣內容就會被看到,這邊可以簡單地用一個 javascript 幫我們處理這個問題。

教學

GSAP 的 TweenMax 基礎教學

GSAP(GreenSock Animation Platform)是一個老牌的動畫服務,以往用在 flash 上,後來在 js 也都可以拿來使用,最近也滿多人把這隻應用在專案上,所以這邊也來介紹一下。

教學

[PHP] 解析網址- parse_url

如果我們有一段網址,像是:http://username:[email protected]:9090/path?arg=value#anchor 這樣的網址,想要去分析它的內容我們可以使用 php 提供的 parse_url 來幫我們處理。

教學

[Vue.js] 偵測滑鼠位置

要在 Vue.js 裡偵測滑鼠的位置,只要抓 mousemove 的事件就好了,接著再去抓取 event.clientX 跟 event.clientY 就好。