【新手寶典】一篇博文帶萌新建站並瞭解建站體系流程和對萌新友好的便捷方式，這篇博文頗有多是你的啓蒙文

時間 2020-06-27

標籤新手寶典一篇博文新建瞭解建站體系流程友好便捷方式頗有啓蒙简体版

原文原文鏈接

前言

本片博文主要面向於還沒接觸過web開發的萌新，以及想知道總體流程而且完成建站的萌新；若是你是個大佬，就不必看下去了。php

本篇博文沒有難啃的骨頭，請各位萌新放心食用。 本篇博文采用通俗易懂的方式講解，輕鬆而且比較接地氣！ 本篇博文涉及的專業名詞將會講解說明。 html

瀏覽一個網頁的基本流程方式萌新可理解

在學習一門技術的時候，每每是瞭解總體體系架構才能更好的學習，否則在學習的過程當中會出現不知道爲何這樣作，作出這一部分是該總體部分的哪一個區域，只會跟着作，可是並不瞭解這是在幹啥。可能一些萌新體會頗深，就照着打，老師教怎麼寫，我就怎麼寫，反正作出來了。前端

本篇博文，就來用最接地氣的方式對基本的web開發作一個總體的講解，帶各個萌新過一遍web開發的流程，好讓各位萌新知道學習的時候學習了什麼知識點，這個知識點可以幹哈。node

最開始，咱們就以我的瀏覽網站的方式給你們說一下這一個過程是如何運做的。 python

咱們訪問網站，通常先打開瀏覽器（不要槓），輸入一個網址，隨後瀏覽器打開一個網頁。在你在請求這一個網址數據的時候，已經發生了一系列的操做。mysql

啥是IP地址

假設你輸入的是「csdn.net」，瀏覽器想要去訪問你這個網站，首先須要的是得到你這個網站的IP地址。可能就有萌新問了**「什麼是IP地址？」。IP地址就是「指互聯網協議地址，或者說網際協議地址」。又有萌新說了「你這麼說我怎麼懂？」**，好了如今容我慢慢道來。c++

IP地址就是在網絡中，定位你這臺電腦，或者說是設備的一個標記，這個標記是人們指定好的標準協議而產生的（協議就是你和我說好了一件事，拉鉤了，之後要這樣作）。就像你家的門牌號例如叫作「CSDN市，CSDN區，CSDN街道的CSDN小區第CSDN棟的第CSDN號」...這是由有關機構制定的一套規範名稱，不容許隨意更改；咱們換個例子，例如你家是「深圳市南山區深南大道某某小區第八棟808」，你寫快遞的收件地址確定是寫這個，難道你寫「宇宙第一星球第一市第一棟第一號」？地址是由專門組織規範且制定的一套定位規範，遵循這個規範可使遵循該規範的設備或者人之間相互通訊，這個通訊指能夠傳達交互，可以定位、找到。綜上所述，IP地址就不要糾結爲何要這樣寫，只要知道這個IP地址是你要用的就行。web

DNS

如今IP地址知道是什麼了，那麼怎麼得到IP地址？這個時候就須要用到DNS了，啥是DNS？？！！ sql

DNS的英文全稱是 Domain Name System，翻譯過來就是域名系統。好了，這個時候問題又來了。數據庫

域名

啥是域名？域名就是用來標識IP地址的一個標記，或者說是暱稱。「爲何不直接用IP地址？」這個問題問得好，若是咱們人不用名稱，就用身份證號，我叫你的時候就會叫「450333333333333333...」。。。我以爲這樣不是很好。。。當人們以爲使用IP地址不方便記憶後，就產生了域名地址，就像CSDN，咱們就知道是CSDN就行了，難道還要去記她的IP地址嗎？例如CSDN的地址是192.168.1.1，難不難受...之後可能你記網站名稱就在記數字了，又不方便又崩潰。好了，迴歸正題，咱們輸入了網址後，按下Enter鍵後，瀏覽器將會去DNS請求這個域名對應的IP是什麼，若是找到了，就返回一個IP地址。可能又有萌新問了，「瀏覽器會自動去找DNS？」，會是會，可是咱們也會給它一個目標，在咱們的網絡鏈接裏面，本地鏈接右鍵屬性，裏面有個IPV4，雙擊進去就能夠查看本身配置的DNS了，通常別亂改，否則很難過的，有時候瀏覽器打不開網址，就是這個緣由。

記住，網絡IP衝突可能會致使上不了網，這種狀況在學校的機房裏很常見，只要改爲自動獲取IP就ok了，會自動分配閒置的IP地址。

數據請求

當找到了IP地址，這個時候就會向該IP地址的設備去請求數據，請求數據的意思就是，這個設備或者說服務器就像一個大型的分發機構，就是送情報的一個部門，一共有65535個窗口，每一個窗口送不一樣的情報；例如咱們須要請求網站之類的數據，就經過第80個窗口請求，這個時候瀏覽器派來的小弟來到這個80號窗口，可能會排一下隊，拿到數據後，回到瀏覽器，瀏覽器把拿到的數據顯示給你看。

「渲染」

其實在這個時候，瀏覽器顯示的數據會根據一些標記，進行排版，這些標記就稱是HTML，HTML是 Hyper Text Markup Language 的縮寫，中文名是超級文本標記語言，其實說那麼深奧還不方便理解；簡單來講就是經過特定的標籤，把一段文本信息標記起來，表示這段文本信息要怎麼樣去進行顯示，或者是這個文本信息是啥東西；例如 <title>CSDN-專業IT技術社區</title>是CSDN官網首頁的標題，用了title這個標籤把文本信息標記，標記好後，瀏覽器就知道這個文本要顯示在哪裏，要怎麼進行顯示，最終瀏覽器把這一段信息顯示在了瀏覽器標題頭位置：

