从零创建 Django 投票应用,接入 SimpleUI 美化后台,完整可复现

## 摘要

本文基于 Django 官方经典示例 `polls`,完整复现了一个可运行、可管理、可测试的投票应用项目。在官方教程基础上,项目进一步接入 `django-simpleui` 对后台管理界面进行美化,并补充了前台页面样式、数据库迁移、后台管理配置以及自动化测试。文章按照实际落地流程展开,涵盖环境准备、项目创建、模型定义、路由与视图编写、模板渲染、Admin 配置和测试验证等关键步骤,适合作为 Django 入门阶段的完整实战示例。

## 前言

本文围绕 Django 官方经典示例 `polls` 投票应用展开,完整复现其核心功能,并在官方教程基础上接入 `django-simpleui`,用于优化后台管理界面。整个项目覆盖了 Django 入门阶段最关键的几个环节:模型定义、数据库迁移、URL 路由、模板渲染、表单提交、后台管理和自动化测试。

与单纯照搬教程不同,本文对应的项目已经在本地环境中完成实际运行、数据库迁移与测试验证,因此更适合作为一个可以直接参考和继续扩展的入门项目。

## 一、项目最终效果

复现完成后,项目具备如下能力:

- 首页展示最新投票列表

- 点击问题进入投票详情页

- 选择选项后提交投票

- 查看投票结果

- 通过 Django Admin 管理问题与选项

- 使用 SimpleUI 美化后台界面

首页效果如下:

投票详情页如下:

投票结果页如下:

## 二、环境准备

本次复现使用的环境如下:

- Windows

- Python 3.12.10

- Django 6.0.2

- django-simpleui 2026.1.13

- SQLite3

依赖文件内容如下:

```txt

Django==6.0.2

django-simpleui==2026.1.13

```

安装依赖命令如下:

```powershell

python312\python.exe -m pip install -r requirements.txt

```

## 三、创建项目与应用

首先创建 Django 项目,再生成 `polls` 应用:

```powershell

python312\Scripts\django-admin.exe startproject mysite .

python312\python.exe manage.py startapp polls

```

项目的核心结构如下:

```txt

danjango/

├─ manage.py

├─ mysite/

├─ polls/

├─ templates/

├─ requirements.txt

├─ article_csdn.md

└─ article_publish_ready.md

```

其中:

- `mysite` 负责项目级配置

- `polls` 负责业务逻辑实现

- `templates` 用于覆盖后台模板和扩展前端页面

## 四、配置 settings.py

在 `mysite/settings.py` 中,需要先注册 `simpleui` 和 `polls`:

```python

INSTALLED_APPS = [

    'simpleui',

    'django.contrib.admin',

    'django.contrib.auth',

    'django.contrib.contenttypes',

    'django.contrib.sessions',

    'django.contrib.messages',

    'django.contrib.staticfiles',

    'polls',

]

```

然后补充模板目录、时区和静态文件配置:

```python

TEMPLATES = [

    {

        'BACKEND': 'django.template.backends.django.DjangoTemplates',

        'DIRS': [BASE_DIR / 'templates'],

        'APP_DIRS': True,

    },

]

LANGUAGE_CODE = 'zh-hans'

TIME_ZONE = 'Asia/Shanghai'

USE_I18N = True

USE_TZ = True

STATIC_URL = 'static/'

STATIC_ROOT = BASE_DIR / 'staticfiles'

```

为了让后台首页更简洁,还可以关闭 SimpleUI 的部分默认信息面板:

```python

SIMPLEUI_HOME_INFO = False

SIMPLEUI_HOME_QUICK = False

SIMPLEUI_ANALYSIS = False

```

## 五、定义模型

在 `polls/models.py` 中定义 `Question` 和 `Choice` 两个模型:

```python

from datetime import timedelta

from django.db import models

from django.utils import timezone


 

class Question(models.Model):

    question_text = models.CharField(max_length=200)

    pub_date = models.DateTimeField('date published')

    def __str__(self):

        return self.question_text

    def was_published_recently(self):

        now = timezone.now()

        return now - timedelta(days=1) <= self.pub_date <= now


 

class Choice(models.Model):

    question = models.ForeignKey(Question, on_delete=models.CASCADE)

    choice_text = models.CharField(max_length=200)

    votes = models.IntegerField(default=0)

    def __str__(self):

        return self.choice_text

```

## 六、执行数据库迁移

模型编写完成后,需要执行数据库迁移:

```powershell

python312\python.exe manage.py makemigrations polls

python312\python.exe manage.py migrate

```

迁移执行成功后,项目会生成 `db.sqlite3` 数据库文件,并同步创建相关表结构。本文对应项目已完成实际迁移,数据库文件已在工作区生成。

## 七、编写路由与视图

### 1. 路由配置

应用级路由如下:

```python

urlpatterns = [

    path('', views.IndexView.as_view(), name='index'),

    path('<int:pk>/', views.DetailView.as_view(), name='detail'),

    path('<int:pk>/results/', views.ResultsView.as_view(), name='results'),

    path('<int:question_id>/vote/', views.vote, name='vote'),

]

```

项目级路由如下:

