Django+Semantic-ui建立Blog网站(一、基本框架)

news/2024/4/27 17:07:00/文章来源:https://blog.csdn.net/weixin_33812433/article/details/88961440

Django应该算是最流行的web应用框架了吧,而语义化的CSS框架semantic-ui我觉得非常好用,使用这个组合做一个blog站点,关于Django的详细介绍以及MTV模式的相关有优点,请翻阅官方文档,很详细,我这边直接开始应用^_^

一、建立Django工程

1.建立项目,创建应用

D:\pythonproject\djangoproject>django-admin startproject blogsiteD:\pythonproject\djangoproject>cd blogsiteD:\pythonproject\djangoproject\blogsite>python manage.py startapp blogD:\pythonproject\djangoproject\blogsite>

clipboard.png

2.在blogsite/setting.py文件中添加应用,并设置templates路径

# Application definitionINSTALLED_APPS = ['django.contrib.admin','django.contrib.auth','django.contrib.contenttypes','django.contrib.sessions','django.contrib.messages','django.contrib.staticfiles','blog',
]####
TEMPLATES = [{'BACKEND': 'django.template.backends.django.DjangoTemplates','DIRS': [os.path.join(BASE_DIR,'templates')],'APP_DIRS': True,'OPTIONS': {'context_processors': ['django.template.context_processors.debug','django.template.context_processors.request','django.contrib.auth.context_processors.auth','django.contrib.messages.context_processors.messages',],},},
]

顺便修改下语言与时区

# 汉语
LANGUAGE_CODE = 'zh-hans'
# 上海时区
TIME_ZONE = 'Asia/Shanghai'

在主目录(manage.py所在文件夹)建立templates模板文件夹,按应用区分模板

在blog目录下创建static存放css与js文件,最终目录:

clipboard.png

目录结构和基本的设置搞定了

2.创建模板文件

先创建主页的文件,我们的最终目标大概是这样

clipboard.png
(比较渣画的。。。)
将下载的semantic-ui文件放入对应的static文件夹

clipboard.png

在templates/blog下创建index.html文件

<!DOCTYPE html>
<html><head><meta charset="utf-8">{% load staticfiles %}<title>Blogsite</title><!-- 使用本地的样式与js文件 --><link rel="stylesheet" href="{% static 'css/semantic.min.css' %}"><script type="text/javascript" src="{% static 'js/semantic.min.js'%}"></script><!-- 也可以直接使用CDN链接 --><!--<link href="https://cdn.bootcss.com/semantic-ui/2.2.13/semantic.min.css" rel="stylesheet"><script src="https://cdn.bootcss.com/semantic-ui/2.2.13/semantic.min.js"></script>--></head><body><!-- 目录结构 --><div class="ui container"><div class="ui secondary pointing menu"><div class="active item"><a href="#">主页</a></div><div class=" item"><a href="#">热门</a></div><div class=" item"><a href="#">我的</a></div><div class="right menu"><div class="item"><div class="ui icon input"><input type="text" placeholder="Search..."><i class="search link icon"></i></div></div><div class="item"><a href="/login" class="ui button">登录</a></div></div></div></div><!-- 隐藏分隔条 --><div class="ui hidden divider"></div><!-- 正文 --><div class="ui container segment"><h3 class="ui header">花木兰</h3><a href="/author-link">作者:钱惟演</a><div class="ui divider"></div><p>城上风光莺语乱,城下烟波春拍岸。绿杨芳草几时休?泪眼愁肠先已断。情怀渐觉成衰晚,鸾镜朱颜惊暗换。昔年多病厌芳尊,今日芳尊惟恐浅。</p></div><div class="ui container segment"><h3 class="ui header">花木兰</h3><a href="/author-link">作者:钱惟演</a><div class="ui divider"></div><p>城上风光莺语乱,城下烟波春拍岸。绿杨芳草几时休?泪眼愁肠先已断。情怀渐觉成衰晚,鸾镜朱颜惊暗换。昔年多病厌芳尊,今日芳尊惟恐浅。</p></div><div class="ui container segment"><h3 class="ui header">花木兰</h3><a href="/author-link">作者:钱惟演</a><div class="ui divider"></div><p>城上风光莺语乱,城下烟波春拍岸。绿杨芳草几时休?泪眼愁肠先已断。情怀渐觉成衰晚,鸾镜朱颜惊暗换。昔年多病厌芳尊,今日芳尊惟恐浅。</p></div><div class="ui container segment"><h3 class="ui header">花木兰</h3><a href="/author-link">作者:钱惟演</a><div class="ui divider"></div><p>城上风光莺语乱,城下烟波春拍岸。绿杨芳草几时休?泪眼愁肠先已断。情怀渐觉成衰晚,鸾镜朱颜惊暗换。昔年多病厌芳尊,今日芳尊惟恐浅。</p></div></body>
</html>

