2022 第三届云原生编程挑战赛 --Serverless VSCode WebIDE 使用体验

活动背景

第三届云原生编程挑战赛，是由阿里云、Intel 主办，云原生应用平台、天池联合承办的云原生顶级品牌赛事，主要为热爱技术的年轻人提供一个挑战世界级技术问题的舞台，希望用技术为全社会创造更大价值。活动地址：https://developer.aliyun.com/topic/CloudNative

赛题说明

本次大赛主要继续深度探索服务网格、边缘容器、Serverless 三大热门技术领域，因而围绕这三大热门技术领域设置了三个赛题：

赛题一：针对Sidecar模式下的服务网格数据面应用服务访问QPS和延时的优化

赛题二：针对边缘计算场景的ACK@Edge高效的边缘自治方案

赛题三：实现一个 Serverless 架构的 Web IDE 服务

这里我个人比较感兴趣的是 Web IDE 服务，因为本地电脑开发工具 IDEA 太耗费内存，导致电脑总是挺卡的缘故，个人更感兴趣的是赛题三。赛题组为了让开发者能更容易理解赛题三设置的规则和实现方向，同时也提供给了参赛者相应的实例，那么实例如何体验呢？下面我将带着大家一步一步来体验赛题三相关产品的使用体验。

Serverless VSCode WebIDE 体验

上面说到要体验赛题三大赛组给的实例，那么去哪儿体验呢？，这里有两个体验入口，

体验入口

在赛题三的【赛题说明】页，大家可以看到下图红框标识，点击就可以进入到 Serverless VSCode 示例所在的 github 地址：https://github.com/devsapp/start-serverless-webide

在【serverless-webide 帮助文档】可以找到【部署 &体验】，点击下图 1 处的【一键部署】

就可以跳转到【函数计算 FC】的【Serverless 应用中心】中的创建应用页面，浏览器跳转链接：https://fcnext.console.aliyun.com/applications/create?template=start-serverless-webide 如图

下拉页面点击【创建】，即可完成 Serverless VSCode WebIDE 服务的创建，下面再说另外一个体验入口，第二个体验入口还是在赛题三的赛题说明页面，这里下拉页面到【作品提交说明】，可以看到

点击红框链接就可以跳转到【一分钟体验 Serverless 场景】，链接地址：https://developer.aliyun.com/adc/series/tianchi/alibabacloudnative ，在这里也可以真实体验 Serverless VSCode WebIDE 的强大功能，体验之前呢先简单介绍一下 Serverless VSCode WebIDE

什么是 Serverless VSCode WebIDE

Serverless VSCode WebIDE 是基于 Serverless 架构和 Vscode 的即开即用，用完即走的轻量 Web IDE 服务，全功能 Vscode Web IDE，支持海量的插件；虚拟机级别的多租安全隔离；数据实时保存，不用担心开发过程中电脑问题导致的数据保存不及时而丢失数据的问题；状态实时恢复，秒级恢复到上一应用状态；资源利用率高，低成本，这一点主要是针对资源利用率与收费问题，与常驻型 IDE 费用问题相比低 3-10 倍。

部署 &体验

在部署之前，首先需要到对象存储控制台：https://oss.console.aliyun.com/bucket 创建一个存储桶 Bucket。后面在部署【serverless vscode webide】需要用到对象存储

点击【bucket 列表】选择【创建 bucket】

输入【bucket 名称】，选择【地域】，点击【确定】完成对象存储 bucket 创建

进入【函数计算 FC】控制台，点击【应用】菜单

打开【应用】菜单后选择【通过模板创建应用】--【Web 应用】--【serverless vscode webide】

选中【serverless vscode webide】点击【立即创建】打开创建 serverless vscode webide 应用页面

根据红色提示补充权限后补充对象存储 bucket 信息

点击【创建】可以看到应用部署中

等待几分钟完成部署，

部署成功之后会生成一个访问域名

点击访问域名http://webide.webide-server.1726694951134958.cn-shanghai.fc.devsapp.net/

如果访问域名页面展示的如图

则需要检查一下你创建 OSS 的 bucket 选择的地域与创建模板应用时选择的 region 是否相同，没有问题的情况下会打开 serverless webide 即可在线体验 ide

点击【Open Folder】选择远程目录路径后即可打开开发页面

点击【Open File...】如图

这里我选择【Show Local】

我选择打开本地文件【Open Files...】

开本地文件后，会提示安装一个插件，点击【Install】会出现左上角的安装提示，安装完成之后可以进行正常的代码开发和后续的操作了，这里不再多说了，欢迎体验。

感受

整体部署体验还是很流畅的，操作也很简单，部署了之后就可以体验在线 Webide 开发，

在整个使用过程中，有几点个人觉得还需要通过 2022 云原生编程大赛来广纳百川解决的：

1.目前在线 Web ide 打开本地文件的时候不能打开整个项目，只能选择文件打开；

2.测试类进行测试的时候，不能选择指定方法进行测试，只能点整体执行 java 文件，与本地开发工具 IDEA 使用习惯差太多了，学习成本太高；

3.线上打开本地文件自动保存时没有更新本地文件内容；

虽然目前来说在线 Web ide 体验不是很完善，但是感谢阿里技术的热心奉献让我们看到了在线可用方便的 Web ide 的模型，相信通过这次大赛赛题三专题的设立，可以集思广益丰富 Web ide 的功能，最后一定会让我们在线体验到和本地一样操作习惯，比本地更极速的开发体验。