(保姆式教学)python Django初识-----开发一个显示GitHub网站信息的网站!

写在前面:

(制作粗糙   但很详细 严格按照步骤来  基本一次会成功)

Tips:[1]--再怎么说diango也是一个框架 有很多文件之间的通信   几句文字根本描述不清楚   所以前面的准备工作我会很详细的讲清楚   最后的项目的文件目录和每个文件的代码都会copy 上去    暗部照搬就能完成项目

           [2]--按道理说用什么编译器都行   但是我跟老师学的是用的VScode   其实下载也很快  下载完选择下载python的工具就可以了(VScode很在意空格,比如''a''和'' a''完全不一样  妈的我有个这样错误找了半天!)

           [3]--项目最后加载用户头像的时候可能会有延时或者展示不全(个人感觉可能是自己网不够好或者GitHub自己的原因)

           [4]--点击按钮访问的用户主页的时候,速度可能会有点慢,但是这不是Django框架的原因,是跳转访问GitHub的速度慢,django本身是很快的

 

涉及到的工具:

windows powershell

vscode 

Django框架

bootstrap框架(部分)

还有python基本语句和HTML5基本语句

 

 

项目预览:(保姆式教学)python  Django初识-----开发一个显示GitHub网站信息的网站!

 (保姆式教学)python  Django初识-----开发一个显示GitHub网站信息的网站!

 

第一步:安装python环境-这一步大家都会就不多说了

安装成功的标志吧:打开CMD 

(保姆式教学)python  Django初识-----开发一个显示GitHub网站信息的网站!

第二步:

powershell 是windowS自带的(在这上面可以很方便的运行一些类似linux的命令)

打开powershell------目的是获取电脑的一些权限

切记!以管理员方式运行!不然会报错,,如下:

(保姆式教学)python  Django初识-----开发一个显示GitHub网站信息的网站!

正确的应该是:(敲y确定)

(保姆式教学)python  Django初识-----开发一个显示GitHub网站信息的网站!

第三步:pip install virtualenv安装虚拟环境(虽然只有8M,可能会需要5-10min)

(保姆式教学)python  Django初识-----开发一个显示GitHub网站信息的网站! 

安装成功:

(保姆式教学)python  Django初识-----开发一个显示GitHub网站信息的网站! 

第五步:在桌面上创建一个空文件夹---名字叫django-project

(保姆式教学)python  Django初识-----开发一个显示GitHub网站信息的网站!

回到powershell 然后进到这个文件夹的路径:(power shell也有自动补全功能)

(保姆式教学)python  Django初识-----开发一个显示GitHub网站信息的网站!

 第六步:在这个文件夹里面下载 virtualenv和  django环境(这个环境不关系统的事,就是文件夹里面的,所以在这个文件夹里你随便折腾)

命令:(下面三个命令依次执行)

virtualenv .(空格加一个点)(在文件夹中安装虚拟环境  好几分钟)

 .\Scripts\activate  (进到项目里)

pip install django(依然需要好几分钟)

 (保姆式教学)python  Django初识-----开发一个显示GitHub网站信息的网站!

(我当时嫌慢   让他在后台下我去看书去了 结果直接断掉    最好还是停留在这个页面  安心等待下好吧)

第七步:讲django 项目运行

(保姆式教学)python  Django初识-----开发一个显示GitHub网站信息的网站!

第八步:在主文件夹外   创建一个新的文件夹   虽然同级但是还是有主次之分

(保姆式教学)python  Django初识-----开发一个显示GitHub网站信息的网站!

第九步:

在VS code 中打开这个文件夹  应该是这个样子

(保姆式教学)python  Django初识-----开发一个显示GitHub网站信息的网站!

 第十步:之后就是各个文件之间的互相交流了   最后会把各个文件给大家   以及VSCODE中的文件目录给大家

            文件目录:(保姆式教学)python  Django初识-----开发一个显示GitHub网站信息的网站!

 mysite.setting.py(表示mysite文件夹下的setting.py文件   下面同理)



import os

# Build paths inside the project like this: os.path.join(BASE_DIR, ...)
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))


# Quick-start development settings - unsuitable for production
# See https://docs.djangoproject.com/en/3.0/howto/deployment/checklist/

# SECURITY WARNING: keep the secret key used in production secret!
SECRET_KEY = '7lfkcmg(ip=u512m75r5%#s@-8^92*fokvotdx@m8_+&l9deef'

# SECURITY WARNING: don't run with debug turned on in production!
DEBUG = True

ALLOWED_HOSTS = []


# Application definition

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    "misterwu",
]

