文章目录
- 一、后台项目构建
- 1.1 重构项目目录
- 1.2 需要改动的配置
- 1.3 数据库配置
- 1.4 User配置
- 二、vue前端项目构建
- 2.1 新建vue前端项目
- 2.2 目录介绍
一、后台项目构建
1.1 重构项目目录
- lufei
- manage.py # 项目的主文件, 主入口
- script # 保存项目临时运行的脚本, 文件夹
- logs # 项目运行时/开发时候日志目录
- lufei # 代码主要保存位置, 开发时的代码保存
- apps # 开发者的代码保存目录, 以模块为目录保存
- libs # 第三方类库的保存目录
- settings
- dev.py # 项目开发时的本地配置
- prod.py # 项目上线时的运行配置
- urls.py # 总路由
1.2 需要改动的配置
#1、 在控制台直接指向项目 python manage.py runserver --> manage.py的内容更改
# 将
os.environ.setdefault("DJANGO_SETTINGS_MODULE", "lufei.settings")
# 改为
os.environ.setdefault("DJANGO_SETTINGS_MODULE", "lufei.settings.dev")
# 2、项目上线走的不是mange.py 要改uwsgi.py的同一位置
# 3、国际化
# 将dev.py
LANGUAGE_CODE = 'en-us'
TIME_ZONE = 'UTC'
USE_TZ = True
# 改为
LANGUAGE_CODE = 'zh-hans'
TIME_ZONE = 'Asia/shanghai'
USE_TZ = False
# 4、创建app: startapp在哪里执行, 就把app创建在哪
python ../../manage.py startapp home
# 5、注册app, 会报错 , 在dev.py中加上
# 现在BASE_DIR是内部小的lufei
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
# 把这个路径加入到环境变量里面
import sys
sys.path.insert(0, BASE_DIR)
# 把apps加入到环境变量
sys.path.insert(0, os.path.join(BASE_DIR, 'apps'))
# 在注册app
INSTALLED_APPS = [
'django.contrib.staticfiles',
'home' # 因为apps已经被加到环境变量中了, 所以直接能找到
]
1.3 数据库配置
# 连接mysql
mysql -uroot -p654321
# 创建数据库
create database lufei;
# 创建数据库用户, 并且授予lufei这个库的权限, 用户lufei, 密码lufei123, @'%':所有用户均可访问
grant all privileges on lufei.* to 'lufei'@'%' identified by 'lufei123';
# 刷新权限
flush privileges;
# 项目连接 在dev.py中
DATABASES = {
'default': {
'ENGINE': 'django.db.backends.mysql',
'HOST': 'xxxx',
'PORT': 3306,
'NAME': 'lufei',
'USER': 'lufei',
'PASSWORD': 'lufei123'
}
}
1.4 User配置
# 用户要基于auth的user表, 必须在数据库迁移命令之前操作好, 后期如果再做, 会出错
# 在urls.py中配置, 打开路由
from django.views.static import serve
from django.conf import settings
urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'^media/(?P<path>.*)', serve, {'document_root': settings.MEDIA_ROOT}),
]
# 在apps的user下的models.py中
from django.contrib.auth.models import AbstractUser
class User(AbstractUser):
telephone = models.CharField(max_length=11)
icon = models.ImageField(upload_to='icon', default='icon/default.png')
# 在dev.py中
MEDIA_URL = '/media/'
MEDIA_root = os.path.join(BASE_DIR, 'media') # 现在的BASE_DIR是lufei下的lufei
AUTH_USER_MODEL = 'user.user'
二、vue前端项目构建
2.1 新建vue前端项目
# 1、 安装node, 见安装部署专栏
noed -v
# 2、创建vue工程(需要一个vue脚手架)
npm install -g @vue/cli
# 输入vue会返回一串
#3、创建vue项目
vue create lufei
2.2 目录介绍
public
- favicon.ico # 页面左上角的图标
- index.html # 整个项目的单页面
src:
-assets # 静态文件, js\css\img
- components # 小组件, 头部组件, 尾部组件
- router # 路由相关
- store # vuex相关, 状态管理器, 临时存储数据的地方
- views # 页面组件
- App.vue # 跟组件
- main.py # 配置文件(跟django的setting一样)