第一天：你的第一個Flask Web應用——你好，喵星在線！

原文：http:catonlinepy.tech/
聲明：原創不易，未經許可，不得轉載

1. 你將學會什麼

通過學習第一天的內容，你將學會如何創建你的第一個flask web應用，並且在自己的電腦上運行它。這是第一天的學習內容，所有內容的代碼都將託管在github上，貓姐強烈建議各位同學在學習本課內容時，先跟着教程自己嘗試手敲代碼，遇到問題後再去查看貓姐github上的代碼，如果問題實在不知道如何解決，可以在日誌下面留言具體說明情況。

2. 運行環境準備

在開始寫代碼前，我們需要準備好flask web應用的運行環境，因此我們需要做3件事：1. 安裝python；2. 安裝虛擬開發環境；3. 安裝flask框架。下面我們詳細介紹一下這3個步驟的操作過程：

2.1 第一步：安裝python

首先是安裝Python環境，下面提供了適用於不同操作系統的python安裝包鏈接，大家根據自己的情況安裝即可：

安裝python的過程就不詳細說明，相信大家都不會有什麼問題，貓姐在這裏強烈推薦各位同學使用Linux發行版進行學習，雖然開始時可能會遇到一些操作上的問題，但是在使用Linux發行版操作系統時，你會學到更多的其它軟件開發的知識，畢竟Linux纔是專門爲軟件開發人員準備的系統。
貓姐使用的操作系統是ubuntu18.04，大家也可以使用deepin或centos等其它Linux發行版操作系統。查看python環境是否安裝成功的命令如下（打開命令行ctrl+alt+T,輸入python）：

$ python
Python 2.7.15rc1 (default, Nov 12 2018, 14:31:15) 
[GCC 7.3.0] on linux2
Type "help", "copyright", "credits" or "license" for more information.
>>>

如上我們會看到三個大於號（>>>），這表示我們已經進入python交互環境中。我們可以在python交互環境中輸入各種python語句，進行python基礎知識的學習。如果想要退出python交互環境，只需可以輸入exit()即可；在Linux或Mac OS X操作系統中，通過ctrl+d快捷鍵也可以退出python交互環境。

2.2 第二步：安裝虛擬開發環境

對於不瞭解python的同學來說，可能不知道虛擬環境是什麼東西，不用擔心！如果你能堅持學習完成後面幾天的內容，你將會對虛擬環境有更深入的理解。這裏貓姐簡單解釋一下，虛擬開發環境的主要作用是爲了將web開發項目所用的各種庫與操作系統自帶的python庫隔離開來，這樣做的好處是開發環境與系統環境隔離，環境之間不會相互影響，特別是對於多人協作的大型項目的開發，建立虛擬環境是非常有必要的。貓姐說了這麼多“廢話”，其實建立虛擬開發環境的過程很簡單，主要完成下面幾個步驟（貓姐強烈推薦同學們使用python3進行學習）：

# 安裝python3的虛擬環境包管理模塊
$ sudo apt-get install python3-venv

# 使用下面命令，創建一個虛擬開發環境
$ python3 -m venv <虛擬環境的名字>

# 激活剛纔建立的虛擬開發環境，（這裏我們創建一個名爲miao_venv的虛擬環境）
$ python3 -m venv miao_venv
$ source maio_venv/bin/activate

2.3 第三步：安裝Flask web框架

前面兩步，我們已經安裝了python開發環境、創建了虛擬開發環境，並激活了虛擬開發環境。大家需要記住，後面我們所有python包的安裝都要在虛擬開發環境中進行。如下，當我們激活虛擬開發環境後，會看到命令行前面出現一個括號，括號中的內容爲虛擬開發環境的名字：

$ python3 -m venv miao_venv
$ source miao_venv/bin/activate
(miao_venv) maojie:~/flask-course$   #注意這裏括號中的內容，表示我們已經在miao_venv的虛擬開發環境中

安裝python包的方法非常簡單，Flask作爲python的一個包，安裝起來當然也是非常簡單的，運行如下命令即可：

#使用pip install 安裝flask
(miao_venv) maojie:~/flask-course$ pip install flask

#想要退出虛擬開發環境，運行下面命令即可，注意觀察輸入命令後，命令行出現的變化
(miao_venv) maojie:~/flask-course$ deactivate

如果想驗證flask是否安裝成功，可以進入python解釋器，用import導入，如果導入沒有報錯，則安裝成功。

#注意：一定要在虛擬環境中安裝flask,然後運行python解釋器
(miao_venv) maojie:~/flask-course$ python  
>>> import flask

3. 我們的第一個Flask Web程序

