跳到主要內容

文章

目前顯示的是 五月, 2011的文章

[介紹] SeaJS, 模組化開發加載套件. SeaJS, a loading library for web front end.

頁面上很多靜態檔案,使瀏覽器等待檔案下載,導致頁面短暫性的的當機,畫面整個卡住,滑鼠連點擊的動作都無法執行,因此許多人會使用動態方式加載靜態檔案,諸如javascript, css, img...等。

針對Javascript, CSS檔案,特別介紹這套SeaJS,有別于之前介紹的NodeJS,兩者都屬於遵從commonJS規範編寫而成,但是SeaJS主要針對前端Javascript , CSS下載時,使用nonblocking的方式,同時可以使用callback來執行接下來要處理的事情。

通常一般頁面處理,讀取靜態檔案方式如下:
<script src="/js/jquery.min.js"></script> <script src="/js/jquery.easing-1.3.pack.js"></script> <script src="/js/jquery.mousewheel-3.0.4.pack.js"></script> <script src="/js/jquery.fancybox-1.3.4.js"></script> <link rel="stylesheet" href="/js/jquery.fancybox-1.3.4.css"/>

[筆記] ubuntu 11.4 安裝nginx, php. Install nginx, php on ubuntu server 11.4

環境提要:
VM
OS: ubuntu server 11.4 LTS,
不同版本ubuntu server,nginx 的設置不同,因此請先確認自己的伺服器版本是否相符合!

安裝nginx
sudo apt-get install nginx php5-fpm
執行nginx
sudo /etc/init.d/nginx start

沒意外的話,就會出現上圖。

[教學] VM Server 可以使用 SSH. Make VM server can be ssh connected.

環境:
VM: virtualBox
OS: Ubuntu Server 10.10 STL
網路連線:橋接模式

前言
Ubuntu server一開始是不會有SSH可以連線,因此我們需要架設SSH server來做為串接。

安裝SSH client
sudo apt-get install openssh-client

[教學] Facebook API 建立相簿 Build Facebook album using Facebook API

Facebook API 基本篇描述了使用Facebook API一開始要注意的事項,本來要寫如何上傳照片,不過『相簿』與『照片』之間的關係緊密相連,為了湊篇幅,因此分成兩個文章描述。

注意:本文章解說Facebook API以PHP語言為主!

瞭解何謂『相簿』
在Facebook中,相簿對系統來說,就是一個『id』,因此『相簿名稱』相同,不表示同一個相簿,他們會各自有獨立『相簿id』。


進入相片選項
相同相簿名稱,卻同時並存
進入每個相簿,會發現Url後面的參數不盡相同

[分享] 找到問題的開頭,找到困擾的源頭

人是一種很奇妙的動物,永遠無法滿足于現況,總是放大對方『好』的一面,卻放大自己『劣』的一面。每天都在苦惱中度過,總覺得工作不順心,薪水不夠用,房子不夠大,車子不好夠等雞毛蒜皮事項。完全忘記許多初衷,第一次得到工作,領到第一份薪水,完成第一份專案,第一次熬夜加班,第一次牽起彼此的手,忘記了許多的第一次,腦袋中想的只有『不滿』的現況。

沒錯!現況的確不好,事事無法如意,但是人生卻要進行下去。該怎麼做?

這的確是個千年難解的問題,家家有本難念的經,你的問題在我身上不一定會出現,而我的問題對你而言可能一笑置之。但是問題出現了,聰明的人總是希望去解決,解決這些無法用言語實際描述的困境,問過許多朋友,對於目前的現況有什麼不滿,大多得到一句『一言難盡』。

到底是『一言難盡』,還是『有苦難言』,又或者『沒有』思考過問題的本質?

[教學] Blogger當中加入facebook 讚! Add facebook like button in Blogger template

心血來潮,世界最強推廣功能,Facebook like 功能終於姍姍來遲了!搜尋的幾篇文章,結果發現都無法正確加入『讚』的功能,十分火大,還好在網路上找到一篇原文資料『Add FaceBook Like Button For Blogger ( BlogSpot ) And Customize It.』。英文資料看起還還是頗不爽,因此寫一篇筆記文讓自己日後傻掉,可以快速回覆記憶。

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

前言
網路上有許多文章解說,什麼是前端工程師,我跟我朋友這樣解釋:『Html, CSS, javascript只要會這些,就可以了!』,許多人的第一個直覺就是『做網站的』。沒錯!我是做網站的,但我是做網站的前端!(還是做網站的...)
因此興起個人寫一篇人人都看得懂人人都可以輕鬆瞭解什麼是網站前端工程師。


網站前端工程簡介
前(Front)端(end)工程(Engineer),網站前端構成三要素Html, CSS, Javascript ,以下以美女圖例解說。

Html + CSS +  Javascript = 
素材來源 呈現的頁面及互動方式必須:
1. 容易讓使用者接受及使用 2. 與使用者互動良好 3. 增加使用者黏著度

[教學] Facebook API權限開放教學,Facebook API for PHP login url premission

[教學] Facebook API PHP SDK - 基本篇,已經提到基本的 Facebook 觀念,如果需要取得更多資料呢?例如,使用者Email, 貼資料在牆上, 取得朋友列表...等,都需要在使用者登入的時候,就按下允許。

參考資料
Facebook API權限介紹權限需求對照表
參數說明
$login_url = $facebook->getLoginUrl(array( 'fbconnect' => 1, 'canvas' => 0, 'next' => 'http://localhost/demo/facebook/index.php', 'redirect_uri' => 'http://localhost/demo/facebook/index.php', ));
參數說明:
fbconnect:Facebook 連線,恆為1。
canvas:Facebook內的畫布,沒有用到,為0。
next:按下完成後轉向網址。
redirect_uri:下一頁轉向網址。

基本款權限如下圖

修改參數 $login_url = $facebook->getLoginUrl(array( 'fbconnect' => 1, 'canvas' => 0, 'req_perms' => 'email,publish_stream', 'next' => 'http://localhost/demo/facebook/index.php', 'redirect_uri' => 'http://localhost/demo/facebook/index.php', ));
加入req_perms = email, publish_stream權限之後,登入權限會變成,如下圖


沒錯,如此一來就可以擁有操控權限,是不是非常的容易呢!?

原始碼,自己拉回去改。

<?php require './facebook.php…