美文网首页
Python+Django搭建个人博客(2)-Djiago基础

Python+Django搭建个人博客(2)-Djiago基础

作者: DayBreakL | 来源:发表于2020-03-28 22:26 被阅读0次

    为什么用Djiago

    • 免费开源
    • 功能丰富
    • 开发迅速
    • 可拓展性强
    • 模版系统
    • 后台管理

    新建python虚拟环境

    作用:多项目时可能要使用不同版本的包、库

    步骤:

    • 新建一个项目文件夹,比如website
    • 在命令行利用cd命令进入到website
    • 输入python3 -m venv djangoenv
    • 在website文件夹内会出现一个djangoenv文件夹
    • windows输入djangoenv\scripts\activate激活虚拟环境
    • mac输入source djangoenv/bin/activate激活虚拟环境
    • 命令行开头会出现(djangoenv)字样

    安装Django并新建项目

    • 安装Django pip install django

      报错:ERROR: Could not find a version that satisfies the requirement django (from versions: none)
      ERROR: No matching distribution found for django

      • 解决:升级pip命令pip install --upgrade pip
    • 安装完成后输入django-admin startproject my_blog创建网站项目

      其中my_blog是django网站项目的名称,自己命名,注意不要取django或者test之类的名称容易冲突,就会在website文件夹下生产一个my_blog文件夹,

      image
    • 初始化生成文件的用途

      • manage.py 一个在命令行中可以调用的网站管理工具
      • my_blog文件夹下:
        • init.py 告诉python这个文件夹是一个模块
        • setting.py my_blog项目的一些配置
        • urls.py 网站内的各个网址声明
        • wsgi.py web服务器与Django项目的接口
    • 检查Djngo项目是否安装成功

      • cd my_blog

      • python3 manage.py runserver

        如下图,没有报错,红字提示可以暂时忽略:


        image
      • 可访问http://127.0.0.1:8000/

        image

    前端入门

    • 什么是前端?什么是后端

      • 前端:你所能看见的,图、文字
      • 后端:存储、逻辑数据
    • 前端开发用什么?

      • Chrome浏览器调试网站
    • 前端三个重要方面

      • HTML

        • HyperText Markup Language 超文本标记语言
        • 网页最基本的元素
        • 通过标记语言的方式来组织内容(文字、图片、视频)
        • HTML元素解析
          • <开始标签 属性名=属性值>内容<结束标签>

            <p class='info-list'>这是一个段落<\p>

        • 建立一个HTML文件,保存为index.html
          <!DOCTYPE html>
          <html>
          <head>
              <title> 我 的 博 客</title>
          </head>
          <body>
              <h1>静夜思</h1>
              <p>窗前明月光</p>
              <p>疑似地上霜</p>
              <p>举头望明月</p>
              <p>低头思故乡</p>
          </body>
          </html> 
          
      • CSS

        • Cascading Style Sheets 样式层叠表

        • 它定义一个网页该如何显示里面的元素,比如这个段落在左边还是右边,这段文字是什么颜色、字体等。

        • 建立一个css文件,保存为index-style.css

          p {
              color:blue;
              font-family:KaiTi;
          }
          
        • 建立css与html的联系,在index.html的<title>下添加<link>

          <!DOCTYPE html>
          <html>
          <head>
              <title> 我 的 博 客</title>
              <!--建立css与html的联系-->
              <link rel="stylesheet" type="text/css" href="index-style.css"> 
          </head>
          <body>
              <h1>静夜思</h1>
              <p>窗前明月光</p>
              <p>疑似地上霜</p>
              <p>举头望明月</p>
              <p>低头思故乡</p>
          </body>
          </html> 
          
        • css解析

          选择器{
              属性名:属性值;
          }
          
        • id与class
          - id在每个html文件只有一个
          - class可以有多个

        • 盒子模型


          image
          • 内容及盒子边框中间是padding,即内边距
          • 边框与边框外其他元素之间是margin,即外边距
      • JavaScript

        • 主要用于前端的编程语言

        • 为网站提供动态、交互效果

        • 建立一个js文件,保存为index.js

          //定义一个字符串变量
          var alertText="hello world";
          //在网页弹出一个提示框
          alert(alertText);
          
        • 建立js与html的关系,同<link>标签一样,在<title>下加一个<script>标签

          <script type="text/javascript" src="index.js"></script>

    作业

    image

    相关文章

      网友评论

          本文标题:Python+Django搭建个人博客(2)-Djiago基础

          本文链接:https://www.haomeiwen.com/subject/xojeuhtx.html