萬事俱備，只欠東風。有了前面的準備工作，我們現在可以正式幹活了。由於這個教程將會是一個十多天的系列教程，所以需要創建一個目錄來管理以後每一天教程的代碼，下面大家可以跟着貓姐一起完成項目目錄的創建過程。我們首先創建一個名爲flask-plan的目錄，然後該目錄下面創建miao_venv的虛擬環境，並將其激活，最後安裝flask模塊。

#創建flask-plan目錄
maojie@Thinkpad:~$ mkdir flask-plan

#進入flask-plan目錄
maojie@Thinkpad:~$ cd flask-plan

#創建 maio_venv目錄
maojie@Thinkpad:~/flask-plan$ python3 -m venv miao_venv

#激活虛擬開發環境
maojie@Thinkpad:~/flask-plan$ source miao_venv/bin/activate
(miao_venv) maojie@Thinkpad:~/flask-plan$ 

#安裝flask模塊
(miao_venv) maojie@Thinkpad:~/flask-plan$ pip install flask

貓姐會將後面所有教程的代碼放到flask-course-primary目錄，因此下面首先創建flask-course-primary目錄，然後在該目錄下創建day1目錄，用來存放這一篇教程的所有代碼:

#創建flask-course-primary目錄
(miao_venv) maojie@Thinkpad:~/flask-plan$ mkdir flask-course-primary

#進入到flask-course-primary
(miao_venv) maojie@Thinkpad:~/flask-plan$ cd flask-course-primary/

#創建第一天的課程目錄
(miao_venv) maojie@Thinkpad:~/flask-plan/flask-course-primary$ mkdir day1

#進入到day1目錄
(miao_venv) maojie@Thinkpad:~/flask-plan/flask-course-primary$ cd day1

下面是今天這篇教程的代碼組織結構，在命令行下輸入tree命令可以直接看到。這裏，run.py文件直接存放在day1目錄下。貓姐創建了一個名爲hello的python包（當目錄下面存在__init__.py文件時，我們稱該目錄爲python的一個包）。此外，hello目錄下還有routes.py，用來存放視圖函數等代碼。

(miao_venv) maojie@Thinkpad:~/flask-plan/flask-course-primary$ tree day1/
day1/
├── hello
│   ├── __init__.py
│   └── routes.py
└── run.py

我們通過下面的命令完成hello包的創建：

(miao_venv) maojie@Thinkpad:~/flask-plan/flask-course-primary/day1$ mkdir hello
(miao_venv) maojie@Thinkpad:~/flask-plan/flask-course-primary/day1$ cd hello/
(miao_venv) maojie@Thinkpad:~/flask-plan/flask-course-primary/day1/hello/$ touch __init__.py

下面貓姐對以上文件中的代碼及用途逐個進行講解，我們首先來看一下__init__.py文件中的代碼，貓姐這裏使用的編輯器是Pycharm，大家可以根據自己的喜好選擇順手的ide進行代碼的編輯。

# 以下是__init__.py文件中的代碼，我們逐行進行解釋
from flask import Flask    # 從flask包中導入Flask類
app = Flask(__name__)      # 通過Flask類創建一個app實例
from hello import routes   # 從hello包中導入routes文件裏的所有代碼

routes.py文件的創建也是非常簡單的，如果不用在命令行中用touch命令新建文件的話，那麼可以在Pycharm中，鼠標右擊hello-New-Python File，在彈框中輸入routes.py即可。

hello/routes.py文件中的代碼如下圖所示：

# 以下是routes.py文件中的代碼，我們逐行進行解釋
from hello import app         # 從hello包中導入app實例
@app.route("/")               # 使用裝飾器對下面的視圖函數index進行裝飾
def index():
    return "你好，喵星在線！"     # 這裏返回的內容，會直接送到瀏覽器中顯示出來

# 解釋：這裏裝飾器的實際作用就是將路由與視圖函數綁定起來，當用戶在瀏覽器中輸入/路由請求時，就會對應的執行下面的index函數

最後是day1目錄下run.py文件中的代碼：

from hello import app         # 從hello包中導入app實例

if __name__ == "__main__":    
    app.run()                 # app實例調用自己的run函數

現在，這樣一個簡單的Flask Web應用程序就完成了。如果要使用flask run命令，我們需要進入run.py所在目錄。在運行之前，需要通過設置FLASK__APP環境變量來告訴Flask，具體的app實例在哪一個python文件中。

# 設置FLASK_APP環境變量，運用flask run命令時可以找到app實例在run.py文件中
(miao_venv) maojie@Thinkpad:~/flask-plan/flask-course-primary/day1$ export FLASK_APP=run.py

