Django+MongoDB实现个人博客管理后台(一)

一、打开pycharm新建Django项目
Django+MongoDB实现个人博客管理后台(一)_第1张图片
初始目录如下:
Django+MongoDB实现个人博客管理后台(一)_第2张图片
启动项目之后,点击链接,如果能跳转到如下界面,则说明项目创建成功:
Django+MongoDB实现个人博客管理后台(一)_第3张图片
Django+MongoDB实现个人博客管理后台(一)_第4张图片
二、创建静态文件夹,保存静态文件
创建如下文件夹:
Django+MongoDB实现个人博客管理后台(一)_第5张图片
修改配置文件settings.py
1、在文件末尾添加如下内容:
Django+MongoDB实现个人博客管理后台(一)_第6张图片
2、在文件中找到MIDDLEWARE,注释第四行:
Django+MongoDB实现个人博客管理后台(一)_第7张图片

三、引入JQuery等文件
目录结构如下:
Django+MongoDB实现个人博客管理后台(一)_第8张图片
四、实现登录注册功能
在Blog文件夹下,新建views.py文件
Django+MongoDB实现个人博客管理后台(一)_第9张图片
在views.py中,编写返回登录界面的函数:
Django+MongoDB实现个人博客管理后台(一)_第10张图片
在templates文件夹下,新建index.html文件
Django+MongoDB实现个人博客管理后台(一)_第11张图片
在urls.py文件中,进行登录页面注册:
Django+MongoDB实现个人博客管理后台(一)_第12张图片
在index.html进行jquery等文件的引用:
Django+MongoDB实现个人博客管理后台(一)_第13张图片

在/static/js文件夹下面,新建site.js文件,并在index.html页面,进行引用:
Django+MongoDB实现个人博客管理后台(一)_第14张图片

site.js 文件内容如下:
Django+MongoDB实现个人博客管理后台(一)_第15张图片
在views.py中,编写生成验证码的方法:
Django+MongoDB实现个人博客管理后台(一)_第16张图片
在urls.py中,进行生成验证码的方法的路由注册:
Django+MongoDB实现个人博客管理后台(一)_第17张图片
在index.html页面中,编写登录/注册表单,代码如下:
Django+MongoDB实现个人博客管理后台(一)_第18张图片
Django+MongoDB实现个人博客管理后台(一)_第19张图片

在/static/css/和/static/js/文件夹下,分别新建index.css和index.js文件,并在index.html进行引用
Django+MongoDB实现个人博客管理后台(一)_第20张图片
Django+MongoDB实现个人博客管理后台(一)_第21张图片
index.css的代码如下:
Django+MongoDB实现个人博客管理后台(一)_第22张图片
Django+MongoDB实现个人博客管理后台(一)_第23张图片
Django+MongoDB实现个人博客管理后台(一)_第24张图片
Django+MongoDB实现个人博客管理后台(一)_第25张图片
index.js的代码如下:
Django+MongoDB实现个人博客管理后台(一)_第26张图片
Django+MongoDB实现个人博客管理后台(一)_第27张图片
index.html的页面效果如下:
Django+MongoDB实现个人博客管理后台(一)_第28张图片
Django+MongoDB实现个人博客管理后台(一)_第29张图片
连接MongoDB,创建数据库基类
1、下载pymongo
在这里插入图片描述
2、在Blog文件夹下,新建Dbcomn.py文件,内容如下:
Django+MongoDB实现个人博客管理后台(一)_第30张图片
Django+MongoDB实现个人博客管理后台(一)_第31张图片

在index.js中,进行登录/注册判断:
Django+MongoDB实现个人博客管理后台(一)_第32张图片
Django+MongoDB实现个人博客管理后台(一)_第33张图片
Django+MongoDB实现个人博客管理后台(一)_第34张图片
views.py内容如下:
Django+MongoDB实现个人博客管理后台(一)_第35张图片

新增admin.html页面,并进行页面路由注册
Django+MongoDB实现个人博客管理后台(一)_第36张图片
注册功能测试如下:
Django+MongoDB实现个人博客管理后台(一)_第37张图片
Django+MongoDB实现个人博客管理后台(一)_第38张图片
Django+MongoDB实现个人博客管理后台(一)_第39张图片
Django+MongoDB实现个人博客管理后台(一)_第40张图片
登录功能测试如下:
Django+MongoDB实现个人博客管理后台(一)_第41张图片
Django+MongoDB实现个人博客管理后台(一)_第42张图片
账号、密码、验证码输入正确,则跳转到admin页面
Django+MongoDB实现个人博客管理后台(一)_第43张图片
登录功能到此结束

你可能感兴趣的:(Python,django,mongodb,python)