做好了代码高亮、新建文章功能

MyBlog/MyBlog/settings.py

@@ -113,3 +113,7 @@ USE_TZ = True
 # https://docs.djangoproject.com/en/2.0/howto/static-files/
 
 STATIC_URL = '/static/'
+
+STATICFILES_DIRS = (
+    os.path.join(BASE_DIR, "static"),
+)

MyBlog/article/form.py

@@ -0,0 +1,8 @@
+from django import forms
+from .models import ArticlePost
+
+
+class ArticlePostForm(forms.ModelForm):
+    class Meta:
+        model = ArticlePost
+        fields = ('title', 'body')

MyBlog/article/urls.py

@@ -5,5 +5,7 @@ app_name = 'article'
 
 urlpatterns = [
     path('article_list/', views.article_list, name='article_list'),
-    path('', views.article_list, name='test')
+    path('', views.article_list, name='test'),
+    path('article_detail/<int:id>/', views.article_detail, name='article_detail'),
+    path('article_create/',views.article_create,name='article_create'),
 ]

MyBlog/article/views.py

@@ -1,6 +1,9 @@
-from django.shortcuts import render
+from django.shortcuts import render, redirect
 from django.http import HttpResponse
 from .models import ArticlePost
+from .form import ArticlePostForm
+from django.contrib.auth.models import User
+import markdown
 
 
 # 视图函数
@@ -8,3 +11,37 @@ def article_list(request):
     articles = ArticlePost.objects.all()
     context = {'articles': articles}
     return render(request, 'article/list.html', context)
+
+
+def article_detail(request, id):
+    articles = ArticlePost.objects.get(id=id)
+    articles.body = markdown.markdown(articles.body,
+                                      extensions=[
+                                          'markdown.extensions.extra',
+                                          'markdown.extensions.codehilite',
+                                      ])
+    context = {'article': articles}
+    return render(request, 'article/detail.html', context)
+
+
+def article_create(request):
+    if request.method == 'POST':
+        article_post_form = ArticlePostForm(data=request.POST)
+        # 判断提交的数据是否满足模型要求
+        if article_post_form.is_valid():
+            # 保存数据，但是暂时不提交到数据库中
+            new_article = article_post_form.save(commit=False)
+            new_article.author = User.objects.get(id=1)
+            # 将新文章保存到数据库中
+            new_article.save()
+            return redirect("article:article_list")
+        # 如果数据不合法，返回错误信息
+        else:
+            return HttpResponse("表单有错误，请重新填写")
+    # 如果用户请求获取数据
+    else:
+        # 创建表单类实例
+        article_post_form = ArticlePostForm()
+        context = {'article_post_form': article_post_form}
+        # 返回模板
+        return render(request, 'article/create.html', context)

MyBlog/templates/article/create.html

@@ -0,0 +1,37 @@
+{% extends "base.html" %}
+{% load static %}
+{% block title %}
+    发表文章
+{% endblock title %}
+{% block content %}
+    <div class="container">
+        <div class="row">
+            <div class="col-12">
+                <br>
+                <!-- 提交文章的表单 -->
+                <form method="post" action=".">
+                    <!-- Django中需要POST数据的地方都必须有csrf_token -->
+                    {% csrf_token %}
+                    <div class="form-group">
+                        <label for="title">
+                            文章标题
+                        </label>
+                        <input type="text" class="form-control" id="title" name="title">
+                    </div>
+                    <div class="form-group">
+                        <label for="body">
+                            文章正文
+                        </label>
+                        <textarea type="text" class="form-control" id="body" name="body" rows="12">
+
+                    </textarea>
+
+                    </div>
+                    <button type="submit" class="btn btn-primary">
+                        完成
+                    </button>
+                </form>
+            </div>
+        </div>
+    </div>
+{% endblock content %}

MyBlog/templates/article/detail.html

@@ -0,0 +1,22 @@
+{% extends "base.html" %}
+{% load static %}
+{% block title %}
+    文章详情:{{ article.title }}
+{% endblock title %}
+{% block content %}
+    <div class="container">
+        <div class="row">
+            <h1 class="col-12 mt-4 mb-4">
+                {{ article.title }}
+            </h1>
+            <div class="col-12 alert alert-success">
+                作者：{{ article.author }}
+            </div>
+            <div class="col-12">
+                <p>
+                    {{ article.body|safe }}
+                </p>
+            </div>
+        </div>
+    </div>
+{% endblock content %}

MyBlog/templates/article/list.html

@@ -1,3 +1,31 @@
-{%for article in articles%}
-<p>{{article.title}}</p>
-{% endfor %}
+{% extends "base.html" %}
+{% load static %}
+{% block title %}
+    首页
+{% endblock title %}
+{% block content %}
+    <div class="container">
+        <div class="row mt-2">
+            {% for article in articles %}
+                <div class="col-4 mb-4">
+                    <div class="card h-100">
+                        <h4 class="card-header">
+                            {{ article.title }}
+                        </h4>
+                        <div class="card-body">
+                            <p class="card-text">
+                                {{ article.body|slice:'100' }}...
+                            </p>
+                        </div>
+                        <div class="card-footer">
+                            <a href="{% url 'article:article_detail' article.id %}" class="btn btn-primary">
+                                阅读本文
+                            </a>
+                        </div>
+                    </div>
+                </div>
+            {% endfor %}
+
+        </div>
+    </div>
+{% endblock content %}

MyBlog/templates/base.html

@@ -0,0 +1,23 @@
+{% load static %}
+<!DOCTYPE html>
+
+<html lang="zh-cn">
+<head>
+    <meta charset="utf-8">
+    <title>
+        {% block title %}
+        {% endblock %}
+    </title>
+    <link rel="stylesheet" href="{% static 'bootstrap/css/bootstrap.min.css' %}">
+<link rel="stylesheet" href="{% static 'md_css/monokai.css' %}">
+</head>
+<body>
+{% include "header.html" %}
+{% block content %}
+{% endblock %}
+{% include "footer.html" %}
+<script src="{% static 'jQuery/jquery-3.5.1.js' %}"></script>
+<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1-lts/dist/umd/popper.min.js"></script>
+<script src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script>
+</body>
+</html>

MyBlog/templates/footer.html

@@ -0,0 +1,10 @@
+{% load static %}
+<!-- Footer -->
+<div>
+    <br><br><br>
+</div>
+<footer class="py-3 bg-dark fixed-bottom">
+    <div class="container">
+        <p class="m-0 text-center text-white">Copyright &copy; www.shellmiao.com 2021</p>
+    </div>
+</footer>

MyBlog/templates/header.html

@@ -0,0 +1,20 @@
+<!-- 定义导航栏 -->
+<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
+  <div class="container">
+
+    <!-- 导航栏商标 -->
+    <a class="navbar-brand" href="#">我的博客</a>
+
+    <!-- 导航入口 -->
+    <div>
+      <ul class="navbar-nav">
+        <!-- 条目 -->
+        <li class="nav-item">
+            <a class="nav-link" href="{% url 'article:article_create' %}">写文章</a>
+            <a class="nav-link" href="{% url 'article:article_list' %}">文章</a>
+        </li>
+      </ul>
+    </div>
+
+  </div>
+</nav>