华为云凤凰商城项目实践实验二——持续开发与集成

目录

2.1 代码托管

2.1.1使用 CloudIDE 修改和提交代码

2.1.2使用 Git 分支+合并请求方式提交代码并进行代码检视

2.1.3合并请求(登录模块)

2.2代码检查确保编码规范

2.2.1为示例项目配置代码检查任务并执行

2.2.2分析代码检查结果并修复问题

2.2.3 配置和管理代码检查规则集

2.3使用自动化编译提高代码质量验证速度

2.3.1编译构建并完成应用的镜像打包推送

2.3.2配置持续集成并通过提交代码触发自动化编译

2.3.3使用开源镜像站服务改进自动化编译


2.1 代码托管

目的:了解如何使用 CodeArts 提供的代码托管服务进行源代码管理,并对 Story “作为用户应该可以查看、查询所有门店网络”进行开发,以及如何使用功能分支的方式进行 代码的开发合并。熟练掌握如何使用代码托管服务进行代码管理,如何配置分支策略。

2.1.1使用 CloudIDE 修改和提交代码

学习如何通过 CloudIDE 完成需求"添加门店网络菜单"的代码开发。

①登录 CodeArts,单击"工作>需求管理",进入"Backlog"页面。找到 Story"作为用户 应该可以查看、查询所有门店网络",记录该 Story 的编号。

华为云凤凰商城项目实践实验二——持续开发与集成_第1张图片

点击进入后观察到该story编号为#64966574

②单击左侧导航栏"代码>代码托管",单击代码仓中的phoenix-sample,进入样例项目预置的代码仓库

华为云凤凰商城项目实践实验二——持续开发与集成_第2张图片

单击右上角“IDE Online"进入CloudIDE服务。

④修改代码。等待 CloudIDE 加载完毕后,在左侧导航中找到前端界面代码文件" /vote/templates/index.html"并打开,在 179 行添加菜单"门店网络"。

华为云凤凰商城项目实践实验二——持续开发与集成_第3张图片

④提交修改至代码仓库。单击左侧边栏“源代码管理” ,打开 Git 功能。单击修改文件后方的图标 (git add),将修改内容添加进提交内容当中。

华为云凤凰商城项目实践实验二——持续开发与集成_第4张图片

