Git

一、协同开发

1.应用场景

在公司中,都是多人共同开放同一个项目

  • 组长:本地创建空项目,写好底层代码,提交到远程仓库
  • 组员:共同开发开发这个项目

2.我们开发的过程

  • 把远程仓库的代码clone到本地
    • 方案一:在pycharm中
      • Get from Version Control 中配置 clone 的 URL
    • 方案二:找一个位置
      • 打开 git bash here
      • 执行 git clone 远程地址
      • 使用pycharm打开
    • 本地代码运行不起来:可能是因为依赖没装好,数据库链接不对
  • 写代码,提交到本地版本库,push到远端即可(先拉后推,减少冲突)

3.总结:多人开发同一项目

  • 作为项目创建者:在本地把底层代码写好,创建远程仓库,把其他开发者在远程仓库中设为开发者
  • 作为协同开发者:登录进去,就能看见项目,链接远程仓库,clone远程仓库到本地,push新的代码

二、解决冲突

1.多人同一分支开发出现冲突

  • 出现冲突的原因

    • 其他人和我们改了同样的代码,但是他先把代码提交到仓库了

    • 此时我们的本地的版本号就不是最新的了,要先pull,再push

    • 冲突的表现

      <<<<<<< HEAD
      print('lqz') 
      ================================================  # 上面是你的代码
      print('lqz is handsome')
      >>>>>>> f67f73948d175b186cd5f1319d7602fe004e285c  # 别人代码
      
    • 修改代码到不报错

    • 重新提交到本地版本库,push到远端

2.分支合并出现冲突

1.新建dev分支,并切换到dev分支
	git branch dev 
    git checkout dev
2.dev分支修改dev.py 第一行,提交到版本库
	# 在第一行加入print
    git add .
    git commit -m '修改了dev第一行'
    
3.修改dev分支的home/views.py 最后一行
	# 在views.py最后一行加入注释
    git add.
    git commit -m '修改了home/view的最后一行'
    
4.切换回master分支,修改 dev.py第一行 和 home/view.py最后一行,提交到版本库
	git checkout master
    # 在dev第一行加入 print('master ddd')
    # 在home/view.py最后一行加入 # master来了
    git add .
    git commit -m 'master修改了dev的第一行和home/view的最后一行'
    
5.合并代码,会出冲突,解决,提交
	git merge dev 
    # 会出冲突
        1.在dev
            <<<<<<< HEAD
            print('master ddd')
            =======
            print('zhang zzz')
            >>>>>>> dev
        2.在home/view
            <<<<<<< HEAD
            # master来了
            =======
            # 哈哈哈,又改了
            >>>>>>> dev
        # 把该删的删掉
     git add .
     git commit -m '解决冲突'
	 git push origin master

三、线上分支合并(pr/mr)

操作

  1. 在Gitee上点击操作,建立分支dev

  2. 把远程分支拉倒本地:git pull origin dev

  3. 拉下来但是看不到,切换到dev分支:git checkout dev

  4. 本地dev提交到远端:git push origin dev

  5. 远程合并分支:把dev合并到master

    • 提交pull request 的申请(pr/mr)
    • 领导能看到pr,由领导决定是否合并
    • 确认合并,dev就合并到master了

四、pycharm操作git

# 命令操作git,编辑器pycharm,可以操作git,图形化界面操作
# 以前使用的所有命令,都可以在pycharm中点点点实现

1 .clone

image-20221109113952798

2.git add

image-20221109114106499

3.git commit

image-20221109114155394

image-20221109114331243

4. git push

image-20221109114504843

5.git pull

image-20221109114643937

6. git branch操作

image-20221109115120455

7. 查看git操作记录 git log

image-20221109115451627

8. 本地代码跟版本库比较

image-20221109115602355

image-20221109120249463

五、为开源项目贡献代码

  1. 看到开源项目,点fork,你的仓库就有这个开源项目了
  2. 在本地拉去【你仓库】fork的代码
  3. 你继续写,提交到自己远程仓库
  4. 提交pr合并,如果作者同意,你就可以合并进去

前端