咱們再看看另外的一個例子：

這一段HTML語言所標記了一個博客的文本，整個標記的狀況爲了清晰的看清楚，我在這裏列出： <a href="//blog.csdn.net/" class="toolbar_to_feed" title="博客">博客</a>，標記語言HTML那一些標記並不會進行顯示，只顯示了博客這個這個文本在網頁上：

那是由於瀏覽器是經過標記語言的內容去進行顯示，標記語言的做用就是告訴瀏覽器這裏你要怎麼顯示這個內容，或者說這個內容有什麼功能。這裏是博客的一個跳轉，使用的是a標籤，a標籤是什麼？a標籤就是 <a>這裏是要顯示的文本</a>，在a標籤裏面能夠添加一些固定的操做，例如a標籤的做用是跳轉到指定的頁面，那麼這個頁面確定是有一個連接的， 那麼這個連接須要什麼來指定呢？

答案就很簡單了，使用href來指定，這個href呢就須要把要跳轉到的頁面的地址給加上，在咱們查看到的HTML代碼中是href="//blog.csdn.net/"，這就表示會跳轉到blog.csdn.net這個地址，有人點擊就會跳轉到博客了。

那 class="toolbar_to_feed" 是什麼東西？在這裏咱們能夠把它當作給定了一個樣式，給定了一個style，要怎麼樣顯示，你要顯示的樣子是什麼？可能紅色的底，綠色的字，俗話說，紅配綠。。。這個樣式的名稱就叫作 toolbar_to_feed 。在這裏並不會深刻的講解這個樣式要讓博客這個文本顯示成啥樣，你們只要經過例子知道這個html是用來告訴瀏覽器怎麼樣顯示這個文本，或者這個文本有什麼用就ok了。其實還有些動態的數據，可是在這裏並不會講解，基本的理解這樣就沒問題了。專業點的說法就是構件編排用戶界面。

前端

經過以上描述就很清楚的知道，若是咱們作web開發的話，作html相關的就是給頁面製做佈局，怎麼樣好看，甚至能夠作特效，讓頁面顯示多姿多彩；通常咱們稱作HTML這種，是爲了數據的顯示的排版工做，或者說是爲了包裝數據工做的這類職位叫作前端；不過前端是個相對概念，在web上能夠這樣理解是沒問題的，不過如今的前端，若是不去大廠，基本上要作的不止是包裝數據的排版那麼簡單，可能還會作得更多。若是咱們去作前端工做的話，還要掌握跟服務器交互的一些操做，打個比方，用戶點擊了一個按鈕，這個按鈕的功能是獲取到大家的用戶人數，這個時候你須要編寫一個邏輯，去服務器獲取到這個用戶想要的數據。不過這點只是做爲一個提醒，當真正接觸前端的話會了解的。

後端

有不少小問號的朋友可能會記得剛剛說的，前端可能要向服務器請求數據，那麼這個數據，是否是就是傳說中的後端作的？（聽沒聽事後端某問題，反正就是後端）

後端能夠理解爲一些業務邏輯的代碼編寫實現，就是須要後端，什麼是業務邏輯？簡單的舉個例子，就像你淘寶買東西，你點了這個物品，下單了，我要在代碼上怎麼實現這個下單這個背後的操做；由於下單後你還須要交易，交易要收錢，收錢你還要把這個記錄記載到你存放數據的地方，咱們能夠叫作數據庫，存進去後，用戶查看本身的下單記錄，你還須要把這個記錄取出來，用代碼實現這個取出來這個過程給用戶看到，否則沒有記錄那就很尷尬了，只收錢不賣貨！流批！因此通常是指的是數據庫（由於要存儲數據，例如你網站的用戶數據，確定要用東西來存儲，這個東西就是數據庫）進行交互以處理相應的業務邏輯。雖而後端要考慮不少東西，可是通常來講這樣舉例子就比較方便理解，就不過多的談論其它東西了。

如今整個邏輯基本上就通了，簡單的理解，後端就是實現一些數據操做，業務邏輯的實現（其實可能會運維），前端呢就是負責用戶的頁面數據的展現排版；嗯，大致這樣理解問題不大。

建站

既然理解通了，咱們就來講說一個網站搭建的流程是什麼吧！首先咱們須要租一個服務器，嗯...這個萌新不理解，那咱們降一個檔次，那就是咱們在咱們本身的本地電腦進行試驗，這樣就問題不大了，方便快捷。

搭建一個簡單企業門戶網站其實賊簡單，不吹不黑，幾年前的時候，作這個仍是挺得錢的，接接外包，舒舒服服，如今就不行了，畢竟技術在更新，過期的技術也變得更加廉價了，可是依舊是基本。

如下我使用一個靜態網站做爲例子演示一個網站的搭建；「啥是靜態網站？」。靜態網站就是沒有後端，好吧，簡單來講就是這樣，因爲後端須要一些其它語言，本篇博文針對於廣泛人羣，爲了方便理解就不用後端了，直接靜態網站做爲演示，列出html的代碼，到時候萌新們能夠直接複製代碼拿去本身試驗，舒舒服服，美滋滋。

集成環境

首先咱們下載一個集成環境。「啥是集成環境？」。

集成環境打個比方，就像你作菜、須要火源、鍋、鍋鏟，這種就是環境；我作網站也要一個環境，這個環境有人給你作好了，你直接拿過來用就好，就不須要本身搭建，有些初學者就喜歡本身搭建，而後發現一堆問題，搞着搞着發現太難就不學了，簡直嚶嚶嚶！初學者我我的建議先別增長本身的難度，先學，否則沒搞懂就上會一臉懵圈的。如今咱們下載一個叫作phpstudy的軟件，下載點這裏去官網。而後進行傻瓜式安裝。