在输入框中输入提交信息:"fix #工作项编码 本次提交的注释信息" (fix #工作项编码 格式要注意,若不一致则不能将提交信息关联到下一个步骤的提交历史查看 )。

单击打勾图标 (git commit)提交本次修改。单击图标... ,在下拉列表中单击"推送",推送代码到代码仓库。

华为云凤凰商城项目实践实验二——持续开发与集成_第5张图片

⑤查看代码提交记录。返回"代码托管"页面,在 phoenix-sample 代码仓库中选择"动态"页签,即可查看是否提交成功。

华为云凤凰商城项目实践实验二——持续开发与集成_第6张图片

跳转至"工作>需求管理>Backlog"页面,单击 Story"作为用户应该可以查看、查询所有门店网 络"。在"关联"页签中,单击"代码提交记录",也可看到相应提交记录。

华为云凤凰商城项目实践实验二——持续开发与集成_第7张图片

⑥预览调试。回到 CloudIDE 页面,打开 index.html,点击右上角按钮,可预览前端界 面。

华为云凤凰商城项目实践实验二——持续开发与集成_第8张图片

打开 vote 目录下的 app.py 源文件

华为云凤凰商城项目实践实验二——持续开发与集成_第9张图片

右下角出现“Linter pylint is not installed”,点击 “Install”安装

点击左下角选择“Python 3.8.x”版本解释器

华为云凤凰商城项目实践实验二——持续开发与集成_第10张图片

⑦修改 Dockerfile。打开 vote 下 Dockerfile 文件,修改“FROM python:2.7-alpine”为“python:3.7-alpine”。

华为云凤凰商城项目实践实验二——持续开发与集成_第11张图片

⑧终端窗口安装两个运行必须模块:

pip install flask redis --user

华为云凤凰商城项目实践实验二——持续开发与集成_第12张图片

⑨打开app.py替换原有 Python2.7.x 版本代码

导入 import importlib

修改 reload(sys)为 importlib.reload(sys)

删除 sys.setdefaultencoding('utf-8')

华为云凤凰商城项目实践实验二——持续开发与集成_第13张图片

⑩修改完成后右键app.py单击"在终端中运行Python文件"

华为云凤凰商城项目实践实验二——持续开发与集成_第14张图片

出现三行提示表明安装完成

将 app.py 中第 64 行代码中的端口号改为 8088(8000-9000 皆可)

点击右上角运行图标 ,此时前端程序已执行。

华为云凤凰商城项目实践实验二——持续开发与集成_第15张图片

再将对应端口号开放,允许访问:点击Send ,响应后出现 WebDeBug 页签。

本步骤完成端口需改回 80 端口。

2.1.2使用 Git 分支+合并请求方式提交代码并进行代码检视

学习如何通过功能分支以及拉取请求的方式完成用户故事的开发,以及在线代码检视。

①将 master 分支设置为受保护分支。进入项目,单击"代码 > 代码托管", 进入代码托管服务。单击phoenix-sample,进入代码仓库。

②点击“设置”选择策略设置中的“保护分支”

华为云凤凰商城项目实践实验二——持续开发与集成_第16张图片

③单击"新建分支保护",根据需要在弹框中选择配置,单击"确定"保存。

华为云凤凰商城项目实践实验二——持续开发与集成_第17张图片

④管理分支合并策略。进入代码仓库,选择"设置"页签,在左侧导航中单击"策略设置 > 合并请求"。

华为云凤凰商城项目实践实验二——持续开发与集成_第18张图片

选择合入机制为“打分机制”,可以设置为"0"。单击"提交"保存。

华为云凤凰商城项目实践实验二——持续开发与集成_第19张图片

⑤创建分支并进行新功能开发。进入代码仓库,选择"代码"页签,选择“分支”

华为云凤凰商城项目实践实验二——持续开发与集成_第20张图片在“我的分支”中单击右上角"新建+",在弹框中输入分支名称"feature工作项编号" (注意:不要有+号等特殊符号) 命名分支,单击"确定"保存。

华为云凤凰商城项目实践实验二——持续开发与集成_第21张图片

⑥用 CloudIDE 打开代码仓库,选择新创建的分支进入(如果是已打开的 CloudIDE 界面, 可单击页面左下角分支名称,在页面上方的下拉列表中选择刚刚创建分支)。

华为云凤凰商城项目实践实验二——持续开发与集成_第22张图片

可以看到左下角分支名变成了"master"

2.1.3合并请求(登录模块)

新增登录功能为例,使用合并请求

①创建合并请求,进入“代码托管”,选择合并请求页签,单击“新建”。源分支选择刚刚创建的分支,与目标分支选择"master",单击"下一步"。

华为云凤凰商城项目实践实验二——持续开发与集成_第23张图片

输入标题、描述(选填),选择合并人、评审人,单击"确定"完成。"合并人"即接受合并请求的人,"评审人"是由合并发起人邀请参与的评审者。对于不合格的合并请求,管理员可以关闭。在评分不够时,无法完成该合并请求。

华为云凤凰商城项目实践实验二——持续开发与集成_第24张图片

②代码检视以及评分,评审人进入代码仓库后,在"合并请求"页签中找到需要评审的合并 请求,单击该请求,查看合并请求详情。评审者可以在"合并请求"页签中发表评审意 见,对合并请求进行评分。

华为云凤凰商城项目实践实验二——持续开发与集成_第25张图片

也可以在文件变更页签,针对某一行代码发表讨论。评论与讨论的区别在于:评论无需回复并 解决。而讨论是一个需要解决的问题。在评论记录里,可以看到差别。

华为云凤凰商城项目实践实验二——持续开发与集成_第26张图片

开发人员在"合并请求"页面可查评论/讨论记录。

2.2代码检查确保编码规范

随着凤凰商城越来越庞大,线上出现的缺陷以及安全问题也越来越多,修复的成本太大了,其实很多问题是可以在上线之前就应该发现以及修复的。 而且开发人员写代码也比较随性,没有统一标准,我们需要制定一些基本的标准,并对代码进 行持续的静态代码扫描,一旦发现问题立即在迭代内修复。这样才能保证我们上线的应用相对可靠。

将了解如何使用 CodeArts 提供的"代码检查"服务完成针对不同技术栈的代 码静态扫描,问题采集与修复。

2.2.1为示例项目配置代码检查任务并执行

学习如何编辑并执行代码检查任务,完成应用的静态代码检查

①编辑代码检查任务包含语言。进入项目,单击页面上方导航"代码 > 代码检查",进入代码检查服务。单击代码检查任务"phoenix-codecheck-worker",进入"代码检查详情"页面

华为云凤凰商城项目实践实验二——持续开发与集成_第27张图片

②选择"设置"页签,在页面左侧导航中单击"规则集"。规则集中默认包含的语言是" Java"。

华为云凤凰商城项目实践实验二——持续开发与集成_第28张图片

单击“重新获取代码仓库语言”

华为云凤凰商城项目实践实验二——持续开发与集成_第29张图片

在刷新的列表中将 Python 语言对应的开关打开。

③启动代码检查任务。进入代码检查任务"phoenix-codecheck-worker"的"代码检查详情"页面。单击"开始检查",启动代码检查任务。

当页面提示"分支"master"最近一 次检查成功!",表示任务执行成功。

2.2.2分析代码检查结果并修复问题

通过本节,学习如何根据代码检查结果分析代码中存在的问题,并解决代码问题。

①分析代码检查报表。进入代码检查任务"phoenix-codecheck-worker"的"代码检查详情"页面。成功执行代码检查任务,查看检查结果。

华为云凤凰商城项目实践实验二——持续开发与集成_第30张图片

②在代码检查任务"设置 > 质量门禁"页面中,默认配置"致命问题数<=0"和"严重问 题数<=0",从上图可以看出,检查结果不符合门禁要求,因此门禁检查结果显示为" 不通过"。

③单击"代码问题"页签,页面中列出问题的严重级别、状态、所属文件等信息。

华为云凤凰商城项目实践实验二——持续开发与集成_第31张图片

④可根据需要对代码进行修改。例如:下图中的问题,是在代码里 Connection 没有关闭可 能会引起的资源泄漏问题,属于非常严重的问题,需要尽快修复。

⑤单击问题卡片"待处理”,下拉状态栏出现“已解决”和:忽略问题“

华为云凤凰商城项目实践实验二——持续开发与集成_第32张图片

点击问题卡片多选框,可对问题进行能批量处理。

华为云凤凰商城项目实践实验二——持续开发与集成_第33张图片

点击问题帮助,可查看系统对此问题的修改建议。

华为云凤凰商城项目实践实验二——持续开发与集成_第34张图片

2.2.3 配置和管理代码检查规则集

①创建自定义检查规范。进入代码检查服务,选择"规则集"页签,在下拉列表中选择" Java"。

华为云凤凰商城项目实践实验二——持续开发与集成_第35张图片在过滤出的列表中找到规则集"关键检查规则集"单击"复制"图标。

在弹框中输入新规则集名称为"phoenix-java-rule-set",单击"确定"保存。

华为云凤凰商城项目实践实验二——持续开发与集成_第36张图片

②系统自动进入新建规则集的"规则集配置"页面。通过搜索框搜索规则"循环",取消勾选此规则,单击"保存"。由于这里凤凰团队采用了取巧的方案临时支持功能的展示,暂时可以关闭此问题

华为云凤凰商城项目实践实验二——持续开发与集成_第37张图片

③启用自定义检查规范。进入代码检查任务"phoenix-codecheck-worker"的"代码检查 详情"页面。选择"设置"页签,在页面左侧导航中单击"规则集"。在 Java 语言规则集 中,勾选规则集"phoenix-java-rule-set"。

华为云凤凰商城项目实践实验二——持续开发与集成_第38张图片

④启动代码检查任务,任务成功执行后,再次查看检查结果。此时的检查结果忽略了之前取消勾选的规则,检查出来的问题是团队关心的问题,应该尽快修复掉。

华为云凤凰商城项目实践实验二——持续开发与集成_第39张图片

2.3使用自动化编译提高代码质量验证速度

如何创建 "编译构建任务",完成应用的 Docker 镜像打包以及推送。

如何启动持续集成,实现代码变更后自动触发应用的 Docker 镜像打包以及推送。

如何使用华为云提供的"开源镜像站"服务提高依赖包获取速度,提高自动化编译效率。

2.3.1编译构建并完成应用的镜像打包推送

华为云凤凰商城项目实践实验二——持续开发与集成_第40张图片

节以任务"phoenix-sample-ci"为例,学习如何通过"编译构建"服务完成应用的 Docker 镜像打包以及推送。

①查看编译构建任务。进入项目,单击页面左侧导航"持续交付 > 编译构建",进入编译构建服务。找到编译构建任务"phoenix-sample-ci"。

华为云凤凰商城项目实践实验二——持续开发与集成_第41张图片

②单击"phoenix-sample-ci"右侧”...",进入"编辑"页面。

华为云凤凰商城项目实践实验二——持续开发与集成_第42张图片

华为云凤凰商城项目实践实验二——持续开发与集成_第43张图片

③点击"基本信息"栏,选择源码仓库"phoenix-sample", 分支"选择"master"

华为云凤凰商城项目实践实验二——持续开发与集成_第44张图片

④配置 SWR 服务。项目应用镜像存放需要使用到华为云容器镜像服务 (SWR) ,因此需要首先配置 SWR 服务。点击"构建步骤"栏,找到"华为云容器镜像服务"并点击

华为云凤凰商城项目实践实验二——持续开发与集成_第45张图片

此时进入到"容器镜像服务"主页,点击立即使用;

华为云凤凰商城项目实践实验二——持续开发与集成_第46张图片

检查页面左上方的"区域"列表,选择与编译构建任务所在区相同的区域。

单击右上角"登录指令",系统生成并弹框显示 docker login 指令。

华为云凤凰商城项目实践实验二——持续开发与集成_第47张图片

指令中,-u 之后的字符串为用户名,-p 之后的字符串为密码(此为临时用户名和密码, 24 小时刷新,隔天使用需重新查看用户名、密码;最后的字符串为 SWR 服务器地址,此地址即为后续步骤 5 中的参数 dockerServer。

华为云凤凰商城项目实践实验二——持续开发与集成_第48张图片

在左侧导航栏中选择"组织管理",进入"组织管理"页面。单击右上角"创建组织",在弹 框中输入组织名称"hi-pheonix" (或自定义,此名称全局唯一),单击"确定"保存。这里的组织名称,即为后续步骤 5 中的参数 dockerOrg。

华为云凤凰商城项目实践实验二——持续开发与集成_第49张图片

华为云凤凰商城项目实践实验二——持续开发与集成_第50张图片

⑤返回 CodeArts 页面,选择"参数设置"页签,编辑以下两个参数。

⚫ dockerOrg:输入在步骤 4 中创建的组织。

⚫ dockerServer:输入在步骤 4 中记录的内容。

请务必确保这参数 dockerOrg、dockerServer 的输入值是正确的。

华为云凤凰商城项目实践实验二——持续开发与集成_第51张图片

⑥单击"保存并执行",启动编译构建任务。

华为云凤凰商城项目实践实验二——持续开发与集成_第52张图片

系统自动跳转至"编译详情"页面,可以查看任务执行进展。当出现以下页面时,表示任务执行成功。

华为云凤凰商城项目实践实验二——持续开发与集成_第53张图片

请记录"构建成功"字样前面的数字串(即任务的构建编号),该数字串为构建任务中的系统预定义参数 BuildNumber, 在后续步骤 10 查看镜像详情中,镜像版本即此数字串。

⑦单击页面左侧导航"制品仓库>软件发布库 ",进入发布服务。列表中可找到下图所示的两个 文件夹。

华为云凤凰商城项目实践实验二——持续开发与集成_第54张图片

⑧进入 SWR 控制台,在页面左侧导航选择"我的镜像"。列表中可看到 5 个镜像,镜像的所属组织为实验开始创建的组织,版本数如下图所示。

华为云凤凰商城项目实践实验二——持续开发与集成_第55张图片

⑨在列表中单击"worker"查看镜像详情。在镜像列表页签中找到最新版本镜像,镜像版本 与最新一次构建任务的执行编号一致,执行编号的查看方法请参考步骤 6。

华为云凤凰商城项目实践实验二——持续开发与集成_第56张图片

2.3.2配置持续集成并通过提交代码触发自动化编译

通过本节,学习如何启动持续集成,实现代码变更后自动触发应用的 Docker 镜像打包以及推送。

①持续集成配置。进入编译构建任务"phoenix-sample-ci"的"编辑"页面,选择"执行 计划"页签,打开"提交代码触发执行"开关,单击"保存"。

②持续集成执行计划配置。在"执行计划"页签,开启“定时执行”,根据需要设置定时执 行计划,单击"保存"。

华为云凤凰商城项目实践实验二——持续开发与集成_第57张图片

2.3.3使用开源镜像站服务改进自动化编译

通过本节,学习如何使用开源镜像站服务提高依赖包获取速度,提高自动化编译效率。 

通过以下两种配置方式,可以在执行编译构建任务时自动获取开源镜像站中的镜像:

⚫ 方式一:使用系统内置的 Maven 构建、Npm 构建、PyInstaller 构建步骤,系统会自动通过 开源镜像站获取相应的依赖包。

华为云凤凰商城项目实践实验二——持续开发与集成_第58张图片

⚫ 方式二:将镜像源设置为对应的开源镜像站仓库地址配置在代码仓库的配置文件中,查看 方式"代码>代码托管>phoenix-sample>文件"。配置方式有以下三种:

①Python 配置方法

华为云凤凰商城项目实践实验二——持续开发与集成_第59张图片

②NPM 配置方法

华为云凤凰商城项目实践实验二——持续开发与集成_第60张图片

③Nuget 配置方法

华为云凤凰商城项目实践实验二——持续开发与集成_第61张图片

你可能感兴趣的:(华为云凤凰商城项目,华为云)