簡介
上次從靜態網頁講到了動態網頁，講到了MVC，也講到了REST API是什麼，這些都是網頁發展的過程中所留下來的精華。做網頁的時候，我們可以選擇是否依照這些原則。照著走的好處就是你已經站在巨人的肩膀上（你瞧，巨人肩膀上擠滿了人），做起事來會更加的輕鬆。而集合並規範這些原則的，就叫做Framework（等一下會提到）。
開始囉！
沒一村，我記得你第二堂課的時候，有提到前端是由html + css + javascript所構成的，你是不是漏掉什麼沒講了啊？
XDD，不小心被你發現了，我上一堂課不小心漏掉了Javascript沒講到。很好很好，其實我是在考驗你有沒有認真在聽我說！
(Javascript的遺漏，感謝網友Leo Chen提醒)
JavaScript的發軔
JavaScript，前端網頁「現在」唯一使用的程式語言，誕生於1995年，由 Netscape 的 Brendan Eich 所發明。 JavaScript 最初在Netscape瀏覽器上執行，使得網頁可以根據使用者的動作，做出不同的反應。爾後微軟也推初類似的產品JScript，一樣可以在瀏覽器上運行。
ECMAScript——JavaScript 和 JScript 的協調者
那 JScript 現在跑到哪裡去了呢？為什麼我到現在只會聽到JavaScript，壓根沒有JScript的聲音了呢？
沒錯，說的很好，由於兩個語言的存在，造成瀏覽器端程式編寫的麻煩，為了工程師的福祉，為了保護地球世界的和平，一個叫做ECMA的組織跳出來做協調。
JavaScript 和 JScript 這兩個異母異父的兄弟（不同公司，當然是異母異父的兄弟），在筆者剛出生的1996年就打得火熱，因為兩者的差異性實在是有一點大，工程師在撰寫程式碼的時候，不得不為兩種瀏覽器（Netscape 和 IE）撰寫不同的程式碼，也造成工程師間極大的不便。而關於瀏覽器的演進，可以參見本篇下方附錄，也可以順手點進我的粉絲專頁，幫我點個讚XD
為了讓工程師們可以騰出更多的時間喝杯咖啡，走出戶外和異性約會，創造國家生育率，藉以培養更多的下一代工程師坐在電腦前寫更多的程式，一個叫ECMA的組織出面來做協調。參與這場協調的，有幾個當時有名的公司（也就是說現在不有名了），包括微軟、Netscape、Sun，參與了這次的標準的制訂。這是個劃時代的標準制訂，對於網路世界的蓬勃發展，有莫大的幫助。
1997年，ECMAScript第一版推出，推出後，所有瀏覽器都會盡量去實作這個標準上的所有功能，如此一來，也更方便工程師寫出更多通用的程式。截至目前為止，ECMAScript己經出到了第6版，而第7版目前尚在制訂中。話誰如此，所有的瀏覽器目前都只有支援到第5版而已，如果要撰寫使用第6版功能的程式碼，也是可以的。不過因為主流瀏覽器都還未支援第6版的程式碼，所以我們要透過一些工具，把第6版的程式碼轉換成第5版的程式碼。
注意，在網路的世界裡，標準是十分重要的。因為能夠制訂標準的人就是老大。在家裡，你媽媽制訂標準，說你不能怎樣就是不能怎樣。因為她制訂標準，所以她是老大，財產畫在他名下，就連老公也要遵守。在學校裡，制訂規則的是校長老師們，所以他們是學校裡的老大。因此在制訂網路、網頁和程式語言的標準時，各相關公司都會出席，希望能制訂一些自己喜歡的規則。那麼在這個圈子裡，他們說的話也就會更有份量。
Java 和 Javascript 異母異父的兄弟
哈囉，可以給我來杯咖啡嗎？
好的，等我個幾分鐘。
………
來，這是你的咖啡。說到咖啡，那個以咖啡做為圖像的Java，該不會跟JavaScript也有一腿吧？
不不不，他們完全沒有關係啊，只是名字像而已……
貴圈真亂，我想我還是退出好了……
拜託別啊！網頁工程師可是很好玩的，且讓我說下去！
其實 Javascript 的前身，叫做 LiveScript，只是在 Java 大大正火紅的時候，為了討個喜氣，討個名氣，於是 Netscape 在和開發 Java 的 Sun 成協議後，便把它改名叫做 JavaScript。看來JavaScript也是個牆頭草啊！
Java 語言在當時會紅，有它的必然性，不過這和本篇的主題無關，有興趣可以查一下。雖然現在Java感覺上不是那麼的紅了，他還是世界上一個很重要的程式語言，足以和C/C++分庭抗禮。而筆者也是Java的愛好者之一。
至於 JavaScript，本身和 Java 是一個「完全不同」的語言，這點非常的重要！Javascript是屬於直譯式的語言，而Java是屬於編譯式+直譯式的語言，而我們常見的C/C++則是編譯式的語言。直譯式和編譯式最主要的分別，比較不好比喻，我直接解釋好了。
首先是直譯式語言，Javascript的程式碼是放在一個JS檔上的，這點我們在第二篇（我是傳送門）時有提過。之後，我們的直譯器會一行一行的去執行，執行到一半，因為程式碼寫錯而發生錯誤了，該怎麼辦？就爆給你看，而該完成的功能就無法完成，會影響網站的執行嗎？可能會可能不會，這點不能保證。有可能這個功能壞掉了，但是其它的功能還是可以用的。一般來說，大型網站多少都會有一些bug，想要知道有什麼bug，開啟Chrome Developer Tool (F12)後，在網站上隨便按一按，有出現紅字，那就是有錯誤發生了，但是網站有crash掉嗎？那可不一定。
以下這張包含一個error和一個warning：
以下這張圖也出現了一個error，不過這是我自己的chrome extension有問題，和該網頁的網頁工程師沒有關係。（感謝網友Andre Lee指正）
而編譯式語言，會先把檔案編譯成一個可以執行的執行檔，中間如果程式碼有寫錯，那就無法編譯。此時就要去修改程式碼，直到它可以編譯成功為止。當然也有可能執行檔執行到一半時，執行檔crash掉，這種error叫做runtime error。詳細內容，也可以自行查閱。
而Java，則是總和編譯和直譯的語言，詳細內容亦不在我們討論範圍。總之，很重要的一點，Java和JavaScript很不一樣，千萬別搞混了！
Framework——網頁撰寫加速器
我剛剛右鍵把網頁原始碼點開來看，覺得程式碼好多喔，看的我都快昏了，工程師要親手弄那麼多東西嗎？也太複雜了吧？
你這個人怎麼意見這麼多。好啦，其實工程師是很懶的，為了加速網頁開發和去除重複的步驟，大型網站的開發都會搭配一個網頁的framework來進行。選擇有利的framework，做起事來可是事半功倍的！
因為網頁分工越來越明確，為了加速網頁的開發，於是framework（框架）出現了。以Ruby on Rails（後面簡稱RoR）這個 framework 來說， 它在2004年出現，到現在為止，都還是一個很火紅的framework。
如果說 Ruby on Rails 是一個框架，那它是用什麼語言寫的？那跟函式庫（library）又有什麼差別？
很好，你提了一個很棒的問題。Framework、library、程式語言，這三個的差別，絕對有必要說清楚，且讓我為你分析。
RoR 是一個前後端整合性的framework，使用這個framework，你可以輕鬆鬆的實踐MVC這個概念。在程式碼中把需要的library 給 import進來，就能快速的搭建一個網站。而在撰寫程式碼時，我們所需要的程式語言是Ruby。
還是很不好懂嗎？這麼說好了，以廚房來做比喻好了（天啊，你哪來這些奇奇怪怪的比喻），如果你現在要設計很多種廚房，這幾種廚房分別做
- 美式料理
- 台菜
- 法國料理
- 咖啡廳
那你就會需要4種不同framework的廚房。根據不同的煮菜需求，你會需要適合的廚具、刀具、餐盤，而這些就是你的library。比如你現在想要蒸一籠蒸餃，那你就要import一個蒸籠，這樣你才能蒸出一盤好吃的蒸餃。當然你也可以用電鍋來蒸蒸餃，而且如果你技術夠好的話，可以蒸的一樣好吃。這說明了不同的library，有時候也可以完成相同的功能。
library間彼此的差異是可大可小的。有的library非常健全，就像大同電鍋一樣，功能包山包海。也有的library寫來就只是為了完成一個小小的功能。
Framework是一種程式總體的規範，大部分是比較嚴謹的。它規範的範圍是可大可小的，譬如檔案位置、程式碼風格、library如何管理……。一般來說，照著某個Framework既定的規範或傳統下去走，可以很快的完成一個成品，因為中間很多的過程，都有別人撰寫的library幫你完成雜事了。
以RoR 來說，他是一個全端（前端加後端）的framework，按照它的規範下去做網頁，前端的檔案放哪裡，後端的檔案放哪裡，request和response的串接，都有現成的規定和做法，可以很快的完成一個網頁，而且是照著MVC的架構下去做的。
下面舉例一些常見的framework，使用的語言，想要完成的事：
- bootstrap，CSS，快速建造一個網站的畫面配置
- Ruby on Rails，Ruby，全端framework
- Nodejs+Express，Javascript，後端framework
- AngularJs，Javascript，前端framework
- Laravel，PHP，前後端framework
真有意思，那我該如何選擇我想要的framework呢？
哈哈，聽出興趣了齁，我的連載都還沒講到程式的部分，你就想要開始寫了XD，孺子可教也！
以前端來說，我的建議是先不要貿然進一個framework，由 CSS 和 html 開始慢慢寫，寫著寫著，就會知道哪裡寫起來很廢事，很花時間。這時候，你自然而然就會去找一個你覺得OK的framework了。
以武打來說，framework是花招，而基本的javascript、css、html是基本功，學好基本功，才能把花招發揮的更有威力！
結語
這一篇只介紹了兩個東西，分別是 javascript 和 framework。雖然只介紹了兩樣東西，卻花了一篇文章去慢慢解釋，因為我認為這兩個觀念對未來是很有幫助的。
本來想要談到一些AJAX的東西，時間不早了，就留到下次再說吧:)
嘿，你這杯Java真好喝！可以再給我來隻Chicken嗎？
附錄
粉絲專頁
https://www.facebook.com/noootownnotes/
關於我：
我是沒一村，專長和興趣是程式、主動投資、科技商業模式。可以參考我的書單和比較熱門的文章：
最近幾個月才開始學習前端，很喜歡你前端連載的文章，讚!!
謝謝你的喜歡:)，也歡迎幫我分享:)
Pingback: [前端連載] 什麼是AJAX，以及CSS3、HTML5簡單介紹 – 沒一村生活點滴
Pingback: [前端連載] 什麼是AJAX，以及jQuery、CSS3、HTML5簡單介紹 – 沒一村生活點滴
感謝你的分析，有趣又好懂