Python 是當今 Web 開發中最流行的程式設計語言之一。憑借其簡潔的文法和廣泛的庫，它已成為建構 Web 應用程式的首選語言。Pynecone 是一個用于建構和部署 Web 應用程式的全棧 Python 架構。這使得使用 Python 建構和部署 Web 應用程式的過程變得更加容易。
Pynecone 是一個新的 Python Web 架構，涵蓋了：前端、後端和部署。該架構的網址 https://pynecone.io/：
本教程是對 Pynecone 的介紹。您将學習該架構的一些基礎知識，并且我們将運作一個實用的示例 Web 項目。
安裝
為了能夠在您的開發系統上安裝 Pynecone，您需要確定滿足兩個先決條件：
- 必須在您的系統上安裝 Python 3.7+
- 必須在您的系統上安裝 Node.js 12.22.0+
然後，您可以使用 pip 指令按以下方式安裝 Pynecone：
$ pip install pynecone 建立您的第一個 Pynecone 項目
讓我們用 Pynecone 建立第一個項目。是以，您首先需要建立一個新的空項目檔案夾，切換到該新檔案夾并使用pc指令初始化一個新的 Pynecone 項目：
$ mkdir pynecode01
$ cd pynecode01
$ pc init 然後，您應該會看到 Pynecode 的輸出，如以下螢幕截圖所示：
項目設定成功。
運作 Web Server
Pynecone 項目已成功建立，我們已準備好啟動開發 Web 伺服器，以便能夠在浏覽器中檢視預設 Pynecone 項目的輸出。使用以下指令啟動并運作開發 Web 伺服器：
$ pc run 然後您應該在指令行上看到以下輸出：
在這裡你可以看到 Web 伺服器在端口 3000 上啟動，是以你可以通過在浏覽器中通路http://localhost:3000 來通路項目的輸出。可以在以下螢幕截圖中看到預設輸出：
Pynecone 的開發網絡伺服器帶有實時重新加載功能。是以，每次您更改實作時，浏覽器中的輸出都會自動更新，無需手動觸發網站重新加載。
項目結構
讓我們更深入地研究一下預設建立的項目結構：
- .web檔案夾包含 Pynecone 項目的編譯輸出。生成的輸出是位于該檔案夾内的 Next.js。
- assets檔案夾用于存儲項目中使用的任何靜态資源（圖像、字型、其他靜态檔案等）。
- 此外，還有一個帶有項目名稱 (pynecode01) 的子檔案夾。這是項目的主檔案夾，将在其中執行 Pynecode Web 應用程式。預設情況下，此檔案夾包含一個同名檔案 (pynecode01.py)。
建構示例應用程式
讓我們從建構一個完整的 Pynecone 示例待辦事項應用程式開始。首先删除 pynecode01.py 中的完整預設代碼，然後在檔案頂部添加以下導入語句：
import pynecone as pc 這使我們可以通路 pynecone 架構。
接下來，我們開始指定應用程式的狀态。應用程式的狀态是定義應用程式中所有可以更改的變量以及可以修改它們的所有函數的地方。我們這樣做是為了實作一個繼承自 pc.State 的 State 類：
class State(pc.State):
items = ["Learn Python", "Learn Pynecone", "Have Fun"]
new_item: str
def add_item(self):
self.items += [self.new_item]
self.new_item = ""
def finish_item(self, item):
self.items = [i for i in self.items if i != item] 該類有一個類屬性項，它是包含三個項的字元串清單。此外，還有一個字元串類型的執行個體屬性new_item 。
State 類有兩個執行個體方法——add_item和finish_item。add_item方法将new_item執行個體屬性的值附加到項目清單，然後将 new_item 設定為空字元串。此方法有效地将新項目添加到項目清單中。
finish_item方法從項目清單中删除指定的項目。此方法用來建立一個新清單，其中包含原始清單中除與參數比對的項目之外的所有項目。
讓我們進一步添加一個函數，它能夠生成 UI 的一部分，一個清單待辦事項：
def render_item(item):
return pc.list_item(
pc.hstack(
pc.text(item, font_size="1.5em"),
pc.button(
"X",
color_scheme="red",
size="sm",
on_click=lambda: State.finish_item(item),
),
justify_content="space-between",
)
) 清單項輸出是使用 Pynecone 的一些元件生成的，例如list_item、hstack、text和button。項目本身通過項目參數傳遞給該函數，是以文本元件可用于輸出項目文本。
我們将在todo_list函數中實作的下一個函數。此函數生成 UI 的其餘部分，除此之外，它還利用之前實作的render_item函數輸出單個待辦事項：
def todo_list():
return pc.container(
pc.vstack(
pc.heading("Todos"),
pc.input(
on_blur=State.set_new_item,
placeholder="Add a todo...",
bg="white",
),
pc.button("Add", on_click=State.add_item, bg="green", color="white"),
pc.divider(),
pc.ordered_list(
pc.foreach(State.items, lambda item: render_item(item)),
),
bg="#ededed",
margin="5em",
padding="1em",
border_radius="0.5em",
shadow="lg",
)
) 應用程式 UI 是通過使用容器元件作為頂部 UI 元素來建構的。在這個容器元件中，一個vstack布局元件用于垂直堆疊項目。
在這個布局元件中，我們使用了更多的 Pynecone UI 元件，如heading、button、divider和ordered_list。
最後我們需要添加建立應用程式執行個體所需的三行代碼，添加路由并最終通過調用app.compile() 啟動 Pynecone 網絡應用程式的編譯：
app = pc.App(state=State)
app.add_page(todo_list, path="/")
app.compile() 讓我們再次在浏覽器中檢查結果：
預設情況下，待辦事項清單已經包含三個待辦事項。您可以使用文本輸入字段為新的待辦事項輸入文本：
為了建立新的待辦事項，您隻需單擊“添加”按鈕即可。新的待辦事項立即添加到待辦事項清單中：
紅色按鈕可用于從清單中删除單個待辦事項。例如，按下清單中最後一個元素的紅色按鈕，您可以看到該項目立即從清單中删除：
結論
Pynecone 為使用 Python 建構和部署 Web 應用程式提供了完整的解決方案，使該過程比以往任何時候都更容易。憑借其廣泛的庫和簡潔的文法，Python 是一種流行的 Web 開發語言，而 Pynecone 通過提供全棧架構将其提升到一個新的水準。從前端到後端再到部署，Pynecone 擁有您輕松建構和啟動 Web 應用程式所需的一切。無論您是初學者還是經驗豐富的開發人員，Pynecone 都提供了一種簡單高效的方式來将您的 Web 應用程式創意變為現實。是以，如果您想在 Web 開發中利用 Python 的強大功能和簡單性，請嘗試使用 Pynecone，看看建構和部署您的 Web 應用程式是多麼容易。