Django----做一個簡單網頁的教程(適合初學者)
以下都是講在windows上的部署情況;
準備:
1、python3.6
2、pycharm profession(專業版)
3、安裝Django模塊
以上的安裝就不講了,比較簡單,網上也有很多教程。都去官網下載安裝即可。
前言:
學習django框架其實就是學習它的文件目錄,目錄下有一些必須的模塊和包,當然你也可以自己在這些目錄下再新建目錄或模塊和包。
**一、我們打開pycharm新建一個Django工程(也可以直接在terminal下用指令django-admin startproject xxx創建)
File---New Project**
建好好會自動生成一個目錄框架。那麽來了解下這個框架裏文件的作用。
二、編寫業務邏輯
新建成功工程後views.py文件裏是空的,需要自己編寫業務邏輯。
from django.shortcuts import HttpResponse #導入HttpResponse模塊
def index(request):#request是必須帶的實例。類似class下方法必須帶self一樣
return HttpResponse("Hello World!!")#通過HttpResponse模塊直接返回字符串到前端頁面
三、配置url路由
from laomomo import views#導入views模塊 from django.conf.urls import url urlpatterns=[ url(r‘^index/‘,views.index)#配置當訪問index/時去調用views下的index方法 ]
四、運行server並訪問
terminal下執行 python manage.py runserver 這樣執行默認的路徑是127.0.0.1:8080
指定端口或地址就再後面寫上,如:python manage.py runserver 127.0.0.1:8888
然後瀏覽器訪問http://127.0.0.1:8888
這裏的Hello World!!就是views.py文件下index方法通過HttpResponse返回到前端的。
問題來了,這樣感覺有點簡單,如果要顯示一些數據呢?怎麽辦?那麽我們就需要寫html文件來承載。
五、修改views.py裏的index方法如下
from django.shortcuts import render#導入render模塊 #先定義一個數據列表,當然後面熟了可以從數據庫裏取出來 list = [{"name":‘good‘,‘password‘:‘python‘},{‘name‘:‘learning‘,‘password‘:‘django‘}] def index(request): return render(request,‘index.html‘,{‘form‘:list})#通過render模塊把index.html這個文件返回到前端,並且返回給了前端一個變量form,在寫html時可以調用這個form來展示list裏的內容
六、編輯html文件
新建成功工程後templates文件目錄下是空的,我們需要在該目錄下新建一個html文件來把內容展示到前端
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>test</title>
</head>
<body>
<table border="1">
<thead>
<tr>
<td>用戶名</td>
<td>密碼</td>
</tr>
</thead>
{%for line in form%}
<tr>
<td>{{line.name}}</td>
<td>{{line.password}}</td>
</tr>
{% endfor %}
</table>
</body>
</html>
html裏要寫if或for等語句時用{%%},調用變量時用{{ }}括號
我們重新運行下server,訪問瀏覽器應該會展示list裏的數據了。
好,到這裏我們可以展示後臺設定好的數據給前端。這好像也不太友好。我們來做一個前端可以輸入用戶名和密碼,然後把輸入的用戶和密碼展示出來。
七、重新編寫html文件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>test</title>
</head>
<body>
<table border="1">
<form action="/index/" method="post">
{% csrf_token %}
<P>
<label >用戶名:</label>
<input type="text" name =‘name‘/>
</P>
<P>
<label>密碼:</label>
<input type="text" name=‘password‘/>
</P>
<p><input type="submit" value="提交"/></p>
</form>
<thead>
<tr>
<td>用戶名</td>
<td>密碼</td>
</tr>
</thead>
{%for line in form%}
<tr>
<td>{{line.name}}</td>
<td>{{line.password}}</td>
</tr>
{% endfor %}
</table>
</body>
</html>
這裏加入了用戶名和密碼的輸入框和一個提交按鈕,設置的方法試post,下面我們就需要編寫views.py下的index方法來獲取這個post過來的數據,然後返回給前端顯示。
八、修改views.py下的index方法:
from django.shortcuts import render#導入render模塊
#先定義一個數據列表,當然後面熟了可以從數據庫裏取出來
list = [{"name":‘good‘,‘password‘:‘python‘},{‘name‘:‘learning‘,‘password‘:‘django‘}]
def index(request):
#獲取前端post過來的用戶名和密碼
name = request.POST.get(‘name‘,None)
password = request.POST.get(‘password‘,None)
#把用戶和密碼組裝成字典
data = {‘name‘:name,‘password‘:password}
list.append(data)
return render(request,‘index.html‘,{‘form‘:list})#通過render模塊把index.html這個文件返回到前端,並且返回給了前端一個變量form,在寫html時可以調用這個form來展示list裏的內容
再次運行server通過瀏覽器訪問就會有提交的數據實時展示了的效果了
到這裏就完成了一個簡單的網頁制作的過程,有問題可以向我提問。
Django----做一個簡單網頁的教程(適合初學者)