Elinkcloud 发表于 2022-3-21 16:17:30

Django之入门 CMDB系统 (二) 前端模板

Django之入门 CMDB系统(二) 前端模板前言作者: 何全,github地址: https://github.com/×××   QQ交流群: ×××
通过此教程完成从零入门,能够独立编写一个简单的CMDB系统。
目前主流的方法开发方式,分为2种:mvc 和 mvvc方式。本教程为 mvc 方式,即 django负责渲染html。后面会推出 mvvc(前后端分离)的入门教程。
教程项目地址: https://github.com/×××/husky/
教程文档地址: https://github.com/×××/husky/tree/master/doc

前端模板inspinia 2.9 model (加上面的QQ群 群共享有) bootstrap3    前端框架项目创建 static文件,将前端模板里面的 css,font-awesome,fonts,js ,复制到static下面.(对于里面用不到的 js插件,可以根据自己的需求,删除掉,节省体积)
settings文件 增加
STATICFILES_DIRS = (    os.path.join(BASE_DIR, 'static'),)pip3 install -rrequirements.txt    ## 安装所有模块,如有增加模块,需要加到这里面templates 增加 base模板文件。具体可以参考 https://github.com/×××/husky/tree/master/templates/base
base_css.html   加载css_footer.html    页脚_js.html      加载js_nav.html   左槽导航栏_navbar-static-top.html   顶部信息展示base.html    基础模板模板文件重点解析base.html{% load staticfiles %}加载静态文件{% load static %}       {% load bootstrap3 %}<!DOCTYPE html><html lang="en"><head>    <meta charset="utf-8">    <meta name="viewport" content="width=device-width, initial-scale=1.0">    <title>{% blocktitle %} {% endblock %}</title> 标题    {% include"base/_css.html" %}            整体默认加载css    {% block header-css %}       网页单独加载css部分    {% endblock %}</head><body><div id="wrapper">    {% include "base/_nav.html" %}   加载 导航条    <div id="page-wrapper" class="gray-bg">      {% include"base/_navbar-static-top.html" %}    加载顶部      {% block page-content %}   网页中间内容         {% endblock %}      {% include"base/_footer.html" %}   加载 页脚    </div></div></body>{% include"base/_js.html" %}{% block footer-js %}   网页单独加载js部分{% endblock %}</html>index.html例子{% extends "base/base.html" %}   加载base.html {% load static %}{% blocktitle %} 首页{% endblock %}   标题{% block header-css %}可以写本页面需要的css{% endblock %}{% block page-content %}    <div class="wrapper wrapper-content">欢迎使用本项目!    </div>{% endblock %}{% block footer-js %}可以写本页面需要的js{% endblock %}
页: [1]
查看完整版本: Django之入门 CMDB系统 (二) 前端模板