5 分鐘，從 0 到 1 上線我的網站！

用最簡單的方式，帶你上線本身的網站！

你們好，我是魚皮。

相信每位學編程的同窗都想要擁有一個本身的網站，好比我的博客，能夠拿來記錄本身的學習過程、分享本身的文章、展現做品等，從而激勵本身持續學習和總結。

那麼今天這篇文章，目標很簡單，我要用 新技術 帶 全部同窗 從 0 到 1 快速上線一個本身的網站！

給我 5 分鐘，我給你全世界。

上線網站極簡教程

讓咱們先來了解下傳統的上線網站流程。

傳統方式

假如咱們要上線我的博客網站，供其餘同窗訪問，那麼須要經歷以下步驟：

1. 準備一份我的博客網站的源代碼
2. 購買一臺有公網 IP 的服務器
3. 把網站文件放到服務器上，並安裝 web 服務器軟件提供網頁訪問能力
4. 購買一個域名
5. 配置 DNS 解析，把域名指向服務器的 IP 地址
6. 若是要提升網站訪問速度，自行購買 CDN

流程圖以下：

聽起來就以爲麻煩，並且這一套流程下來最少也要 1 個小時。這也是爲啥不少同窗只是有上線我的網站的想法，卻從未實現。

可是，昨天我卻只用 5 分鐘，就上線了本身的網站，怎麼作到的呢？

下面引出今天的主角 Webify 。

Webify

Webify 是騰訊雲提供的 一站式 Web 應用託管服務，幫助你們極速開發、部署、上線網站項目。

什麼是一站式呢？

就是一條龍服務，只要你有一套網頁代碼，不管是靜態、動態網站仍是其餘類型的 web 應用，都能使用 Webify 傻瓜式部署。由它提供服務器、默認域名、自定義域名、HTTPS、CDN 加速，提高 Web 應用的性能和安全性。

換言之，若是使用 Webify 上線我的博客，你只須要：

1. 準備一份我的博客網站的源代碼
2. 進入 Webify 控制檯，選擇源碼和配置
3. 一鍵發佈

流程大大精簡了！

此外，Webify 還提供基於 Git 工做流的 DevOps 流程，每次修改代碼都能自動從新構建部署，不用再登陸服務器本身操做了！

聽起來挺爽，下面咱們一塊兒試着用 Webify 上線我的博客。

Webify 實戰

地址：https://cloud.tencent.com/product/webify

首先進入 Web 應用託管平臺，新建一個應用。

一個應用對應一個網站項目，這裏提供兩種新建應用的方式：Git 導入和從模板建立。

Git 導入建立應用

Git 導入適用於已有網站源代碼的方式，只要你的代碼存在於 Git 託管平臺，就能直接在 Webify 導入。

好比咱們想要上線我的博客，先要有一套博客源代碼。能夠本身寫代碼；也能夠直接使用一些現成的站點生成器，好比 Hugo、Hexo 等（後面詳細介紹），自動生成源代碼；固然還能夠下載、克隆別人的項目代碼。搞到代碼後，把它上傳到 GitHub 或 Gitee 等代碼託管平臺就能夠被 Webify 導入了。

導入以後須要根據應用的技術棧和類型，填寫構建命令等配置。這裏能夠直接選擇預設配置，好比你的項目用到了 Vue.js，能夠直接選擇對應的預設，不用填寫就能自動配置：

從模板建立應用

若是咱們啥代碼都沒有，也搞不來代碼，咋辦？

也沒有關係，Webify 內置了一些項目模板，直接選擇須要的應用建立便可。好比咱們要作我的博客，能夠選擇 Docusaurus 2 這款主流的站點生成器：

選中模板後，系統會自動把代碼模板複製到新的 Git 倉庫，和應用關聯。

Webify 會自動給 Git 倉庫配置 Webhooks，後續每當倉庫的代碼發生變動（push）時，都會自動觸發應用的從新部署，無需再跑到服務器上改代碼了！

點擊下一步，進入應用配置，因爲咱們使用的是系統預設模板，什麼都不用改，用默認配置就好了。

點擊部署按鈕，稍等幾分鐘，應用就建立成功了！

應用詳情

能夠在應用列表和部署記錄中查看到新建完成的應用：

點擊新建的應用，進入應用詳情頁：

能夠查看到應用的詳細信息，好比系統爲咱們提供的默認項目域名，點擊以後就能訪問到已上線的博客網站啦！

應用詳情中還有一個所屬環境信息，那是啥呢？

其實在部署過程當中，系統會自動建立一個 雲開發 環境，根據配置的命令自動構建項目，將構建產物放到 靜態網站託管 上。

能夠在雲開發控制檯看到已經上傳到服務器上的文件：

在靜態網站託管頁面，能夠修改已上傳的文件，修改 CDN 緩存設置等：

想要了解什麼是雲開發？歡迎閱讀我以前的文章：我和雲開發 。

進入應用詳情的設置頁，能夠給項目添加自定義域名、修改應用構建配置、刪除應用等：

持續發佈

下面讓咱們給本身的博客網站添加一篇文章，進入到應用對應的 Git 倉庫，在 docs/tutorial-basics 路徑下新建一個 .md 後綴文件，輸入博客標題和內容。

點擊 commit 按鈕，本次代碼改動將自動 push 到主分支：

固然，更好的方式是把代碼倉庫拉取到本地，在本地修改後再 push 到遠程。能夠先 push 到 dev 分支，確認代碼沒問題後再合併到 master 分支。

代碼 push 以後，事件會經過 Webhooks 傳遞給 Webify，自動觸發從新部署，等一段時間後就能夠看到新的部署記錄：

再次訪問網站地址，就可以看到新增的博客啦！

若是沒有當即看到更新，多是因爲 CDN 的緩存（默認 2 分鐘），致使沒有拉取到最新的資源，等個幾分鐘就行了。

OK，從 0 到 1 上線網站成就達成。後面你們能夠參考 Docusaurus 站點生成器的官方文檔，更改代碼和配置，進一步定製本身的博客。

使用感覺

其實這個東西並不算新技術了，產品形態和體驗上相似 Vercel 和 Github Pages。不過優勢是 Webify 在國內，提供了高速 CDN；還可以和其餘雲產品打通、造成體系。

使用 Webify 上線網站仍是很爽的，整個流程很是簡單、易上手，着實省去了不少本身上線網站的瑣碎流程。不管是對想快速上線本身網站的同窗、仍是 web 開發愛好者，都是不錯的選擇。

還有重要的一點要提醒你們，世上沒有免費的午飯，Webify 依託於雲開發，也是要收費的（提供 1 個月的免費體驗），但相對於本身購買服務器（即便是學生機），性價比也是更高的。

---

最後，我還在小破站發佈了 webify 視頻教程，演示了另外一個博客系統的上線。

指路：https://www.bilibili.com/video/BV11V411p7vf/

我是魚皮，歡迎閱讀 我從 0 自學進入騰訊的編程學習、實習、求職、考證、寫書經歷，再也不迷茫！

我學計算機的四年，共勉！

點贊 仍是要求一下的，祝你們都能心想事成、發大財、行大運。