在blog/views.py中添加主页函数:

from django.shortcuts import render# Create your views here.
def index(request):# 模板文件要指明应用路径return render(request, 'blog/index.html')

在blogsite/urls.py中指明主页url

from django.conf.urls import url
from django.contrib import admin
# 不要忘记导入blog中的views
from blog import viewsurlpatterns = [url(r'^admin/', admin.site.urls),# 访问/和/index都将跳转至主页url(r'^$', views.index),url(r'^index/$', views.index,name='home'),
]

OK,在根目录(manage.py目录)运行启动命令

python manage.py runserver

clipboard.png
查看127.0.0.1:8000,或者127.0.0.1:8000/index

clipboard.png
主页显示成功,下一篇介绍用户注册系统

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.luyixian.cn/news_show_818701.aspx

如若内容造成侵权/违法违规/事实不符,请联系dt猫网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

elementui 响应式导航栏网站_响应式网站作用+模板用法科普

随着移动端网站访问需求增加&#xff0c;“响应式网站”越来越受到用户欢迎。到底什么叫响应式网站呢&#xff1f;其实就是网站效果可以随着屏幕尺寸大小而自适应&#xff0c;不会发生变形、扭曲、缺失的现象。不管你是在使用手机、iPad&#xff0c;还是电脑&#xff0c;页面都…

ubuntu环境搭建 php,ubuntu搭建PHP网站完整实例教程

原文是在我自己博客中&#xff0c;小伙伴也可以点阅读原文进行跳转查看&#xff0c;还有好听的背景音乐噢~之前写过两篇关于ubuntu系统搭建php环境的文章在之后的多次实践中&#xff0c;发现有些东西还没有说到&#xff0c;这里就把之后遇到的问题以及方法补充一下&#xff0c;…

Shell脚本一键部署网站服务

以下脚本所涉及到的服务有 IP&#xff1a;dhcp dns&#xff1a;bind Web&#xff1a;apache #!/bin/bash echo "#################################################" echo "## 一键部署dhcpdnsapache服务注意事项 ###" echo "## 1&a…

《大型网站技术架构》核心原理与案例分析

内容简介 本书通过梳理大型网站技术发展历程&#xff0c;剖析大型网站技术架构模式&#xff0c;深入讲述大型互联网架构设计的核心原理&#xff0c;并通过一组典型网站技术架构设计案例&#xff0c;为读者呈现一幅包括技术选型、架构设计、性能优化、Web安全、系统发布、运维监…

AWS S3(vue)+API Gateway+lambda实现无服务网站

0 写在前面的话 公司最近转型serverless要把一些内部CMS和部分外部网站放到AWS上&#xff0c;先简单的实现个S3(vue)API Gatewaylambda的无服务建站的小例子&#xff0c; 感觉一般的网站真心没必要再自己弄EC2了&#xff0c;尤其初创公司&#xff0c;开始公司用户少&#xff0c…

wsdd文件是怎么生成的_这些有趣好玩的免费生成器网站,感觉能玩上一天

创作立场声明&#xff1a;自用推荐&#xff0c;免费网站前言嗨&#xff0c;大家好&#xff0c;我是默咖&#xff0c;一个白天写代码晚上写文章&#xff0c;偶尔做视频的渣渣&#xff01;最近有点懒洋洋&#xff0c;不想写产品的分享&#xff0c;毕竟拍照修图、写稿改稿有时候会…

php网站数据库在哪,【后端开发】php网站怎么查看数据库

php网站查看数据库的方法&#xff1a;推荐&#xff1a;php服务器连接数据库代码&#xff1a;define("DB_HOST","localhost");define("DB_USER","root");define("DB_PWD","");define("DB_NAME","wo…

常见网站漏洞checklist

0x00、写在前面 在做网站渗透之前除了关注一些通用漏洞&#xff0c;这些漏洞通常能很容易的利用扫描器扫出&#xff0c;被WAF所防护 然而有一些逻辑漏洞WAF和扫描器就无法发现了&#xff0c;就需要人工来测试 根据各行业的特点总结了下网站的常见漏洞checklist 0x01、互联网行业…

将网页部署到github服务器上,用Github部署H5网站(无需服务器)

Step1 :登录到自己的Github&#xff0c;查看代码仓库点击“Repositories”进入自己的代码仓库页面&#xff0c;点击“New”&#xff0c;新建一个代码仓库&#xff0c;用来存放将要上传的网页文件。图1 查看代码仓库Step2 :新建代码仓库进入新建代码仓库页面&#xff0c;填写“R…

