如果你曾去過坐式餐廳，那麼你就能理解web開發中前端和後端的區別。
在開始學習web開發，你會遇到一系列使你迷迷糊糊的概念。
資料庫？伺服器？客戶端？服務端？AJAX？
幸運的是，你只需要瞭解HTML和CSS就可以去建立你的第一個站點了，它可以在你本地電腦上執行起來。但是，如果你想讓你的站點能線上上執行起來，你需要了解下前端和後端的概念。
這裡有個一般的想法：類比餐廳裡面的服務員和廚房員工，前端和後端在你的站點上也是分工合作。在它們擅長的領域為站點服務。
對廚房員工來說，這意味著高效地製作出美味的食物。而服務員是與客戶合作並創造良好客戶體驗方面的專家。
在web開發中，前端有時被稱為客戶端，而後端有時被稱為服務端。
以下是不同技術在web應用程式的前端和後端中扮演的角色。為了能理解這篇教程，你需要掌握基本的HTML和CSS知識。
介紹前端
我們先來介紹下前端。前端程式碼建立使用者介面，這是web訪問者與程式碼互動的組織方式。在我們的舉例中，類似餐廳的餐桌，這是個提供顧客和服務員可控交流的地方。所以，想象一下，網站就好比餐桌，比如http://mysite.com網站。
首先，使用者（客戶）需要些可以瀏覽的東西。在設定的餐廳的場景裡面，很明顯，對應的就是選單了。這是一段靜態的內容，應該讓客戶更加容易理解他們的選擇。
從一個前端開發者的視覺來看，這類似於HTML和CSS。這兩種語言允許你建立靜態內容。
很明顯，我們缺失了一樣東西。你不可能對這選單大喊大叫，期待發生些什麼事情。你需要一種方式將你的訂單傳達給廚房人員。
這時候，服務員就登場了。服務員能幫助你瞭解選單，回答你提出的任何問題，然後將你的訂單交給廚房人員。服務員是互動方面的專家，明白你的需求。這正是Javascript的用武之地了。
作為一個開發者，Javascript將幫助你實現各種目標。它能夠為使用者帶來更好的頁面體驗，幫助使用者找到適合的資訊。它也是一種能用來傳送使用者請求到後端的語言。換言之，當你寫Javascript，它並不意味著你正在和後端發生了什麼互動。（因為）Javascrip只是前端的一部分，可以不用和後端互動就能解決很多問題。
通過上面選擇膳食的過程，我總結了（HTML/CSS和Javascrip 或者 選單和服務員）兩方面。當使用者訪問你的站點時，他們是帶有目的的。你的程式碼必須幫助他們來達成目標。
- 使用者能夠很快的瀏覽並知道提供了什麼（HTML/CSS）
- 使用者能夠很快的找到更多的幫助他們下決心的資源（Interactivity/JavaScript）
- 使用者能夠採取措施去接近自己的目標（User Request/ JavaScript）
介紹後端
你是否進過餐廳的廚房？至少可以說，那是個高壓的地方。它與客戶看到的環境完全不同。你甚至可以說，服務員和選單提供了發生在廚房的事件的友好、完美的呈現（場景），而廚房（對客戶來說）並沒有呈現什麼製作過程。
這好比web應用程式中的後端，或者執行在服務端的程式碼。類似廚房，伺服器位於與使用者介面不同的位置。它是使用不同語言進行交流的。
由於伺服器實際上是遠端的計算機,因此它比任何給定的計算機上面的瀏覽器具有更多的計算能力。就像廚房的員工，重點在於效率和生產力。
想象一下複雜的餐廳廚房。它必須在正確的時間和正確的位置將食材準備好。廚房的員工必須知道在特定的時間做他們的工作。他們必須重複地生產同等質量飯菜。相似的，伺服器必須組織web應用程式中的資料，以便在適當的時候傳送正確的內容。
伺服器必須在接收到請求的時候，傳送響應。
在餐廳的場景中，響應可能是下面幾種：
- 佳餚
- 廚房對您要吃的飯製作材料已被用光的反饋
- 服務員並未對問題的跟進
不管是什麼，迴應是通過服務員傳達給客戶的。在web中，那就是Javascript程式碼了。
比較流行的後端語言和框架包括Ruby, Ruby on Rail, node.js, PHP和其他。
為什麼我們需要前端和後端
一個比較實際的原因是，我們必須在客戶端和服務端執行不同的程式碼。全部的現代瀏覽器只能理解HTML, CSS 和 JavaScript。所以，這是我們不能在瀏覽器上使用服務端語言的一個簡單原因。
另一個原因是，我們允許每邊都專注在他們擅長的地方去迎接挑戰。你能想象下，如果廚師去當服務員，那將給客戶的使用者體驗帶來多大災難。所以，我們很幸運，我們有一方專門從事使用者介面，另一方專門研究伺服器方面的挑戰。
純前端網站
想象一下，你擁有一家不在網上銷售任何東西的企業。假設你擁有一家當地的花店。
在那種情景下，你不需要後端，因為那場景不復雜。你只需要前端，也許是一個表格，可以將任何查詢指向你的電子郵箱。
換言之，一些網站只是用於瀏覽和採取某種瀏覽器不需要處理的行為。你不需要為每個型別的網站編寫後端。你可以使用Github Pages將你的純前端網站放到網上。
後話
翻譯原文Front End v. Back End Explained by Waiting Tables At A Restaurant