一、前端首页组件编写

  1. HomeView.vue 页面组件

    <template>
      <div class="home">
        <Header></Header>
        <Banner></Banner>
        <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
        <Footer></Footer>
      </div>
    </template>
    
    <script>
    import Header from '@/components/Header'
    import Banner from '@/components/Banner'
    import Footer from '@/components/Footer'
    
    export default {
      name: 'HomeView',
      data() {
        return {}
      },
      components: {
        Header, Banner, Footer
      }
    
    }
    </script>
    
  2. Header.vue 头部组件

    <template>
      <div class="header">
        <div class="slogan">
          <p>老男孩IT教育 | 帮助有志向的年轻人通过努力学习获得体面的工作和生活</p>
        </div>
        <div class="nav">
          <ul class="left-part">
            <li class="logo">
              <router-link to="/">
                <img src="../assets/img/head-logo.svg" alt="">
              </router-link>
            </li>
            <li class="ele">
              <span @click="goPage('/free-course')" :class="{active: url_path === '/free-course'}">免费课</span>
            </li>
            <li class="ele">
              <span @click="goPage('/actual-course')" :class="{active: url_path === '/actual-course'}">实战课</span>
            </li>
            <li class="ele">
              <span @click="goPage('/light-course')" :class="{active: url_path === '/light-course'}">轻课</span>
            </li>
          </ul>
    
          <div class="right-part">
            <div>
              <span>登录</span>
              <span class="line">|</span>
              <span>注册</span>
            </div>
          </div>
        </div>
      </div>
    
    </template>
    
    <script>
    export default {
      name: "Header",
      data() {
        return {
          url_path: sessionStorage.url_path || '/',
        }
      },
      methods: {
        goPage(url_path) {
          // 已经是当前路由就没有必要重新跳转
          if (this.url_path !== url_path) {
            // 传入的参数,如果不等于当前路径,就跳转
            this.$router.push(url_path)
          }
          sessionStorage.url_path = url_path;
        },
      },
      created() {
        sessionStorage.url_path = this.$route.path
        this.url_path = this.$route.path
      }
    }
    </script>
    
    <style scoped>
    .header {
      background-color: white;
      box-shadow: 0 0 5px 0 #aaa;
    }
    
    .header:after {
      content: "";
      display: block;
      clear: both;
    }
    
    .slogan {
      background-color: #eee;
      height: 40px;
    }
    
    .slogan p {
      width: 1200px;
      margin: 0 auto;
      color: #aaa;
      font-size: 13px;
      line-height: 40px;
    }
    
    .nav {
      background-color: white;
      user-select: none;
      width: 1200px;
      margin: 0 auto;
    
    }
    
    .nav ul {
      padding: 15px 0;
      float: left;
    }
    
    .nav ul:after {
      clear: both;
      content: '';
      display: block;
    }
    
    .nav ul li {
      float: left;
    }
    
    .logo {
      margin-right: 20px;
    }
    
    .ele {
      margin: 0 20px;
    }
    
    .ele span {
      display: block;
      font: 15px/36px '微软雅黑';
      border-bottom: 2px solid transparent;
      cursor: pointer;
    }
    
    .ele span:hover {
      border-bottom-color: orange;
    }
    
    .ele span.active {
      color: orange;
      border-bottom-color: orange;
    }
    
    .right-part {
      float: right;
    }
    
    .right-part .line {
      margin: 0 10px;
    }
    
    .right-part span {
      line-height: 68px;
      cursor: pointer;
    }
    </style>
    
  3. Banner.vue 轮播图组件

    <template>
      <div class="banner">
        <el-carousel :interval="5000" arrow="always" height="400px">
          <el-carousel-item v-for="item in bannerList" :key="item.title">
            <div v-if="item.image.indexOf('http')==-1">
              <router-link :to="item.link"><img :src="item.image" alt=""></router-link>
            </div>
            <div v-else>
              <a :href="item.link"><img :src="item.image" alt=""></a>
            </div>
    
          </el-carousel-item>
        </el-carousel>
    
      </div>
    
    </template>
    
    <script>
    export default {
      name: "Banner",
      data() {
        return {
          bannerList: []
        }
      },
      created() {
        this.$axios.get(this.$settings.BASE_URL + 'home/banner/').then(res => {
          this.bannerList = res.data.result
    
        })
      }
    }
    </script>
    
    <style scoped>
    .el-carousel__item {
      height: 400px;
      min-width: 1200px;
    }
    
    .el-carousel__item img {
      height: 400px;
      margin-left: calc(50% - 1920px / 2);
    }
    
    .el-carousel__item h3 {
      color: #475669;
      font-size: 18px;
      opacity: 0.75;
      line-height: 300px;
      margin: 0;
    }
    
    .el-carousel__item:nth-child(2n) {
      background-color: #99a9bf;
    }
    
    .el-carousel__item:nth-child(2n+1) {
      background-color: #d3dce6;
    }
    </style>
    
  4. Footer.vue 尾部组件

    <template>
      <div class="footer">
        <ul>
          <li>关于我们</li>
          <li>联系我们</li>
          <li>商务合作</li>
          <li>帮助中心</li>
          <li>意见反馈</li>
          <li>新手指南</li>
        </ul>
        <p>Copyright © luffycity.com版权所有 | 京ICP备17072161号-1</p>
      </div>
    </template>
    
    <script>
    export default {
      name: "Footer"
    }
    </script>
    
    <style scoped>
    .footer {
            width: 100%;
            height: 128px;
            background: #25292e;
            color: #fff;
        }
    
        .footer ul {
            margin: 0 auto 16px;
            padding-top: 38px;
            width: 810px;
        }
    
        .footer ul li {
            float: left;
            width: 112px;
            margin: 0 10px;
            text-align: center;
            font-size: 14px;
        }
    
        .footer ul::after {
            content: "";
            display: block;
            clear: both;
        }
    
        .footer p {
            text-align: center;
            font-size: 12px;
        }
    </style>
    

