设计样式
安装并集成Bootstrap3
pip install django-bootstrap3
- 在项目中配置bootstrap3,打开settings.py文件,在INSTALLED_APPS中添加如下代码
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'learning_logs',
'users',
'bootstrap3',
]
- 配置jQuery,在settings.py的末尾添加如下代码
BOOTSTRAP3 = {
'include_jquery': True,
}
修改base.html
{% load bootstrap3 %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Learning Logs</title>
{% bootstrap_css %}
{% bootstrap_javascript %}
</head>
<body>
<nav class="navbar navbar-default navbar-static-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed"
data-toggle="collapse" data-target="#navbar"
aria-expanded="false" aria-controls="navbar">
</button>
<a class="navbar-brand" href="{% url 'learning_logs:index' %}">Learning Log</a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a href="{% url 'learning_logs:topics' %}">Topics</a></li>
</ul>
</div>
<ul class="nav navbar-nav navbar-right">
{% if user.is_authenticated %}
<li><a>Hello, {{ user.username }}.</a></li>
<li><a href="{% url 'users:logout' %}">log out</a></li>
{% else %}
<li><a href="{% url 'users:register' %}">register</a></li>
<li><a href="{% url 'users:login' %}">log in</a></li>
{% endif %}
</ul>
</div>
</nav>
<div class="container">
<div class="page-header">
{% block header %} {% endblock header %}
</div>
<div>
{% block content %} {% endblock content %}
</div>
</div>
</body>
</html>
设计其他页面,以edit_entry为例,其他大同小异
{% extends "learning_logs/base.html" %}
{% load bootstrap3 %}
{% block header %}
<h2>Edit entry.</h2>
{% endblock header %}
{% block content %}
<p>
<a href="{% url 'learning_logs:topic' topic.id %}">{{ topic }}</a>
</p>
<form action="{% url 'learning_logs:edit_entry' entry.id %}" method="post" class="form">
{% csrf_token %}
{% bootstrap_form form %}
{% buttons %}
<button name="submit" class="btn btn-primary">save changes</button>
{% endbuttons %}
</form>
{% endblock %}
部署项目
注册并安装所需工具
pip install dj-database-url
pip install dj-static
pip install static3
pip install gunicorn
pip install psycopg2
pip freeze > requirements.txt
- 指定Python运行时环境:在manage.py所在目录新建runtime.txt,添加python版本号
python-3.10.0
修改相关配置
if 'HOME' in os.environ and os.environ['HOME'] == '/app':
import dj_database_url
DATABASES = {
'default': dj_database_url.config(default='postgres://localhost')
}
SECURE_PROXY_SSL_HEADER = ('HTTP_X_FORWARDED_PROTO', 'https')
ALLOWED_HOSTS = ['plutors.herokuapp.com']
DEBUG = False
PROJECT_DIR = os.path.dirname(os.path.abspath(__file__))
STATIC_ROOT = 'staticfiles'
STATICFILES_DIRS = (
os.path.join(PROJECT_DIR, 'static'),
)
- 在manage.py所在目录新建Procfile,输入如下内容。不能使用原书的内容,否则无法启动应用
web: gunicorn learning.wsgi --log-file - --log-level debug
python manage.py collectstatic --noinput
manage.py migrate
import os
from django.core.wsgi import get_wsgi_application
from dj_static import Cling
os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'learning.settings')
application = Cling(get_wsgi_application())
- 在项目目录下,新建static文件夹,并添加placeholder.txt,添加如下内容
This file ensures that learning/static/ will be added to the project.
Django will collect static files and place them in learning/static/.
使用Git
git config --global user.name "xxx"
git config --global user.email "xxx@xxx.com"
ll_env/
__pycache__/
*.sqlite3
git init
git add .
git commit -am "Ready for deployment to heroku."
git status
把项目推送到Heroku
heroku login -i
heroku create
git push heroku main
heroku ps
heroku open
设置数据库
heroku run python3 manage.py migrate
优化Heroku部署
heroku run bash
python manage.py createsuperuser
exit
heroku apps:rename xxx
- 确保实时项目的安全性,打开settings.py,修改如下内容并提交:
ALLOWED_HOSTS = ['plutors.herokuapp.com']
DEBUG = False
- 关闭Heroku应用,把dynos设为0即可,重新启动只需设为1
heroku ps:scale web=0
heroku ps:scale web=1
|