项目简介

飞雪测试平台是我做的一个Django+Vue前后端分离demo项目。主要用于日志管理，主要是兴趣驱动，体验一下全栈研发。顺便记录一下流水线搭建的一些关键代码。

前端地址：https://github.com/tdx1997tdx/my_tapd_frontend
后端地址：https://github.com/tdx1997tdx/my_tapd_backend
demo地址：http://139.198.36.243

流水线建设

对于这个项目建立了4条流水线

前端流水线pipline script

pipeline {agent anystages {stage('git clone') {steps {git credentialsId: 'f4209992-d0c8-4f10-bcea-c5edaa0846f1', url: 'https://github.com/tdx1997tdx/my_tapd_frontend.git'}}stage('npm build') {steps {sh 'npm install'sh 'npm run build'}}stage('copy files to nginx') {steps {sh 'rm -rf /usr/local/nginx/html/*'sh 'cp -r ./dist/* /usr/local/nginx/html/'}}}
}

主要流程就是npm打包出来的产物转移到nginx上

nginx配置流水线pipline script

pipeline {agent anystages {stage('change_conf') {steps {writeFile encoding: 'utf-8', file: '/usr/local/nginx/conf/nginx.conf', text:
'''
worker_processes  1;events {worker_connections  1024;
}http {include       mime.types;default_type  application/octet-stream;sendfile        on;keepalive_timeout  65;#gzip  on;server {listen       80;server_name  139.198.36.243;location / {root   html;index  index.html index.htm;}location /api/ {proxy_pass   http://127.0.0.1:8080;}}
}
'''}}stage('restart nginx') {steps {sh 'systemctl restart nginx.service'}}}
}

对于静态文件直接获取，对于后端接口，也就是api开头的，转发到8080端口

后端流水线pipline script

pipeline {agent anystages {stage('git pull') {steps {git credentialsId: 'f4209992-d0c8-4f10-bcea-c5edaa0846f1', url: 'https://github.com/tdx1997tdx/my_tapd_backend.git'}}stage('start') {steps {sh 'killall gunicorn || true'sh 'JENKINS_NODE_COOKIE=dontKillMe nohup /usr/local/python3/bin/gunicorn my_tapd_backend.wsgi -w 4 -b 0.0.0.0:8080 &'}}}
}

后端数据库初始化流水线pipline script

pipeline {agent anystages {stage('git pull') {steps {git credentialsId: 'f4209992-d0c8-4f10-bcea-c5edaa0846f1', url: 'https://github.com/tdx1997tdx/my_tapd_backend.git'}}stage('migrate') {steps {sh 'pip3 install -r requirements.txt'sh 'python3 manage.py makemigrations'sh 'python3 manage.py migrate'}}}
}

Jenkins搭建前后端分离项目流水线实战相关推荐

php node.js django,Vue.js和Django搭建前后端分离项目示例详解
本篇文章主要介绍了Django+Vue.js搭建前后端分离项目的示例,具有一定参考价值,有兴趣的可以了解一下在写这篇文章的时候,顺带学习了一下关于Markdown的使用方法. 笔者是个渣渣,一切都是 ...
ASP.NET Core 实战：使用ASP.NET Core Web API 和 Vue.js 搭建前后端分离项目
一.前言这几年前端的发展速度就像坐上了火箭,各种的框架一个接一个的出现,需要学习的东西越来越多,分工也越来越细,作为一个 .NET Web 程序猿,多了解了解行业的发展,让自己扩展出新的技能树,对自 ...
基于Vue和Django搭建前后端分离项目
前言最近公司要做一个系统,需要前后端分离,后端使用Django,前端使用Vue,因为之前主要做的是后端开发,前端只会写一写简单的,Vue只会绑定数据,至于Vue怎么与Django结合还是第一次接触, ...
python前后端分离前端权限_Linux上搭建前后端分离项目
一.准备工作 1.准备好服务器 2.Linux上准备搭建环境需要的软件赞赞羊项目需要用到的软件: python.gunicorn.nginx.MySQL.redis 3.开发人员对代码打包前端需要 ...
快速搭建前后端分离项目框架
文章目录效果展示选择模板测试后端测试前端创建后端项目 common gateway admin system 创建前端项目前言:归因于学校的工程实践,要求小组完成一个项目,包括项目的开题报 ...
python+django+vue搭建前后端分离项目Part1
文章目录 Python环境搭建安装django框架创建django项目新建static静态文件夹创建django App(后端) 创建vue项目(前端) 集成vue项目到django 打包vu ...
python+django+vue搭建前后端分离项目Part3——后端django
文章目录创建django项目数据库创建和连接创建 Django APP 后端搭建模型层model.py 视图层view.py 路由配置数据迁移参考文章创建django项目 (my_dja ...
python+Django+vue 搭建前后端分离项目
步骤一 : 创建项目所在文件夹. 步骤二: 进入CMD模式输入 : django-admin startproject backend 步骤三 : 进入backend 步骤四:查看Django后端服务 ...
python+django+vue搭建前后端分离项目Part2——前端Vue
文章目录创建vue项目主要文件及其作用 src/components/ src/router/index.js src/main.js static/ 创建vue项目 (my_django) XX ...

Jenkins搭建前后端分离项目流水线实战

文章目录