MIDDLEWARE = [
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    'django.middleware.csrf.CsrfViewMiddleware',
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',
]

ROOT_URLCONF = 'mysite.urls'

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [],
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                'django.template.context_processors.debug',
                'django.template.context_processors.request',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
            ],
        },
    },
]

WSGI_APPLICATION = 'mysite.wsgi.application'


# Database
# https://docs.djangoproject.com/en/3.0/ref/settings/#databases

DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.sqlite3',
        'NAME': os.path.join(BASE_DIR, 'db.sqlite3'),
    }
}


# Password validation
# https://docs.djangoproject.com/en/3.0/ref/settings/#auth-password-validators

AUTH_PASSWORD_VALIDATORS = [
    {
        'NAME': 'django.contrib.auth.password_validation.UserAttributeSimilarityValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.MinimumLengthValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.CommonPasswordValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.NumericPasswordValidator',
    },
]


# Internationalization
# https://docs.djangoproject.com/en/3.0/topics/i18n/

LANGUAGE_CODE = 'en-us'

TIME_ZONE = 'UTC'

USE_I18N = True

USE_L10N = True

USE_TZ = True


# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/3.0/howto/static-files/

STATIC_URL = '/static/'

 mysite.urls.py


from django.contrib import admin
from django.urls import path,include

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', include('misterwu.urls')),
]

 misterwu.templates.home.html

{% extends 'base.html'%}

{% block content %}
    <div class="jumbotron jumbotron-fluid">
        <div class="container">
            <h1 class="display-4">GitHub英雄榜访问网站</h1>
            <p class="lead">基于Django框架</p>
        </div>
    </div>

    <div class="container">
        <div class="row">
            {% for x in api %}
            <div class="col-sm">


                <div class="card" style="width: 18rem;">
                    <img src="{{x.avatar_url}}" class="card-img-top" alt="...">
                    <div class="card-body">
                        <h5 class="card-title">{{x.login}}</h5>
                        <p class="card-text">{{v.login}}的GitHub</p>
                        <a href="{{x.html_url}}" class="btn btn-primary">访问Ta的主页</a>
                    </div>
                </div>
            </div> 
            {%endfor%}
        </div>
    </div>

    <p>{{api}}</p>
{% endblock%}

  misterwu.templates.base.html

<!doctype html>
<html lang="en">
<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.4.1/dist/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">

    <title>Github英雄榜</title>
</head>
<body>

    <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
        <a class="navbar-brand" href="{% url 'home'%}">GitHub英雄榜</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" name="user" type="search" placeholder="Search" 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>



    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="https://cdn.jsdelivr.net/npm/jquery@3.4.1/dist/jquery.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.4.1/dist/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
</body>
</html>

 misterwu.templates.user.html

{% extends  'base.html'%}

{% block content %}

     {% if notfound %}
        <h2>{{notfound}}</h2>
     {% else %}

        <div class="card" style="width: 18rem;">
            <img src="{{username.avatar_url}}" class="card-img-top" alt="...">
            <div class="card-body">
                <h5 class="card-title">{{username.name}}</h5>
                <p class="card-text">location:{{username.location}}</p>
                <p class="card-text">id:{{username.id}}</p>
                <p class="card-text">site_admin:{{username.site_admin}}</p>
                <p class="card-text">type:{{username.type}}</p>
                <p class="card-text">followers_url:{{username.followers_url}}</p>
               

            </div>
        </div>
     {% endif %}

{% endblock %}

misterwu.urls.py


from django.urls import path
from . import views
urlpatterns = [
    path('',views.home,name='home'),
    path('user/',views.user,name='user'),
]

misterwu.views.py

from django.shortcuts import render

# Create your views here.
def home(request):
    import requests
    import json
    api_request = requests.get("https://api.github.com/users?since=135")
    api = json.loads(api_request.content)
    return render(request,'home.html',{"api":api})

def user(request):
    if request.method == 'POST':
        import requests
        import json
        user = request.POST['user']
        user_request = requests.get("https://api.github.com/users/"+user)
        username = json.loads(user_request.content)
        return render(request,'user.html',{'user':user,'username':username})
    else:
        notfound = "请在右上角的搜索框输入用户名查找哦."
        return render(request,'user.html',{'notfound':notfound})
        
        

 

(保姆式教学)python  Django初识-----开发一个显示GitHub网站信息的网站!(保姆式教学)python  Django初识-----开发一个显示GitHub网站信息的网站! WUPEIJIANG 发布了17 篇原创文章 · 获赞 7 · 访问量 3695 私信 关注
上一篇:kail 更新源


下一篇:Django-admin补充