01.【使用Python Flask框架快速建置網站】第1步安裝Flask,包含所需工具及流程說明

更新 發佈閱讀 3 分鐘



【建置環境說明】

開發環境是win11,python是3.10.7版本,編碼的工具是Visual Studio Code(簡稱vscode)

【本篇說明】

1.架設網站所需具備工具:

1.前端部分,可使用 HTML(網頁) + CSS(美化,視需要) + Javascript(與API溝通,視需要),負責呈現使用者介面。

說明:

HTML 負責網頁的內容和結構,而CSS 負責網頁的外觀和樣式,能控制網頁的字體、顏色、間距、佈局等,能讓 HTML網頁更加豐富,並且與 HTML分開編寫,網頁維護能更加方便。

Javascript是透過在 HTML文件中使用<script>元素來執行網頁的互動,大都用在於與後端API溝通行為。

2.後端部分,可使用 Python Flask 或是 FastAPI,來處理核心邏輯。

說明:

Flask,是一個輕量型的Web應用框架,屬於一種函式庫(模組),以 Python語言來做為開發使用,主要能提供路由、樣板等功能,只需要簡單的幾行程式碼,就能輕鬆、快速架構一個簡易網站。

至於 FastAPI,也是一個 Python網路框架,可快速建立API及自動生成API文件,其實個人覺得有點類似Flask,本篇以 Flask來分享。

2.架設網頁流程說明:

1.安裝Flask

2.建立後端伺服器(例如server.py)

3.建立前端HTML網頁

4.本機測試

5.部署到雲端


raw-image

3.步驟1:安裝Flask

前提先安裝Python,參考這篇:【安裝vscode、python】編輯環境快速建置,開始機器語言入門

打開終端機(即命令提示字元 CMD 或 PowerShell),輸入:

pip install flask


raw-image

▲說明:出現以上內容就代表安裝完成!

【本篇小結】

步驟1:安裝Flask,完成!接下來就進入步驟2:建立後端server。

【本篇結束】

在自學路上難免遇到困難,只要堅持到底,相信就會有所成果,期勉大家一同努力。


