html编写个人博客_Django 开发简易博客网站

本文详细介绍了使用Django框架,结合MySQL和WampServer,构建博客网站的过程。重点讨论了Django的ORM特性,通过模型、视图和控制器实现数据库操作,无需编写SQL语句。内容包括首页、文章内容页、新建和编辑文章页面的创建,以及遇到的问题和解决方案。项目源代码已上传至GitHub,供学习参考。
摘要由CSDN通过智能技术生成

本篇使用 Django 开发博客网站的核心内容,涉及 Django 、MySQL 、WampServer ;我比较喜欢 Django 框架的 MVC (模型、视图、控制器)的软件设计模式,其中我最喜欢 Django 与数据库的交互模式为 ORM (即关系-模型映射),这个过程不需要书写任何的 SQL 语句,对数据库的操作都转化成对类属性和方法的操作;Life is short, i need python. myblog 项目已上传 github (https://github.com/Songothao/Django.git)

  1. myblog 项目预览
  2. 概要设计
  3. 创建项目做准备工作
  4. 编写代码制作首页
  5. 编写代码制作文章内容页
  6. 编写代码制作新建文章页
  7. 新建文章页修改进阶
  8. 整体修改加链接

一、myblog 项目预览

  1. 首页

60a5dc059811ce36e7be03a91a2682c8.png

2. 点击新文章

5e805f39508ec210d6fc8ba05c8bcad0.png

3. 首页点击博客标题

877201ce2ceee1e4b4225cdefd58e5b4.png

4. 博客内容也点击修改文章

1c9aef94ccd25b063e76d540b2e1acc7.png

5. mysql 数据库预览

73886d6a226c83d5f22012c59124bd79.png

二、概要设计

  1. 首页(增加新文章(超链接)、已有文章列表(超链接))
  2. 文章内容页(文章标题、文章内容、修改文章(超链接))
  3. 增加新文章页和修改文章页(区别:增加新闻章页无内容)

三、创建项目做准备工作

以下内容全部为重新编写时创建新的 blog_test 项目

  1. 创建项目:
django-admin startproject blog_test

3ccc8559b808acd7ae387f9d1a520cb1.png

2. 使用 pycharm 打开刚刚创建项目(这里放图片主要是展示新建项目结构)

0a83c0f668b7b8b714feaf94c21da3dc.png

3. 打开 blog_test / setting.py 找到 DATABASES 这个字典进行修改如下:

635795895d960882fa70adfec7edbf08.png

4. 打开 WampServer 里面的 phpMyAdmin ;并创建 blog_test 数据库

81da886a42e620d9a888b37d6bdd5879.png

5. 创建app

python manage.py startapp blog

925385d83d45561e46e11814e19b5e05.png

97e5bb1defdd4a4a3fec983e1eaeadb0.png

6. 打开 blog_test / setting.py 将 app 添加到 INSTALLED_APPS 这个列表中:

7f1557d4e42fc30ca8366649cd3ab81d.png

7. 在 blog 这个 app 下创建 templates / blog / index.html

b826f0f7430979f7c59216ba47f80154.png

8. 配置 blog_test / urls.py 、blog / urls.py 、编写一点点的 index.html 、views.py

80a099be11936f4a81e35f8384f6475a.png

d14dc257493663496292d90989f38b3e.png

a164e5fb7733316204d52a60327271b9.png

9cac6ae4bfb61c8cddc7fded6fd949ba.png

b587edf4cbf31e93e18bee6f85c4e6d0.png

四、编写代码制作首页

  1. 编写 blog / models.py

c2af86f7b023761ddefb46c24854274c.png

2. 修改 blog / views.py

393014e9b8f1caeb52f69e5064331414.png

3. 创建表结构、更改表结构

7f7aadc2f7644e83f48bf68f7064fba4.png

60b2790dea31bedbb6a79303dfbff762.png

4a7ef45026ad2fe8593f3234dbcd65f7.png

4. 修改 blog / templates / blog / index.html

567dbfae9c859a46a546b01ce7181b99.png

5. 向数据库中插入数据

16c6e6bf14a6642219fd369112ceec49.png

6. 浏览器访问 127.0.0.1:8000/blog/index

60abbd8d332bfdecd89cdc11b9e82225.png

五、编写代码制作文章内容页

  1. 新建 blog / templates / blog / article_page.html 并编写代码:

fad71da8e260a9607102cbd6fe8b1619.png

2. 编写 blog / views.py

d2f47ec517d2ebcb5166f8a66d9922c5.png

3. 编写 blog / urls.py (正则表达式)

eeb5576b2fecde4072dbeca52768830b.png

4. 打开浏览器访问 localhost:8000/blog/article/1 和 localhost:8000/blog/article/2

ca43fd3deea76a96e8130725b0590c8a.png

ca899759d6b5f4c352b13839bdd96328.png

六、编写代码制作新建文章页

  1. 新建 blog / templates / blog / edit_page.html

c204fe02adc0af8f2b4c72625d44078a.png

2. 编写 blog / views.py

d3d2ea67f30cf92b6bfd1005553e58d4.png

3.编写 blog / urls.py

28aa59ae3692b0d63ec6a9b033c0ff20.png

4. 打开浏览器访问 localhost:8000/blog/edit

970ded42e1f9bdd689777cc61b53c45d.png

七、 新建文章页修改进阶

  1. 编写 blog / views.py

7e130cc7549c6ad331141e16eacebb17.png

2. 编写 blog /urls.py

a192240b1f27e1434095b77ed7d34544.png

3. 编写 blog / templates / blog / edit_page.html

23df946a6551b230c6fe2b7f49fa8e04.png

4. 到浏览器访问 localhost:8000/blog/edit/0

f3da87361b6227387819f55b48733a36.png

d78922c2bc80548c1c65a54b366cc267.png

59f87df7ccb8a7996b9e287fb969e036.png

5.到浏览器访问 localhost:8000/blog/edit/3

dced47c8286ef6673572a1e74bbc0765.png

8451b7c86821286a0889a90418c69aed.png

b68016bb5b9701af7b92dd3a7ebaaaa1.png

八、整体修改加链接

  1. index.html 加上链接

6b5d4392eda73944f2baf37b98f20126.png

2. article_page.html 加上链接

e9189d9e63b2847f43d7ebdc5d7f5283.png

3. 访问 localhost:8000/blog/index

效果就是最前面展示的内容了;

叁贰壹:django mysql 中文乱码解决办法​zhuanlan.zhihu.com
9d99c8ffc3d75ce0c28375ace1882d3e.png
叁贰壹:django urls.py 报错解决办法(1)​zhuanlan.zhihu.com
9d99c8ffc3d75ce0c28375ace1882d3e.png

看完这篇文章,小伙伴们,你们有什么想法呢?请在下方留言(欢迎指正错误,大家一起学习讨论,感谢) ^_^

关注我,带你一起写bug(你长得这么好看,不关注我是不是有点可惜呀 ^_^ )

warning :未经授权,不得转载

叁贰壹:django admin 管理工具​zhuanlan.zhihu.com
9d99c8ffc3d75ce0c28375ace1882d3e.png

CSDN & .

CSDN-个人空间​me.csdn.net
043635a7dc973d1490b020ffef53d2fd.png
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值