跳到主要內容

發表文章

目前顯示的是有「ajax」標籤的文章

[教學] angular 官方教學資料導覽

angular 關於官方教學自己做的一個簡短筆記,在官方基本教學流程中,已經給予大家大致的輪廓,到底 angular 怎麼去執行程式流程,進行 html render 以及如何將 html 變成 object,甚至到後面的 route, HttpRequest 取得資料方式 以下把 angular 官方網站提供的基本教學,做一個大致流程導覽,給自己一個簡單的紀錄。 angular 基本教學 http://docs.angularjs.org/tutorial step-0 這邊進行 angular 第一次接觸,教導如何 install angualr 以及,angular html template 如何進行運作。 Nothing here {{'yet' + '!'}} 網址 http://docs.angularjs.org/tutorial/step_00 ng-repeat step-2 加入 ng-model 了解, angular model 模型,如何使用 ng-model 與 html 進行互動 added app/js/controller.js <pre> function PhoneListCtrl($scope) { $scope.phones = [ {"name": "Nexus S", "snippet": "Fast just got faster with Nexus S."}, {"name": "Motorola XOOM™ with Wi-Fi", "snippet": "The Next, Next Generation tablet."}, {"name": "MOTOROLA XOOM™", "snippet": "The Next, Next Generation tablet."} ]; } </pre> 網址 http...

Github ribbons Github 專案緞帶

Github ribbons Github 專案緞帶 現在身為一個 developer 好像沒有 github 就缺少了什麼,熱血的你今天有沒有申請 github ,快點來加入吧! 每次在加入左上(右上)的 github project 都要花些時間,整理一下有哪些資源可以使用 一般 github ribbon github 官方介紹 ribbon 使用方式 github ribbon for retina retina 專用 github ribbon github ribbon 產生器 github ribbon 產生器 你今天 github 了嘛?

[教學] gravatar 建立大頭貼

在許多地方都會叫使用者填入 User id, 或者使用者信箱,接下來又是一堆資料的重新整理,gravatar ,也是類似從中誕生的產物。 gravatar 主要就是讓使用者可以在同一個地方建立大頭貼,之後可以從『中央』控管,從 gravatar 這個地方就可以進行上傳大頭貼,其他網站都會跟著更新。 網站 https://en.gravatar.com/ 使用方式 首先需要申請  https://en.gravatar.com/ 網站的使用者帳戶,接著在  https://en.gravatar.com/profiles/edit/?noclose#about-you 裡面的選項設定好之後,重頭戲來了,進入 『Add an Email Address 』 , 輸入 Email, 設定成功之後,會寄一封 『驗證信』 ,記得去開啟點選連結,啟動他。以上程序就完成了 gravatar。 設定大頭貼 進入底下選項, 可以在這個頁面上傳自己的大頭照,以及選擇相對信箱大頭照。

Cloud Service 再窮也要玩

cloud service 雲端服務集合,目前開發 Node.js 服務大多需要 express, socket.io ,這兩者服務通常會使用到 MongoDB,Redis,但是如果只是為了架設 prototype 而自己搞了一堆環境,簡直就是搞死自己。用 Amazon 又還不到這個階段,而且沒有信用卡,該怎麼辦? PaaS 以 Node.js 服務來說,目前已經有許多 PaaS 廠商提供免費的服務環境,有底下幾間可以參考。 Nodejitsu dotCloud cloudfoundry heroku 以服務來說,使用經驗上比較推薦使用 Nodejitsu ,首要在於 Socket.io 的支援上,Nodejitsu 可以支援到 Websocket ,另外也提供 https 認證支援,因此不需要特別去買其他的 certification。 另外 Nodejitsu 目前已經是 Joyent ,合作廠商之一,因此 Nodejitsu 的服務器都是架設在 Joyent ,同時支援目前最新版本的 Node.js 版本。

[分享] livereload 設定及原理分析, livereload project analysis

之前介紹過livereload ,深深覺得他是個好東西,用過之後開發網站就不能缺少他,我真的回不去了。可是就會想要探討到底livereload 是怎麼做到修改檔案之後,就即時做頁面重新讀取呢? 分析 livereload 當程式執行之後就會開啟一個websocket server,如果檔案有任何變動,會發送訊息給瀏覽器,瀏覽器就會依據檔案不同執行不同程序。 Server端其實做的事情就是監聽檔案變化,發送訊息給client! 而預設的網站port號會採用35729,如果想要變更port號,在自己的家目錄底下有一個.livereload 檔案,去底下修改這個檔案,例如35729 修改為 88887。 ~/.livereload config.port = 88887

[解說] 什麼是前端工程師? What is front end engineer?

前言 網路上有許多文章解說,什麼是前端工程師,我跟我朋友這樣解釋:『Html, CSS, javascript只要會這些,就可以了!』,許多人的第一個直覺就是『 做網站的 』。沒錯!我是做網站的,但我是做網站的前端! (還是做網站的...) 因此興起個人寫一篇 人人都看得懂 , 人人都可以輕鬆瞭解 什麼是網站前端工程師。 網站前端工程簡介 前(Front)端(end)工程(Engineer),網站前端構成三要素 Html, CSS, Javascript ,以下以 美女 圖例解說。 Html + CSS +  Javascript =  素材來源 呈現的頁面及互動方式必須: 1. 容易讓使用者接受及使用 2. 與使用者互動良好 3. 增加使用者黏著度

[快快樂樂教學] YUI2 in 3 使用方法,以calendar widget 為例

YUI2 in 3 使用方法,以calendar widget 為例。 使用方法 Y.use('yui2-calendar', function (Y) { var YAHOO, _cal, id = 'calContent', //指定的id pageDate = '9/30/2010', //設定起始日期, 格式均為,月/日/年 minDate = '1/1/2010', //設定最小日期 maxDate = '12/30/2010'; //設定最大日期 YAHOO = Y.YUI2; _cal = new YAHOO.widget.Calendar( '_cal', id, { pagedate: pageDate, mindate: minDate, maxdate: maxDate } ); // 可以設定多國語系 _cal.cfg.setProperty("MONTHS_LONG", ["Jan", "Feb", "Mar", "Apr", "Mai", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"]); _cal.cfg.setProperty("WEEKDAYS_SHORT", ["S", "M", "D", "M", "D", "F", ...

Google Calendar API in PHP 教學(三) - 帳號驗證

上篇文章 中已教導如何使用api,而Google對於帳號驗證方式有以下兩種: (如果對於驗證沒有什麼興趣的朋友可直接跳過) 1.帳號密碼直接輸入       此種方式雖然直覺但是對於要公開給大眾使用,似乎缺少了一點可信度,在保密程度上也可能因為程式的設計不良導致帳號密碼被擷取,危險性高了些,但是如果因為機制上需要共用同一組google account似乎是個不錯的選擇! 2.由google登入後產生token      登入帳號密碼驗證由 google 登入頁面 處理,而驗證後會產生一組 token ,由這一組token使api產生 gSession 使驗證通過。

建立XMLHttpRequest pool

在ajax應用中,通常一個面要同時發送多個請求,如果只有一個XMLHttpRequest物件,前面的請求還未完成,後面的就會把前面的覆蓋掉,如果每次都創建一個新的XMLHttpRequest物件,也會造成浪費。解決的辦法就是創建一個XMLHttpRequset的物件集區,如果池裡有空閒的物件,則使用此物件,否則將創建一個新的物件...