留言
avatar-img
艾肯比工程師
3會員
74內容數
主要分享應用程式開發過程、遭遇困難及解決技巧,提供給自學或獨立開發者做為參考,希望能對您們有所幫助。
你可能也想看
Thumbnail
在 vocus 與你一起探索內容、發掘靈感的路上,我們又將啟動新的冒險——vocus App 正式推出! 現在起,你可以在 iOS App Store 下載全新上架的 vocus App。 無論是在通勤路上、日常空檔,或一天結束後的放鬆時刻,都能自在沈浸在內容宇宙中。
Thumbnail
在 vocus 與你一起探索內容、發掘靈感的路上,我們又將啟動新的冒險——vocus App 正式推出! 現在起,你可以在 iOS App Store 下載全新上架的 vocus App。 無論是在通勤路上、日常空檔,或一天結束後的放鬆時刻,都能自在沈浸在內容宇宙中。
Thumbnail
vocus 慶祝推出 App,舉辦 2026 全站慶。推出精選內容與數位商品折扣,訂單免費與紅包抽獎、新註冊會員專屬活動、Boba Boost 贊助抽紅包,以及全站徵文,並邀請你一起來回顧過去的一年, vocus 與創作者共同留下了哪些精彩創作。
Thumbnail
vocus 慶祝推出 App,舉辦 2026 全站慶。推出精選內容與數位商品折扣,訂單免費與紅包抽獎、新註冊會員專屬活動、Boba Boost 贊助抽紅包,以及全站徵文,並邀請你一起來回顧過去的一年, vocus 與創作者共同留下了哪些精彩創作。
Thumbnail
打開 jupyter notebook 寫一段 python 程式,可以完成五花八門的工作,這是玩程式最簡便的方式,其中可以獲得很多快樂,在現今這種資訊發達的時代,幾乎沒有門檻,只要願意,人人可享用。 下一步,希望程式可以隨時待命聽我吩咐,不想每次都要開電腦,啟動開發環境,只為完成一個重複性高
Thumbnail
打開 jupyter notebook 寫一段 python 程式,可以完成五花八門的工作,這是玩程式最簡便的方式,其中可以獲得很多快樂,在現今這種資訊發達的時代,幾乎沒有門檻,只要願意,人人可享用。 下一步,希望程式可以隨時待命聽我吩咐,不想每次都要開電腦,啟動開發環境,只為完成一個重複性高
Thumbnail
在離線環境需要安裝Python套件時就相當的麻煩,需要先下載好套件包,在打指令安裝,若套件數量一多時就會相當麻煩。 本文將介紹如何利用兩行指令快速的安裝整個資料夾的套件。
Thumbnail
在離線環境需要安裝Python套件時就相當的麻煩,需要先下載好套件包,在打指令安裝,若套件數量一多時就會相當麻煩。 本文將介紹如何利用兩行指令快速的安裝整個資料夾的套件。
Thumbnail
本章節旨在介紹如何在不同操作系統上安裝和配置PHP環境,並使用命令行工具進行基礎操作。此外,還介紹了使用Visual Studio Code進行PHP開發的步驟,包括安裝擴展和設置調試環境。
Thumbnail
本章節旨在介紹如何在不同操作系統上安裝和配置PHP環境,並使用命令行工具進行基礎操作。此外,還介紹了使用Visual Studio Code進行PHP開發的步驟,包括安裝擴展和設置調試環境。
Thumbnail
你好,在下最近在學習開發web,學了html css js,也得出一些心得,由於網路上已有許多教學,所以我會著重在如何開發出to do List,以及解釋我寫的程式碼。相關的教學我會直接貼網址。如果我有什麼地方出錯,或者是可以寫得更好,歡迎在下方留言,討論。 首先先介紹我的開發環境: 我用了vs
Thumbnail
你好,在下最近在學習開發web,學了html css js,也得出一些心得,由於網路上已有許多教學,所以我會著重在如何開發出to do List,以及解釋我寫的程式碼。相關的教學我會直接貼網址。如果我有什麼地方出錯,或者是可以寫得更好,歡迎在下方留言,討論。 首先先介紹我的開發環境: 我用了vs
Thumbnail
接續上一篇 Step2:VC#專案建立 Step3:IIS新建站台 Step4:VC#架設到IIS中
Thumbnail
接續上一篇 Step2:VC#專案建立 Step3:IIS新建站台 Step4:VC#架設到IIS中
Thumbnail
本章目的是為讀者提供有關如何設置JavaScript開發環境的知識,包括在瀏覽器、Node.js和各種編輯器和IDE中編寫和運行JavaScript的信息。此外,本章還介紹了如何架設本地開發伺服器以模擬實際的網頁環境。這些知識對於希望開發前端應用或後端服務的JavaScript開發者來說都是必要的。
Thumbnail
本章目的是為讀者提供有關如何設置JavaScript開發環境的知識,包括在瀏覽器、Node.js和各種編輯器和IDE中編寫和運行JavaScript的信息。此外,本章還介紹了如何架設本地開發伺服器以模擬實際的網頁環境。這些知識對於希望開發前端應用或後端服務的JavaScript開發者來說都是必要的。
Thumbnail
什麼是Python python是電腦程式語言的一種,如同python官方網站上的介紹 "Python是一種程式語,可讓你更快速地工作並更有效的整合系統"。簡單地說,就是你可用python這個程式語言去告訴電腦你想要作什麼,讓電腦來幫你完成你要作的事情。
Thumbnail
什麼是Python python是電腦程式語言的一種,如同python官方網站上的介紹 "Python是一種程式語,可讓你更快速地工作並更有效的整合系統"。簡單地說,就是你可用python這個程式語言去告訴電腦你想要作什麼,讓電腦來幫你完成你要作的事情。
Thumbnail
當我們在撰寫一套系統的時候, 總是會提供一個介面讓使用者來觸發功能模組並回傳使用者所需的請求, 而傳統的安裝包模式總是太侷限, 需要個別主機獨立安裝, 相當繁瑣, 但隨著時代的演進與互聯網的崛起, 大部分的工作都可以藉由網頁端、裝置端來觸發, 而伺服端則是負責接收指令、運算與回傳結果, 雲端
Thumbnail
當我們在撰寫一套系統的時候, 總是會提供一個介面讓使用者來觸發功能模組並回傳使用者所需的請求, 而傳統的安裝包模式總是太侷限, 需要個別主機獨立安裝, 相當繁瑣, 但隨著時代的演進與互聯網的崛起, 大部分的工作都可以藉由網頁端、裝置端來觸發, 而伺服端則是負責接收指令、運算與回傳結果, 雲端
Thumbnail
本文將介紹如何從頭開始建立一個Django專案,包括安裝和設定,以及創建管理員帳戶和新的app。透過本文,你可以學習到建立自己的網頁的所有步驟和設定。
Thumbnail
本文將介紹如何從頭開始建立一個Django專案,包括安裝和設定,以及創建管理員帳戶和新的app。透過本文,你可以學習到建立自己的網頁的所有步驟和設定。
追蹤感興趣的內容從 Google News 追蹤更多 vocus 的最新精選內容追蹤 Google News