炸了！沒有任何HTML/CSS ! 純Python打造一個(gè)網(wǎng)站！

時(shí)間：2023-08-04 03:57:01 | 來源：網(wǎng)站運(yùn)營

時(shí)間：2023-08-04 03:57:01 來源：網(wǎng)站運(yùn)營

炸了！沒有任何HTML/CSS ! 純Python打造一個(gè)網(wǎng)站?。涸瓌?chuàng) ： 菜鳥哥

---

如果想用Python做網(wǎng)站，在Python世界里面有2大非常有名的框架，一個(gè)是Django一個(gè)是Flask 。但是做網(wǎng)站肯定需要前端的三家馬車HTML/CSS/JS 。如果我只想想做一個(gè)簡單的網(wǎng)站，學(xué)習(xí)的成本有點(diǎn)高。今天給大家推薦一個(gè)神器 Anvil 框架，可以不用一行非Python代碼，分分鐘幫助你打造一個(gè)純用 Python 做的全棧 Web 應(yīng)用程序！厲害吧，我們一起來看一下。

01.創(chuàng)建賬戶

不同于Flask的框架，Anvil 框架并不需要通過pip等方式進(jìn)行安裝。
大家只需要前往Anvil的官網(wǎng)，創(chuàng)建賬戶，官網(wǎng)地址為：https://anvil.works/。





02.創(chuàng)建項(xiàng)目

當(dāng)我們注冊(cè)，有了自己的賬戶后，接下來就可以創(chuàng)建一個(gè)項(xiàng)目了。
首先，點(diǎn)擊創(chuàng)建一個(gè)空白項(xiàng)目：



然后在彈出的主題選擇窗口中選擇Material Design主題。




Material design主題是2014年由谷歌公司創(chuàng)建，并應(yīng)用于許多最流行的應(yīng)用程序，包含了郵件，日歷等組件。
在頁面設(shè)計(jì)時(shí)，我們不需要去創(chuàng)建美觀的頁面組件，可以利用Anvil提供的組件來創(chuàng)建美觀的界面。

03.搭建界面

創(chuàng)建應(yīng)用程序后，Anvil 會(huì)轉(zhuǎn)到頁面的設(shè)計(jì)界面中：



如上圖所示。頁面設(shè)計(jì)可以通過拖放組件的方式完成。我們通過拖放輸入字段、按鈕和輸出標(biāo)簽這三個(gè)組件，實(shí)現(xiàn)一個(gè)簡單的頁面功能。對(duì)于組件的拖放，可以按照下圖的方式進(jìn)行操作。




組件拖放完成后，界面如下圖所示：





04.前端邏輯

組件搭建完成后，接下來我們來實(shí)現(xiàn)頁面的邏輯。
我們想實(shí)現(xiàn)的功能是：向text框中輸入文本，通過點(diǎn)擊button按鈕，來顯示在label組件中。
所以BUTTON_3按鈕成為了頁面的控制關(guān)鍵，通過雙擊BUTTON_3按鈕，可以來到BUTTON_3按鈕的程序界面下。




在這里我們可以編寫B(tài)UTTON_3按鈕的邏輯代碼。
按照想要實(shí)現(xiàn)的目的，邏輯代碼如下圖所示。



程序中，”self.label_1"和“self.text_aera_1"分別表示的就是label和text兩個(gè)控件。

05.運(yùn)行Web APP

完成界面設(shè)計(jì)以及邏輯代碼編寫后，就可以運(yùn)行APP來查看效果了。
程序的運(yùn)行以及效果展示如下：
播放


上面只是一個(gè)簡單的演示，里面可以創(chuàng)建很多復(fù)雜的交互功能。

06.Web APP部署

功能測試完畢后，接下來就可以選擇APP的部署了。停止測試，回到設(shè)計(jì)界面后，點(diǎn)擊設(shè)置下的publish app的選項(xiàng)。




界面會(huì)彈出選項(xiàng)提示，提示用戶是設(shè)置為私密鏈接或者是公開的鏈接。




大家只需要點(diǎn)擊鏈接后，就可以使用自己開發(fā)的Web APP了。

07.總結(jié)

以上就是利用Anvil進(jìn)行100% Python 的Web 應(yīng)用程序創(chuàng)建過程。
Anvil還有很多其他的功能，大家可以繼續(xù)來探索，喜歡利用python進(jìn)行web開發(fā)的小伙伴們，可以盡快動(dòng)手嘗試一下~


網(wǎng)站地址：https://anvil.works/

---