# 使用flask run命令將程序運行起來 
(miao_venv) maojie@Thinkpad:~/flask-plan/flask-course-primary/day1$ flask run
 * Serving Flask app "run.py"
 * Environment: production
   WARNING: Do not use the development server in a production environment.
   Use a production WSGI server instead.
 * Debug mode: off
 * Running on http://127.0.0.1:5000/ (Press CTRL+C to quit)  # 如果看到這裏正常顯示，則web應用已經運行起來了

(flask_venv) meyou@meyou-ThinkPad-W520:~/flask_learing/flask-tutorial-for-newbies/day1$ python run.py
 * Serving Flask app "hello" (lazy loading)
 * Environment: production
   WARNING: Do not use the development server in a production environment.
   Use a production WSGI server instead.
 * Debug mode: off
 * Running on http://127.0.0.1:5000/ (Press CTRL+C to quit) # 如果看到這裏正常顯示，則web應用已經運行起來了

最後我們在地址欄中輸入 http://127.0.0.1:5000/ 或是http://localhost:5000/就可以看到下圖所示的效果了。

這樣，一個簡單的Flask Web應用程序就完成了。最後還有一點值得提醒的是，在終端會話中設置的環境變量不會永久生效，所以每次在重新新開一個終端時，就需要重新導入FLASK_APP環境變量，這樣非常麻煩。所以Flask從1.0版本起，就可以通過配置.flaskenv文件直接導入FLASK_APP環境變量，省去每次重啓系統後導入環境變量的麻煩。爲了使用dotenv工具，我們需要安裝dotenv包，直接使用下面的pip命令安裝即可：

(miao_venv) maojie@Thinkpad:~/flask-plan/flask-course-primary/day1$ pip install python-dotenv

安裝完成後，我們需要在day1目錄下新建一個名爲.flaskenv的文件，裏面寫入如下內容：

FLASK_APP=run.py

通過此項設置，當我們運行flask run時，FLASK_APP就會自動加載，而不需要手動導入環境變量。

4. 總結

學習完第一天的教程，我們掌握瞭如下技能：

如何創建虛擬開發環境
如何進入及退出虛開發擬環境
如何在虛擬開發環境中安裝python包
如何組織並完成一個最簡單的Flask應用
如何運行我們的Flask web應用程序

第二天的內容，我們將會帶領大家一起了解什麼是業務邏輯和響應邏輯的分離，爲什麼在Flask應用中需要使用模板（templates)，第一天的內容就到這裏，喜歡的同學們可以在下面點贊留言，或是訪問我的博客地址：http://catonlinepy.tech/加入我們的QQ羣進一步交流學習！

5. 代碼的獲取

大家可以到這個網址去獲取今天教程中的所有代碼：https://github.com/miaojie19/...

具體下載代碼的命令如下：

# 使用git命令下載flask-course-primary倉庫所有的代碼
git clone https://github.com/miaojie19/flask-course-primary.git

# 下載完成後，進入day1目錄下面，即可看到今天的代碼
cd flask-course-primary
cd day1

第一天：你的第一個Flask Web應用——你好，喵星在線！

1. 你將學會什麼

2. 運行環境準備

2.1 第一步：安裝python

2.2 第二步：安裝虛擬開發環境

2.3 第三步：安裝Flask web框架

3. 我們的第一個Flask Web程序

4. 總結

5. 代碼的獲取

再談23種設計模式（3）：行爲型模式（學習筆記）

Power Automate Desktop 安裝完，登錄後老是提示one driver 錯誤

微前端學習筆記(4):從微前端到微模塊之EMP與hel-micro方案探索

微前端學習筆記（1）：微前端總體架構概述，從微服務發微

985 碩士程序員，空窗 4 個月沒有 Offer！

一文搞懂 Spring 循環依賴

賽博鬥地主——使用大語言模型扮演Agent智能體玩牌類遊戲。

VScode右鍵打開(添加到右鍵)

記一次 .NET某工控視覺自動化系統卡死分析

WindowsServer--SQL Server搭建主從同步實現讀寫分離 - 事務性分發

第6天：在Flask應用中添加個人主頁

第5天下篇：在Flask應用中使用用戶認證—Flask_Login

第5天上篇：在Flask應用中使用用戶認證—Flask_Login

第4天：在Flask應用中使用數據庫—Flask_SQLAlchemy

喵星在線-Flask博客上線佈署過程

Mac下配置sublime實現LaTeX

https://yachay.unat.edu.pe/blog/index.php?comment_area=format_blog&comment_component=blog&comment_co

linux以太網驅動總結