導(dǎo)讀：Arunr 把過(guò)去 15 年以來(lái)，Web開(kāi)發(fā)從最初的純 HTML 到 CGI、PHP\JSP\ASP、Ajax、Rails、NodeJS 這個(gè)過(guò)程簡(jiǎn)要地進(jìn)行了介紹。Arunr 計(jì)劃把這個(gè)作為一個(gè)大綱，接下來(lái)把每一部分詳細(xì)地寫點(diǎn)東西。如果你想了解Web開(kāi)發(fā)的轉(zhuǎn)變軌跡，推薦看看這篇文章。南寧網(wǎng)站建設(shè)
在接下來(lái)的幾個(gè)月時(shí)間里，我打算寫一系列關(guān)于完整web開(kāi)發(fā)的文章。這第一篇文章雖然有所粗略，但也能夠充分概括了在之前15年或者更久的時(shí)間里web應(yīng)用程序如何進(jìn)行演變。并且最后我會(huì)囊括下這段時(shí)間內(nèi)所寫的相關(guān)技術(shù)。
在過(guò)去的美好日子里，我們使用的是簡(jiǎn)單的web頁(yè)面(包括動(dòng)態(tài)gif圖片！)。作為精美設(shè)計(jì)的典范，蘋果有著這樣的一個(gè)網(wǎng)站：
在那時(shí)，Web開(kāi)發(fā)還比較簡(jiǎn)單，開(kāi)發(fā)者經(jīng)常會(huì)去操作web服務(wù)器(主要還是他自己的機(jī)器)，并且他會(huì)寫一些HTML頁(yè)面放到服務(wù)器指定的文件夾(/www)下。這些HTML頁(yè)面，就在瀏覽器請(qǐng)求頁(yè)面時(shí)使用。
問(wèn)題就出現(xiàn)了，你只能獲取到靜態(tài)內(nèi)容。倘若你想讓訪問(wèn)者看到有多少其他訪問(wèn)者訪問(wèn)了這個(gè)網(wǎng)站呢(還記得那些統(tǒng)計(jì)流量的旋轉(zhuǎn)圖片嗎？！)，或者倘若你想讓訪問(wèn)者去填寫這樣一個(gè)表單，包含有姓名和郵件地址呢？于此就轉(zhuǎn)向了CGI和Perl腳本，在web服務(wù)器端運(yùn)行一段短小的代碼，并能與文件系統(tǒng)或者數(shù)據(jù)庫(kù)進(jìn)行交互。
當(dāng)時(shí)組織CGI/Perl這樣的腳本代碼太混亂了。CGI伸縮性不是太好(經(jīng)常是為每個(gè)請(qǐng)求分配一個(gè)新的進(jìn)程)，也不太安全(直接使用文件系統(tǒng)或者環(huán)境變量)，同時(shí)也沒(méi)提供一種結(jié)構(gòu)化的方式去構(gòu)造動(dòng)態(tài)應(yīng)用程序。幾年來(lái)一直很困惑，直到大約2005年左右，出現(xiàn)了Java Server Pages(JSP)，微軟的ASP，以及PHP！我喜歡把當(dāng)時(shí)的參考架構(gòu)比作成IIS和ASP.NET，你可以用Visual Studio快速構(gòu)建一個(gè)可伸縮并且安全的應(yīng)用程序。
直到當(dāng)時(shí)，web服務(wù)器多半會(huì)返回整個(gè)頁(yè)面或者文檔，但AJAX(2005)的出現(xiàn)，讓事情變得很有意思。AJAX允許客戶端的JavaScript腳本為局部頁(yè)面提供請(qǐng)求服務(wù)，然后可以在無(wú)需回到服務(wù)器情況下動(dòng)態(tài)刷新部分頁(yè)面，也就是更新瀏覽器中的document對(duì)象，通常稱作DOM，或者文檔對(duì)象模型。
雖然從服務(wù)器端返回的仍然是HTML，但瀏覽器上的代碼能把這HTML片段內(nèi)嵌到當(dāng)前頁(yè)面中。也就是說(shuō)web應(yīng)用的響應(yīng)可以更快，這時(shí)我們真正用web應(yīng)用取代了web頁(yè)面。谷歌的GMail和谷歌地圖都是當(dāng)時(shí)AJAX的殺手級(jí)產(chǎn)品。隨后用AJAX局部刷新就如雨后春筍般出現(xiàn)。
在隨后的幾年時(shí)間里，AJAX成為了焦點(diǎn)，但在服務(wù)器端仍然使用著舊有的技術(shù)。大概在2007年，37signals公司公開(kāi)其成員–Ruby on Rails。那個(gè)基于Ruby on Rails 5分鐘構(gòu)建博客的演示完全征服了全世界的開(kāi)發(fā)者。一夜之間，所以談?wù)摰慕裹c(diǎn)都是關(guān)于Rails！Rails的不同之處在于使用規(guī)定的方式去設(shè)計(jì)你的web應(yīng)用程序，運(yùn)用一種已經(jīng)廣泛在桌面應(yīng)用開(kāi)發(fā)，但未被搬到web應(yīng)用上的開(kāi)發(fā)模式。這種模式就叫做模式(數(shù)據(jù))-視圖(模板)-控制器(業(yè)務(wù)邏輯)。Rails強(qiáng)調(diào)，“這事就該這么做”，并且通過(guò)許多插件讓構(gòu)建web應(yīng)用再一次更加健全。
在2007到2010年期間，涌現(xiàn)了3種開(kāi)發(fā)潮流：
第一個(gè)是智能手機(jī)和移動(dòng)應(yīng)用潮流。通常情況下，許多應(yīng)用程序同時(shí)有web和移動(dòng)應(yīng)用兩種版本。盡管如此，服務(wù)端仍然返回的是HTML頁(yè)面，而不是其它移動(dòng)應(yīng)用可以識(shí)別。因此，你需要返回的是結(jié)構(gòu)化數(shù)據(jù)來(lái)取代HTML。
第二個(gè)開(kāi)發(fā)潮流是jQuery。這是一個(gè)非常流行的JavaScript庫(kù)，能夠很容易構(gòu)建動(dòng)態(tài)、美妙的web應(yīng)用，甚至是AJAX！
第三個(gè)潮流是Node.JS的發(fā)布。這是第一次能讓你用JavaScript開(kāi)發(fā)高性能的服務(wù)端程序，進(jìn)而可能結(jié)束“客戶端開(kāi)發(fā)者”要知道HTML/JavaScript，“服務(wù)端開(kāi)發(fā)者”要知道.NET/C#/Ruby這樣的噩夢(mèng)。
盡管這是一個(gè)不錯(cuò)的架構(gòu)，但我們可以重用一些在客戶端的收獲去簡(jiǎn)化那些曾經(jīng)發(fā)生在像客戶端意大利面似的jQuery代碼。和Rails精神類似，我們需要用一種規(guī)定的方式從服務(wù)端獲取到數(shù)據(jù)，再對(duì)客戶端的HTML頁(yè)面進(jìn)行包裝。因此，在接下來(lái)的2年時(shí)間里，業(yè)界出現(xiàn)了許多用于簡(jiǎn)化客戶端開(kāi)發(fā)的框架，諸如Backbone，Ember，Derby和Meteor，當(dāng)然也包括我的最愛(ài)，AngularJS。
因此，這就是我們看到的今天，而我后面要講到的參考架構(gòu)是這樣的，mongodb作為數(shù)據(jù)庫(kù)服務(wù)器，node/express作為web應(yīng)用服務(wù)器，客戶端使用AngularJS，同時(shí)也使用Bootstrap樣式風(fēng)格。我發(fā)現(xiàn)這種架構(gòu)允許我能夠快速構(gòu)建web服務(wù)以及基于AngularJS的客戶端接口，甚至和其它的服務(wù)，如PhoneGap或者其它原生移動(dòng)開(kāi)發(fā)工具一樣，進(jìn)行移動(dòng)應(yīng)用的開(kāi)發(fā)。
在接下來(lái)的幾個(gè)星期里，我會(huì)發(fā)表一些文章來(lái)說(shuō)明這些涉及到的組件，包括：MongoDB，Node/ExpressJS，JSON和REST接口，AngularJS，Karma-mocha測(cè)試和Bootstrap樣式風(fēng)格頁(yè)面。