批量下载某网站的图片

环境&#xff1a;windows7 &#xff0c;Python 3.6.7 &#xff0c;you-get 0.4.1432 &#xff0c;bat 变量说明&#xff1a; for1 chapters 章节 62184 ~ 62210 for2 jpgNum jpg 1~40 for3 fileFolder 存放每个章节的文件夹 1~50 最初的示例图 测试代码 路径内容&a…

学习Linux的博客和资源网站

个人推荐一些优质学习Linux的博客和网站 1、Katacoda - Interactive Learning Platform for Software Engineers 网页版的交互式软件工程师技术学习平台&#xff0c;可在上面学kubernetes 、 docker 、CICD等知识。 2、骏马金龙 - 博客园 博主骏马金龙 &#xff0c;学Lin…

记一次网站无法访问的排查思路

2021年1月15日10:36:06 昨晚19点发生了一排机器&#xff08;不到10台&#xff09;发生了重启&#xff0c;IDC的李工说超融合服务器的存储出问题了。无法远程服务器&#xff0c;访问web服务。我以为中招incaseformat病毒了。在23&#xff1a;30分修复成功&#xff0c;应该是存储…

记一次网站故障排查过程(nginx 504状态码、 upstream timed out (110: Connection timed out)以及jbd2引起IO高

一、问题描述 客户侧反馈无法正常访问系统&#xff0c;页面转圈&#xff0c;时好时坏&#xff0c;访问不稳定。 二、系统环境&#xff1a; 机器环境&#xff1a;UOS 、 nginx 、php&#xff08;对接其他服务器kingbase 、钉钉、redis 、KF&#xff09; ELB&#xff1a;192.…

大型网站限流算法的实现和改造

最近写了一个限流的插件&#xff0c;所以避免不了的接触到了一些限流算法。本篇文章就来分析一下这几种常见的限流算法 分析之前 依我个人的理解来说限流的话应该灵活到可以针对每一个接口来做。比如说一个类里面有5个接口&#xff0c;那么我的限流插件就应该能针对每一个接口就…

Nginx 通过 certbot 为网站自动配置 SSL 证书并续期

目录 一、背景知识1.1、http 和 https 是什么&#xff1f;1.2、SSL/TLS 是什么&#xff1f;1.3、为什么要部署 https&#xff1f;1.4、怎么部署 https 呢&#xff1f;1.5、怎么获得 SSL 安全证书呢&#xff1f;二、Let’s Encrypt 及 Certbot 简介2.1、Authenticators 和 Insta…

部署社区网站,搭建SVN、nginx、PHP,部署MFS并挂载,发布上线

概述&#xff1a; 社交网站的第一个版本部署在LNMP平台之上&#xff0c;前段为Nginx服务器&#xff0c;通过fastcgi协议访问后端的PHP服务器。为了保证数据安全&#xff0c;要求搭建MySQL数据库主从集群。 项目介绍&#xff1a; 本项目案例结合SVN、LNMP和MySQL三种环境&#x…

《大型网站架构技术》系列分享专栏

2019独角兽企业重金招聘Python工程师标准>>> 在这里整理一些大型网站架构方面的技术文章&#xff0c;包括大型网站存储&#xff0c;架构&#xff0c;静态化处理&#xff0c;高并发&#xff0c;高性能方面的问题处理&#xff0c;解决方案等知识 《大型网站架构技术》…

阿里云官方网站免费套餐怎么抢

阿里云推出包含云服务器 ECS、负载均衡、云数据库 RDS、云数据库 Redis 版、云数据库 Mongodb 版、弹性公网 IP、CDN、对象存储 OSS、文件存储 NAS等40核心云产品&#xff0c;6个月免费使用何为免费套餐&#xff0c;其实就是让你先体验&#xff0c;觉得好用&#xff0c;易用&am…

一步步构建大型网站架构

2019独角兽企业重金招聘Python工程师标准>>> 之前我简单向大家介绍了各个知名大型网站的架构&#xff0c;亿万用户网站MySpace的成功秘密、Flickr架构、YouTube网站架构、PlentyOfFish 网站架构学习、WikiPedia技术架构学习笔记。这几个都很典型&#xff0c;我们可以…

html:demo网站学习

学习网站https://www.sc-edu.com 涉及知识如下&#xff1a; 目录HTML < ul> 标签HTML lang 属性HTML 标签的 alt 属性CSS 选择器CSS position绝对定位&#xff1a;absolute relativeCSS background-position 属性CSS3 animation(动画)属性 与 keyframes 规则CSS paddin…