Introduction to Django CMDB system (2) Front-end template
Introduction to Django CMDB system (2) foreword of front-end template
Author: he Quan, github address: https://github.com/ × × QQ Exchange Group: × × ×
Through this tutorial to complete from scratch, you can write a simple CMDB system independently.
At present, the mainstream methods of development are divided into two types: mvc and mvvc. This tutorial is based on mvc, where django is responsible for rendering html. An introductory tutorial on mvvc (front and rear separation) will be introduced later.
Tutorial project address: https://github.com/ × × / husky/
Tutorial documentation address: https://github.com/ × × / husky/tree/master/doc
Front-end template inspinia 2.9model (shared by the above QQ group) bootstrap3 front-end framework
Create a static file for the project, and copy the css,font-awesome,fonts,js in the front-end template to static. (for js plug-ins that are not used in it, you can delete them according to your own requirements and save volume.)
Settings files increased
STATICFILES_DIRS = (os.path.join (BASE_DIR, 'static'),) pip3 install-r requirements.txt # # install all modules. If there are additional modules, you need to add them to this.
Add base template file to templates. For details, please refer to https://github.com/ × × / husky/tree/master/templates/base.
Base_css.html load css_footer.html footer _ js.html load js_nav.html left slot Navigation Bar _ navbar-static-top.html Top Information Show base.html basic template File focus on parsing base.html {% load staticfiles%} load static file {% load static%} {% load bootstrap3%} {% block title%} {% endblock%} title {% include " Base/_css.html "%} overall default load css {% block header-css%} Web page load css section {% endblock%} {% include" base/_nav.html "%} load navigation bar {% include" base/_navbar-static-top.html "%} load top {% block page-content%} Page Intermediate content {% endblock%} {% include "base/_footer.html"%} load footer {% include "base/_js.html"%} {% block footer-js%} Page load js section {% endblock%} index.html example {% extends "base/base.html"%} load base.html {% load static%} {% block Title%} homepage {% endblock%} title {% block header-css%} you can write the css {% endblock%} {% block page-content%} required by this page. Welcome to this project! {% endblock%} {% block footer-js%} can write the js {% endblock%} required for this page.
