主要还是介绍在win10上面的操作过程
主要用的技术:python3.8;django2
编辑器/ide:vscode、sublime——text、powershell、web
python开发,虚拟环境第一步。
PS F:\demo> virtualenv env --no-site-packages
Using base prefix 'd:\\program files\\python\\python38-32'
New python executable in F:\demo\env\Scripts\python.exe
Installing setuptools, pip, wheel...
done.
PS F:\demo>
准备静态资源
这里主要还是在模板之家、github等等网站上找到一个自己中意的前端静态网站
比如我再模板之家找的:
静态文件存在我的github上哦:
可以先利用这个下载然后跟着教程一起使用哦。
之后我们再根据我们的需求更改前端样式,当有有些小框框还是要自己做的。感觉是cv其实在后面我们建站的过程中,整个静态资源都被我们重构了。
创建apps和index加载静态资源
首先创建一个apps,来储存之后加载的各个app
(env) PS F:\demo\django_blog> mkdir apps
(env) PS F:\demo\django_blog> ls
目录: F:\demo
Mode LastWriteTime Length Name
---- ------------- ------ ----
d----- 2019/12/23 7:51 apps
d----- 2019/12/23 7:08 django_blog
-a---- 2019/12/23 7:08 0 db.sqlite3
-a---- 2019/12/23 7:04 558 manage.py
进入项目文件夹创建第一个app,index,用来加载我们整个网站的基础静态资源
(env) PS F:\demo\django_blog> python .\manage.py startapp index
(env) PS F:\demo\django_blog> ls
目录: F:\demo\django_blog
Mode LastWriteTime Length Name
---- ------------- ------ ----
d----- 2019/12/23 7:51 apps
d----- 2019/12/23 7:08 django_blog
d----- 2019/12/23 7:26 index
-a---- 2019/12/23 7:08 0 db.sqlite3
-a---- 2019/12/23 7:04 558 manage.py
之后再将app——index移动到apps
(env) PS F:\demo\django_blog> mv .\index\ .\apps\
在index文件夹中创建static和templates文件夹,用来存放前端静态资源样式:
并且将主目录下的templates导入到系统访问的templates目录中,同理导入static目录:
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',
],
},
},
]
# 静态文件收集
STATICFILES_FINDERS = (
'django.contrib.staticfiles.finders.AppDirectoriesFinder',
'django.contrib.staticfiles.finders.FileSystemFinder',
'compressor.finders.CompressorFinder',)
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
(env) PS F:\demo\django_blog\apps\index> ls
Mode LastWriteTime Length Name
---- ------------- ------ ----
d----- 2019/12/23 7:26 migrations
d----- 2019/12/23 7:39 static
d----- 2019/12/23 7:39 templates
-a---- 2019/12/23 7:26 66 admin.py
-a---- 2019/12/23 7:26 90 apps.py
-a---- 2019/12/23 7:26 60 models.py
-a---- 2019/12/23 7:26 63 tests.py
-a---- 2019/12/23 7:26 66 views.py
-a---- 2019/12/23 7:26 0 __init__.py
解压我们之前下载好的静态文件:
我们将静态资源中的js、css、images文件夹全部复制到static中
并将静态资源的所有html文件全部复制到templates中:
(env) PS F:\demo\django_blog\static> ls
目录: F:\demo\django_blog\static
Mode LastWriteTime Length Name
---- ------------- ------ ----
d----- 2019/12/23 7:45 css
d----- 2019/12/23 7:45 fonts
d----- 2019/12/23 7:45 images
d----- 2019/12/23 7:45 js
(env) PS F:\demo\django_blog\templates> ls
目录: F:\demo\django_blog\templates
Mode LastWriteTime Length Name
---- ------------- ------ ----
-a---- 2018/8/20 11:00 24497 about-2.html
-a---- 2018/8/20 11:00 25597 about.html
-a---- 2018/8/20 11:00 28849 author.html
-a---- 2018/8/20 11:00 30416 blog-2-column.html
-a---- 2018/8/20 11:00 27182 blog-3-column.html
-a---- 2018/8/20 11:00 28514 blog.html
-a---- 2018/8/20 11:00 22673 category.html
-a---- 2018/8/20 11:00 21561 galleries.html
-a---- 2018/8/20 11:00 37272 index.html
-a---- 2018/8/20 11:00 35178 index2.html
-a---- 2018/8/20 11:00 38199 index3.html
-a---- 2018/8/20 11:00 32703 other-features.html
-a---- 2018/8/20 11:00 39411 single-post.html
然后我们修改settings的默认文件:
对语言和时间进行重新赋值:
LANGUAGE_CODE = 'zh-hans' # 有改动
TIME_ZONE = 'Asia/Shanghai' # 有改动
将我们生成的index加载到settings的apps中:
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
#apps
'apps.index',
]
修改完毕后在修改一下数据库:
(env) PS F:\demo\django_blog> python manage.py migrate
Operations to perform:
Apply all migrations: admin, auth, contenttypes, sessions
Running migrations:
Applying contenttypes.0001_initial... OK
Applying auth.0001_initial... OK
Applying admin.0001_initial... OK
Applying admin.0002_logentry_remove_auto_add... OK
Applying contenttypes.0002_remove_content_type_name... OK
Applying auth.0002_alter_permission_name_max_length... OK
Applying auth.0003_alter_user_email_max_length... OK
Applying auth.0004_alter_user_username_opts... OK
Applying auth.0005_alter_user_last_login_null... OK
Applying auth.0006_require_contenttypes_0002... OK
Applying auth.0007_alter_validators_add_error_messages... OK
Applying auth.0008_alter_user_username_max_length... OK
Applying auth.0009_alter_user_last_name_max_length... OK
Applying sessions.0001_initial... OK
在demo\django_blog\django_blog>下的urls中修改当我们访问主页的时候,加载apps.index.urls:
from django.contrib import admin
from django.urls import path
from django.conf.urls import include
urlpatterns = [
path('admin/', admin.site.urls),
# index
path('', include('apps.index.urls'), name='index'),
]
为了让主页有东西可以展示,我们在index文件夹中的models.py文件中添加友链的类:
from django.db import models
import re
# Create your models here.
# 友情链接表
class FriendLink(models.Model):
name = models.CharField('网站名称', max_length=50)
description = models.CharField('网站描述', max_length=100, blank=True)
link = models.URLField('友链地址', help_text='请填写http或https开头的完整形式地址')
logo = models.URLField('网站LOGO', help_text='请填写http或https开头的完整形式地址', blank=True)
create_date = models.DateTimeField('创建时间', auto_now_add=True)
is_active = models.BooleanField('是否有效', default=True)
is_show = models.BooleanField('是否首页展示', default=False)
class Meta:
verbose_name = '友情链接'
verbose_name_plural = verbose_name
ordering = ['create_date']
def __str__(self):
return self.name
def get_home_url(self):
"""提取友链的主页"""
u = re.findall(r'(http|https://.*?)/.*?', self.link)
home_url = u[0] if u else self.link
return home_url
def active_to_false(self):
self.is_active=False
self.save(update_fields=['is_active'])
def show_to_false(self):
self.is_show = True
self.save(update_fields=['is_show'])
因为我们是将index这个app拿出来放到了apps文件夹中,所以在apps.py中修改:
from django.apps import AppConfig
class IndexConfig(AppConfig):
name = 'apps.index'
admin.py中修改,加载友链设置到admin中,到时候我们可以访问admin界面来添加数据:
from django.contrib import admin
from .models import FriendLink
# Register your models here.
# # 自定义管理站点的名称和URL标题
admin.site.site_header = '网站管理'
admin.site.site_title = '博客后台管理'
@admin.register(FriendLink)
class FriendLinkAdmin(admin.ModelAdmin):
list_display = ('name', 'description', 'link', 'create_date', 'is_active', 'is_show')
date_hierarchy = 'create_date'
list_filter = ('is_active', 'is_show')
在index中创建urls.py文件:
New-Item urls.py
写入以下代码
from django.conf.urls import url
from .views import IndexView
app_name='blog'
urlpatterns = [
# 首页
url(r'^$', IndexView.as_view(template_name='index.html'), name='index'), # 主
]
同时在index中的views.py中添加:
from django.shortcuts import render
from django.views import generic
from django.conf import settings
# Create your views here.
class IndexView(generic.ListView):
template_name = 'index.html'
生成数据库中的表:
(env) PS F:\demo\django_blog> python .\manage.py makemigrations
Migrations for 'index':
apps\index\migrations\0001_initial.py
- Create model FriendLink
(env) PS F:\demo\django_blog> python .\manage.py migrate
Operations to perform:
Apply all migrations: admin, auth, contenttypes, index, sessions
Running migrations:
Applying index.0001_initial... OK
以后每次创建修改models文件都需要进行数据迁移:python .\manage.py makemigrations
和 python .\manage.py migrate
那为了使静态界面index加载到web中我们还需要修改views文件:
from django.shortcuts import render
from django.views import generic
from django.conf import settings
from .models import FriendLink
# Create your views here.
class IndexView(generic.ListView):
model = FriendLink
template_name = 'index.html'
context_object_name = 'test'
最后运行项目
python manage.py runserver
就可以看到加载的html界面了。但是没有css样式和js?!,那我们需要在html中进行修改,使用django前端的模板函数,只需要修改加载css和js的方式就可以了:
<!DOCTYPE html>
<html lang="en-US">
{% load static %}
<head>
<title>Eskimo - HTML Template</title>
<!-- META TAGS -->
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="description" content="">
<meta name="keywords" content="">
<!-- CSS FILES -->
<link href="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet">
<link href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css" />
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick-theme.css">
<link href="{% static 'css/style.css' %}?v=20191223.09" rel="stylesheet" type="text/css">
</head>
=================html代码
<!-- JS FILES -->
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<script src="https://cdn.bootcss.com/salvattore/1.0.9/salvattore.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script>
<script src="{% static 'js/panel.js' %}"></script>
<script src="{% static 'js/reading-position-indicator.js' %}"></script>
<script src="{% static 'js/custom.js' %}"></script>
<script src="js/custom.js"></script>
加载到这里我们可以了解到,前端html代码想要访问静态资源必须加载static文件,并通过模板函数进行访问。
我们再次运行网站可以看到有了基本的显示了:
利用cdn进行加速
另外可以看到,我把许多本地资源修改成了cdn服务器的资源,这是为了利用cdn来对网站进行加速
根据传统的网络结构,用户的访问流程基本如下:
-
用户在自己的浏览器中输入要访问的网站的域名
-
浏览器向本地DNS请求对该域名的解析
-
本地DNS将请求发到网站授权的DNS服务器
-
授权DNS将服务器的IP地址作为解析结果送给本地DNS
-
本地DNS将解析结果返还给用户,同时将该解析结果保存在自己的缓存中,直到相应的TTL(生存周期)过期,才再向网站的授权DNS请求解析
-
用户在得到IP地址后,向该地址所指向的网站的服务器进行访问;
上述传统的访问模式存在着如下几个严重影响互联网用户的访问效率和质量的环节:
-
首先,传统的DNS解析过程在将网站主机域名转换为IP地址时,并不预先判断该服务器是否正常工作;即使该服务器已经宕机不能提供服务了,用户的请求仍将被发往这台服务器,造成服务的中断。
-
其次,互联网从诞生的第一天起,就缺乏一个专门的中央管理结构,也缺乏统一的产品和技术标准。这一点曾是互联网得以迅速发展的优势。但是,随着互联网的规模越来越大,这一点造成了众多不同网络结构并存的局面。不同网络间的兼容以及不同网络运营商/ISP之间的传输瓶颈等问题使得数据的流通受到限制。据统计,现有互联网上的平均传输速率不高于30Kbps。
-
另外,现有的互联网以数据包传输为基础,任何一个数据包的丢失或出错都必须重新发送,而平均一个重传过程需要3秒钟,从而导致延迟。并且现有的HTTP协议也有诱发延迟的因素,据调查,完整下载一个网页,需要在用户和服务器之间往返20~100次。
-
最后,现有的路由技术以路由器工作状态的历史数据为依据来确定当前数据包的传输路径,无法真实反应当前的路由和网络连接状况。这往往会导致数据传输所经过的路径并不是当前的最佳路径。而且,众多的路由器和交换机不但使数据传输的时间延迟增大,还会增加出错的几率,因为任何一个路由器出现问题都会影响到整个传输过程。
下载github 0x00分支的源码:https://github.com/Freen247/django_blog/tr...
初始前端文件存储在:https://github.com/Freen247/django_blog/tr...
本作品采用《CC 协议》,转载必须注明作者和本文链接
© 著作权归作者所有
相关热门文章
发表评论