二、首页轮播图功能前后打通

  1. Banner.vue

    <template>
      <div class="banner">
        <el-carousel :interval="5000" arrow="always" height="400px">
          <el-carousel-item v-for="item in bannerList" :key="item.title">
            <div v-if="item.image.indexOf('http')==-1">
              <router-link :to="item.link"><img :src="item.image" alt=""></router-link>
            </div>
            <div v-else>
              <a :href="item.link"><img :src="item.image" alt=""></a>
            </div>
    
          </el-carousel-item>
        </el-carousel>
    
      </div>
    
    </template>
    
    <script>
    export default {
      name: "Banner",
      data() {
        return {
          bannerList: []
        }
      },
      created() {
        this.$axios.get(this.$settings.BASE_URL + 'home/banner/').then(res => {
          this.bannerList = res.data.result
    
        })
      }
    }
    </script>
    
    <style scoped>
    .el-carousel__item {
      height: 400px;
      min-width: 1200px;
    }
    
    .el-carousel__item img {
      height: 400px;
      margin-left: calc(50% - 1920px / 2);
    }
    
    .el-carousel__item h3 {
      color: #475669;
      font-size: 18px;
      opacity: 0.75;
      line-height: 300px;
      margin: 0;
    }
    
    .el-carousel__item:nth-child(2n) {
      background-color: #99a9bf;
    }
    
    .el-carousel__item:nth-child(2n+1) {
      background-color: #d3dce6;
    }
    </style>
    

后端

一、登录注册功能设计

  1. 账号/手机号/邮箱 + 密码登录 接口
  2. 手机号+验证码登录 接口
  3. 发送手机验证码 接口 (第三方发送短信)
  4. 注册 接口(手机号,验证码,密码)
  5. 判断手机号是否存在 接口

补充

1.cgi、fastcig、WSGI、uwsgi、uWSGI

cgi:

  • 通用网关接口(Common Gateway Interface/CGI)是一种重要的互联网技术。可以让客户端,从网页浏览器向执行在网络服务器上的程序请求数据

  • CGI描述了服务器和请求处理程序之间传输数据的一种标准。

  • 一句话总结: 一个标准,定义了客户端服务器之间如何传数据

fastcig:

  • 快速通用网关接口(Fast Common Gateway Interface/FastCGI)是一种让交互程序与Web服务器通信的协议
  • FastCGI是早期通用网关接口(CGI)的增强版本
  • 一句话总结: CGI的升级版
  • 常用的fastcgi软件
    Apache HTTP Server (部分):LAMP LNMP
    Nginx(主流):nginx是一个符合fastcgi协议的软件,处于浏览器和web程序之间,主要做请求转发和负载均衡,也可以称之为服务器中间件
    Microsoft IIS:windows server

WSGI

  • Web服务器网关接口(Python Web Server Gateway Interface,缩写为WSGI)是为Python语言定义的Web服务器和Web应用程序或框架之间的一种简单而通用的接口。自从WSGI被开发出来以后,许多其它语言中也出现了类似接口

  • 一句话总结: 为Python定义的web服务器和web框架之间的接口标准

1.wsgiref:性能很低,python实现的,django内置了,测试阶段用,上线不用
2.uWSIG:性能高,c实现的
3.gunicorn:python实现的
4.uWSGI:符合wsgi协议的web服务器,上面标准的具体实现
5.uwsgi:uWSGI服务器,自有协议

2.Apache

  • Apache 公司
  • Apache web服务器
  • Apache 开源协议
    • Kafka :apache顶级开源项目
    • echars:原来是百度开发的,交给了apache孵化

原文地址:http://www.cnblogs.com/Zhang614/p/16875453.html

1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长! 2. 分享目的仅供大家学习和交流,请务用于商业用途! 3. 如果你也有好源码或者教程,可以到用户中心发布,分享有积分奖励和额外收入! 4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解! 5. 如有链接无法下载、失效或广告,请联系管理员处理! 6. 本站资源售价只是赞助,收取费用仅维持本站的日常运营所需! 7. 如遇到加密压缩包,默认解压密码为"gltf",如遇到无法解压的请联系管理员! 8. 因为资源和程序源码均为可复制品,所以不支持任何理由的退款兑现,请斟酌后支付下载 声明:如果标题没有注明"已测试"或者"测试可用"等字样的资源源码均未经过站长测试.特别注意没有标注的源码不保证任何可用性