```python

urlpatterns = [

    path('', RedirectView.as_view(pattern_name='polls:index', permanent=False)),

    path('polls/', include('polls.urls')),

    path('admin/', admin.site.urls),

]

```

### 2. 视图逻辑

本项目主要使用 Django 通用类视图实现列表页、详情页和结果页。首页查询逻辑如下:

```python

class IndexView(generic.ListView):

    template_name = 'polls/index.html'

    context_object_name = 'latest_question_list'

    def get_queryset(self):

        return Question.objects.filter(pub_date__lte=timezone.now()).order_by('-pub_date')[:5]

```

投票处理逻辑如下:

```python

def vote(request, question_id):

    question = get_object_or_404(Question, pk=question_id)

    try:

        selected_choice = question.choice_set.get(pk=request.POST['choice'])

    except (KeyError, Choice.DoesNotExist):

        return render(

            request,

            'polls/detail.html',

            {

                'question': question,

                'error_message': 'Please select an option before submitting.',

            },

        )

    selected_choice.votes = F('votes') + 1

    selected_choice.save(update_fields=['votes'])

    return HttpResponseRedirect(reverse('polls:results', args=(question.id,)))

```

## 八、编写模板与样式

为了让页面效果不局限于 Django 教程默认样式,项目额外补充了以下模板与样式文件:

- `polls/index.html`

- `polls/detail.html`

- `polls/results.html`

- `polls/static/polls/style.css`

前台样式主要做了以下调整:

- 使用渐变背景增强页面层次

- 通过卡片式容器提升阅读性

- 将投票选项设计为独立块状区域

- 优化按钮与链接的视觉层级

## 九、配置 Django Admin 与 SimpleUI

在 `polls/admin.py` 中,将 `Choice` 以内联表格方式挂载到 `Question` 编辑页面:

```python

class ChoiceInline(admin.TabularInline):

    model = Choice

    extra = 3


 

@admin.register(Question)

class QuestionAdmin(admin.ModelAdmin):

    fieldsets = [

        (None, {'fields': ['question_text']}),

        ('Date information', {'fields': ['pub_date']}),

    ]

    inlines = [ChoiceInline]

    list_display = ['question_text', 'pub_date', 'was_published_recently', 'choice_count']

    list_filter = ['pub_date']

    search_fields = ['question_text']

```

后台登录页如下:

SimpleUI 后台首页如下:

问题列表页如下:

问题编辑页如下:

## 十、编写测试并验证结果

测试文件位于 `polls/tests.py`,主要覆盖以下逻辑:

- `was_published_recently()` 的时间判断是否正确

- 首页是否能够过滤未来问题

- 详情页是否能够屏蔽未来问题

运行命令如下:

```powershell

python312\python.exe manage.py test

```

本文对应项目已完成实际测试,结果如下:

- 共发现 `10` 个测试

- `10` 个测试全部通过

## 十一、启动项目

创建管理员账号的命令如下:

```powershell

python312\python.exe manage.py createsuperuser

```

启动开发服务器的命令如下:

```powershell

python312\python.exe manage.py runserver

```

访问地址如下:

- 前台首页:`http://127.0.0.1:8000/`

- 后台管理:`http://127.0.0.1:8000/admin/`

## 十二、复现过程中需要注意的点

从实际复现过程来看,Django 教程本身并不复杂,真正容易产生问题的往往是运行环境与工程细节。主要需要注意以下几点:

1. Python 环境必须可用,且版本与依赖兼容。

2. `INSTALLED_APPS`、模板目录和静态文件目录必须配置正确。

3. 文件编码应统一为 UTF-8,避免 Python 解释阶段出现编码问题。

4. 如果仅照抄教程而不执行测试,很难确认页面行为是否与预期一致。

5. 默认后台虽然可用,但接入 SimpleUI 后更适合做项目展示和日常管理。

## 十三、总结

Django 官方 `polls` 项目之所以经典,不在于它功能复杂,而在于它覆盖了一个 Web 应用最基本也最完整的主流程。对于入门阶段来说,这种“小而全”的项目比单独学习某个零散知识点更有效。

本文对应项目已经完成以下验证:

- 前台页面可正常访问

- 投票流程可正常执行

- Django Admin 可正常登录和维护数据

- SimpleUI 已成功接入

- 数据库迁移已完成

- 自动化测试全部通过

因此,这一版本已经不只是教程示例,而是一份可以直接运行、直接展示、也可以继续扩展的 Django 入门项目。

## 结尾推荐语

如果读者正在学习 Django,建议先完整复现这一项目,再继续扩展登录、分页、接口化或部署流程。相比零散学习单个知识点,这类完整项目更有助于理解 Django 的整体工作方式。

如果本文对复现过程有所帮助,欢迎关注、点赞、收藏,也欢迎继续交流 Django 入门与后端开发相关问题。

## 附:本文涉及命令汇总

```powershell

python312\python.exe -m pip install -r requirements.txt

python312\Scripts\django-admin.exe startproject mysite .

python312\python.exe manage.py startapp polls

python312\python.exe manage.py makemigrations polls

python312\python.exe manage.py migrate

python312\python.exe manage.py createsuperuser

python312\python.exe manage.py runserver

python312\python.exe manage.py test

```

Logo

Agent 垂直技术社区,欢迎活跃、内容共建。

更多推荐