旺旺先備知識：網頁篇

今天將要來介紹基礎網頁概念~歡迎各路高手給予指教(･ω´･ )！！

What is Web Development

• 所有的網站，都是由一堆文件、圖片、影音...檔案所成形的。然而，這些檔案並不是存放在自己的電腦上，而是存放在一臺名為Server的主機裡。當我們存取某一個網站時，我們的電腦會透過網際網路(Internet)向遠端的Server主機索要檔案、資料，等到電腦接收到Server傳送的檔案後，再由瀏覽器(Browser)呈現內容頁面。
• 這裡，我們稱我們開啟的瀏覽器為Client端，而遠端存放資料、檔案的主機稱為Server端。當然，檔案的傳輸是可以雙向(Client->Server、Server->Client)的。

Front-end & Back-end

• 簡要劃分的話，Front-end(前端) 專門處理Client端的事務，也就是瀏覽器所呈現的畫面。而Back-end(後端) 則處理Server端的事務，也就是Client端無法真正看見的背景處理和邏輯運算。
• 還是不太理解嗎？我來說個故事。

  風和日麗的這天，胖虎來到了麥當勞，他看了看菜單，向點餐的服務員小夫說：「小夫，我要點餐囉」點完餐後，廚房收到來自胖虎的點餐，開始製作起了胖虎的餐點。但整個交易的過程，胖虎其實不需要知道眼前美味的佳餚是怎麼弄出來的，他只需要等螢幕跳到他的號碼，然後領取餐點走人。

  這個故事裡頭，小夫就是Client端，而廚房就是Server端。

Front-end基本介紹：

當你在逛一個網站的時候，會看到漂亮的頁面、比如有圖片和排版等等，或是一些互動，可以點擊連結、按鈕。

Front-end由三大語系組成，瀏覽器所呈現的內容便是由這三大語系建成。

1. HTML：Hyper Text Markup Language。網頁撰寫最基本中的基本。當我們利用瀏覽器打開任一網頁時，可以右鍵->檢視網頁原始碼，裡面可以清楚見到HTML的語法，特別的是HTML以tag標籤<p>...</p>的形式來表明不同的內容類型。
2. CSS：Cascading Style Sheets。HTML有提供一些基本的內容版面配置、設置，但真的就是最基本的那種。如果想要讓HTML看起來繽紛、整齊、美觀，具有絢麗、華美的版面，甚至是讓圖片會隨著滑鼠移動的小動畫，那就得靠CSS了。
3. JavaScript：是一種用來呈現網頁動態效果的程式語言。如果說CSS是調色盤，讓BROWER有了顏色；那麼JavaScript就是BROWER的齒輪，讓原本沉靜的網頁動起來！！

Back-end基本介紹：

介紹完前端，接下來當然是後端囉~
後端主要著重在功能(function)與資料存取。

功能諸如登入、購物、註冊等等；而資料儲存又是甚麼呢？
註冊、登入剛好有這兩件事XDD，當使用者按下按鈕之後，有頁面更動、或是帳密的傳遞都屬於功能這部分，而與Server端帳密的比對，便是資料儲存的部分囉~

後端語言比較多，比如PHP、Python、Ruby on Rails...
雖然近幾年Python的使用率增長不少，但是筆者暑假學的是PHP

今天，做了網頁簡單的基本介紹。
前端後端各有好壞，但是要服用前記得詳閱說明書~

還不確定要往前還是往後的小羔羊們，可以都先初探玩玩看XD
等到摸清楚、確定方向之後，再一頭栽進深淵吧~
(或是突然清醒，離開Coding這個愛到卡慘死的坑哈哈哈

題外話：早9上到晚9，差點生不出這篇文章了QQ，明天繼續加油！