使用PyCharm开发Django程序的一般步骤

最新推荐文章于 2026-07-17 10:05:57 发布

原创最新推荐文章于 2026-07-17 10:05:57 发布 · 902 阅读

7 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

Django笔记

本文介绍了如何使用PyCharm进行Django项目开发，从创建新项目到编辑视图函数、模板文件，再到数据库连接配置，直至首页图书信息展示的全过程。

1. 创建新的`Django`项目

打开PyCharm专业版，选择新建项目，左侧选择Django，选择新建或已有虚拟环境，创建项目book_manager。

2. 创建新的`app`

进入虚拟环境，运行如下命令：

python manage.py startapp front

3. 编辑`front`的`views.py`

from django.shortcuts import render

def index(request):
    pass

def add_book(request):
    pass

def book_detail(request,book_id):
    pass

4. 映射视图函数

打开主urls.py文件，编辑urlpatterns：

from django.urls import path
from front import views

urlpatterns = [
    path('', views.index, name='index'),
    path('add_book/', views.add_book, name='add_book'),
    path('book_detail/', views.book_detail, name='book_detail'),
]

5. 创建视图函数的模板文件

创建3个模板文件，index.html、add_book.html、book_detail.html。

6. 编辑`front`的视图函数

from django.shortcuts import render

def index(request):
    return render(request, 'index.html')

def add_book(request):
    pass

def book_detail(request,book_id):
    pass

7. 修改`settings.py`文件

7.1 修改数据库连接

DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.mysql',
        'NAME': 'book_manager',
        'USER': 'root',
        'PASSWORD': 'root',
        'HOST': '127.0.0.1',
        'PORT': '3306',
    }
}

使用数据库连接，需要安装mysqlclient

pip install mysqlclient

7.2 添加`app`

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

8. 编辑`front.index`视图函数，获取并传递首页数据

from django.shortcuts import render
from django.db import connection

def get_corsor():
    return connection.cursor()


def index(request):
    cursor = get_corsor()
    cursor.execute("select * from book")
    books = cursor.fetchall()
    # [(1,'三国演义', '罗贯中'), ...]
    return render(request, 'index.html', context={"books":books})

def add_book(request):
    pass

def book_detail(request,book_id):
    pass

9. 编辑首页`index.html`

9.1 修改首页内容，创建导航栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <nav>
        <ul class="nav">
            <li><a href="/">首页</a></li>
            <li><a href="{% url 'add_book' %}">发布图书</a></li>
        </ul>
    </nav>
</body>
</html>

9.2 创建`index.css`

创建front/static/front文件夹
在新建的文件夹下新建index.css文件

*{
    margin:0;
    padding: 0;
}

.nav{
    background: #3a3a3a;
    height: 65px;
    overflow: hidden;
}

.nav li{
    float:left;
    list-style: none;
    margin:0 20px;
    line-height: 65px;
}

.nav li a{
    color:#fff;
    text-decoration: none;
}

.nav li a:hover{
    color: lightblue;
}

在首页index.html顶部加载static

{% load static %}
<!DOCTYPE html>
<html lang="en">

引用index.css文件

{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="{% static 'front/index.css' %}">
</head>

10. 重构模板，抽取共性部分

抽取后的公共部分存入base.html。

# base.html

{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>图书管理系统</title>
    <link rel="stylesheet" href="{% static 'front/base.css' %}">
</head>
<body>
    <nav>
        <ul class="nav">
            <li><a href="/">首页</a></li>
            <li><a href="{% url 'add_book' %}">发布图书</a></li>
        </ul>
    </nav>
    {% block content %}{% endblock %}
</body>
</html>

重构后的ndex.html文件如下：

{% extends 'base.html' %}

{% block content %}
    
{% endblock %}

11. 编辑首页图书信息展示

修改后的index.html文件内容如下：

{% extends 'base.html' %}

{% block content %}
    <table>
        <thead>
            <tr>
                <th>序号</th>
                <th>书名</th>
                <th>作者</th>
            </tr>
        </thead>
        <tbody>
            {% for book in books %}
                <tr>
                    <td>{{ forloop.counter }}</td>
                    <td>{{ book.1 }}</td>
                    <td>{{ book.2 }}</td>
                </tr>
            {% endfor %}

        </tbody>
    </table>
{% endblock %}