項目結(jié)構(gòu):
功能集合
-
主頁顯示用戶的照片,姓名,github鏈接,點擊訪問颈娜,跳轉(zhuǎn)到用戶的github主頁。
GHR(8LN~BJMN~_O9SQ3SKKO.png -
輸入github的用戶名浙宜,點擊搜索按鈕官辽。頁面立即跳轉(zhuǎn)到該用戶的詳情頁。展示該用戶的姓名粟瞬,公司同仆,博客地址,點擊博客地址跳轉(zhuǎn)到用戶個人博客裙品。
4$W@H3W22C~PPY@R7I}N4@D.png -
主頁點擊查詢按鈕俗批,頁面跳轉(zhuǎn)到用戶列表頁,展示所有搜索過的用戶信息市怎。
@{@1US(41`5AQ2_)```1)`W.png
Django是一個python開源框架岁忘。
MVC 模型
MVC 模式(Model–view–controller)是軟件工程中的一種軟件架構(gòu)模式,把軟件系統(tǒng)分為三個基本部分:模型(Model)区匠、視圖(View)和控制器(Controller)干像。
MVC 以一種插件式的、松耦合的方式連接在一起驰弄。
- 模型(M)- 編寫程序應(yīng)有的功能麻汰,負責(zé)業(yè)務(wù)對象與數(shù)據(jù)庫的映射(ORM)。
- 視圖(V)- 圖形界面戚篙,負責(zé)與用戶的交互(頁面)五鲫。
- 控制器(C)- 負責(zé)轉(zhuǎn)發(fā)請求,對請求進行處理岔擂。
但是在Django中位喂,是MTV模型,本質(zhì)和MVC一致乱灵。只是名稱不一致忆某。
圖解
用戶通過瀏覽器向我們的服務(wù)器發(fā)起一個請求(request),這個請求會去訪問視圖函數(shù):
a.如果不涉及到數(shù)據(jù)調(diào)用阔蛉,那么這個時候視圖函數(shù)直接返回一個模板也就是一個網(wǎng)頁給用戶。
b.如果涉及到數(shù)據(jù)調(diào)用癞埠,那么視圖函數(shù)調(diào)用模型状原,模型去數(shù)據(jù)庫查找數(shù)據(jù)聋呢,然后逐級返回。
視圖函數(shù)把返回的數(shù)據(jù)填充到模板中空格中颠区,最后返回網(wǎng)頁給用戶削锰。
開發(fā)環(huán)境
Win 10(64位)
Python 3.8.0
Django 3.1.7
編寫Model.py
Django中通過模型(Model)映射到數(shù)據(jù)庫,處理與數(shù)據(jù)相關(guān)的事務(wù)毕莱。
keithyang/models.py器贩,輸入如下代碼:
python
from __future__ import unicode_literals
from django.db import models
# Create your models here.
查詢列表信息 數(shù)據(jù)模型
class cal(models.Model):
value_a = models.CharField(max_length=10)
value_b = models.CharField(max_length=10)
result = models.CharField(max_length=10)
說明:每個模型(model)都被表示為 django.db.models.Model 類的子類,從它繼承了操作數(shù)據(jù)庫需要的所有方法朋截。
數(shù)據(jù)遷移(Migrations)
每次models.py文件發(fā)生變化都需要執(zhí)行2條指令
對模型的更改創(chuàng)建新的遷移表
python manage.py makemigrations
應(yīng)用遷移到數(shù)據(jù)庫中
python manage.py migrate
Views視圖函數(shù)
Django 中視圖即函數(shù)蛹稍,path函數(shù)將url映射到視圖
from django.shortcuts import render
import requests
import json
from .models import cal
# Create your views here.
def home(request):
api_request = requests.get("https://api.github.com/users?since=0")
api = json.loads(api_request.content)
return render(request, 'home.html', {"api": api})
def user(request):
# import requests
if request.method == 'POST':
user = request.POST['user']
user_request = requests.get("https://api.github.com/users/" + user)
user_name = json.loads(user_request.content)
name = user_name['name']
company = user_name['company']
follower = user_name['followers']
cal.objects.create(value_a=name, value_b=company, result=follower)
return render(request, 'user.html', {'user_name': user_name})
else:
return Calllist(request)
# def addinfo(request):
def Calllist(request):
data = cal.objects.all()
# for data in spldata:
# name = data.value_a
# location = data.value_b
# follows = data.result
return render(request, 'list.html', {'data': data} )
將url映射到視圖
from django.urls import path
from . import views
urlpatterns = [
path('', views.home, name="home"),
path('user/', views.user, name="user"),
path('list/', views.Calllist, name="list"),
]
Templates/base.html,home.html,user.html,list.html
Bootstrap中獲取模板文件部服,編寫home.html,user.html,list.html,
使用{% extends 'base.html'%}繼承base.html文件唆姐。
{% block content %}
<!doctype html>
<html lang="zh-CN">
<head>
<!-- 必須的 meta 標簽 -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap 的 CSS 文件 -->
<link rel="stylesheet" integrity="sha384-B0vP5xmATw1+K9KRQjQERJvTumQW0nPEzvF6L/Z6nronJ3oUOFUFpCjEUQouq2+l" crossorigin="anonymous">
<title>Hub交友</title>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<a class="navbar-brand" href="{% url 'home' %}">Hub交友</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item">
<a class="nav-link" href="{% url 'user' %}">查詢</a>
</li>
</ul>
<form class="form-inline my-2 my-lg-0" method="POST" action="{%url 'user'%}">
{% csrf_token %}
<input class="form-control mr-sm-2" type="search" name="user" aria-label="Search">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">搜索</button>
</form>
</div>
</nav>
<br/>
<div class="container">
{% block content %}
{% endblock %}
</div>
<!-- JavaScript 文件是可選的。從以下兩種建議中選擇一個即可廓八! -->
<!-- 選項 1:jQuery 和 Bootstrap 集成包(集成了 Popper) -->
<script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-LCPyFKQyML7mqtS+4XytolfqyqSlcbB3bvDuH9vX2sdQMxRonb/M3b9EmhCNNNrV" crossorigin="anonymous"></script>
<!-- 選項 2:Popper 和 Bootstrap 的 JS 插件各自獨立 -->
<!--
<script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.min.js" integrity="sha384-gRC4eoaRyQ8xv2X6Mnf+eOIrtON3wId3dAkwO0HQX26OrFBoLpjX/XWOJacSiZhL" crossorigin="anonymous"></script>
-->
</body>
</html>