【腾讯云Cloud Studio 实战训练营】- Cloud Studio 助力Vue项目云端开发

一、前言

作为一个2年开发的前端，一直和后端对接，平时只能写写样式，对一下接口，想到自己提升一下，就看了看后端的视屏，比如跟我对接的后端是Java，对于环境搭建，硬是自己试了几次不行，本人用的是windows，总是提示缺少一些文件。又不想格式化硬件，就这样日复一日，到现在也没有去实践。

再者，后端的同学使用的IDE是IDEA，看看了自己的电脑，装上之后，风扇狂响，Cpu直飙，还是算了吧，不要折腾了。

直接这次我遇到CSDN联合腾讯云举行的活动，发现有一个远程IDE的东西，可以方便的构建环境，跟本地没有任何关系。只需要有网就行，非常好奇，决定来学习一下。

活动说明：

“腾讯云 Cloud Studio 实战训练营”是由腾讯云联合 CSDN 推出的系列开发者技术实践活动，通过技术分享直播、动手实验项目、原创作品征集、有奖征文活动等，让广大开发者沉浸式体验腾讯云开发者工具 Cloud Studio的同时，实现技术实战能力提升。本次活动覆盖多个难度等级、支持当前几乎所有主流编程语言，无论你是技术小白，还是资深开发者，都希望你能有所收获！

在这里插入图片描述

二、Cloud Studio是什么？

在这里插入图片描述

Cloud Studio 是基于浏览器的集成式开发环境（IDE），为开发者提供稳定的云端工作站。在使用 Cloud Studio 时无需安装，打开浏览器即可快速启动项目。底层资源自动弹性扩缩，极大地节省成本，低代码开发省时又省力。

基于 Web 端的代码编辑器：

包含代码高亮、自动补全、Git 集成、终端等 IDE 的基础功能
支持实时调试、插件扩展等，提升开发、编译与部署工作效率 ;

支持远程访问云服务器：

为腾讯云 SCF 行业用户提供开发-测试-部署完整闭环的云原生开发体验 ;

自研多款插件以满足开发需求：

例如协作插件、自定义模板插件、预览插件、部署插件等，助力施展编程潜能。

我们分析一下，我们用了Cloud Studio能带来啥？
第一，我们不需要在本地装笨重的IDE，比如我以前用webstrom进行前端开发，因为太卡了，所以，只能被迫换轻量的vscode IDE，好了很多，而且装了IDE，不仅要对电脑本机的硬件配置有要求，还要对硬盘空间也有要求。

第二，我们不需要在本地装一些笨重的开发环境，比如开发前端要装node，npm，yarn，pnpm等，后端开发要装java虚拟机，java其它的组件。

第三，需要配置符合项目的定制需求，如前端开发，需要配置淘宝镜像源，Java配置环境变量等。

第四，配置Git环境，初始化一些其它配置。

总体下来，需要很多复杂的配置，很多重复的劳动力，十分的不高效。

那使用了Cloud Studio后，我们可以不用再装环境了，直接安装好，非常的实用。而且再也不用好的硬件了，因为也是用的云上的资源。如果标配满足不了，可以升级配置，豪华配置都是可以的。

实操一把：

Vue (发音为 /vjuː/，类似 view) 是一款用于构建用户界面的JavaScript框架。它基于标准HTML、CSS和JavaScript构建，并提供了一套声明式的、组件化的编程模型，帮助开发者高效地开发用户界面。

Vue是一个独立的社区驱动的项目，它是由尤雨溪在2014年作为其个人项目创建， [5] 是一个成熟的、经历了无数实战考验的框架，它是目前生产环境中使用最广泛的JavaScript框架之一，可以轻松处理大多数web应用的场景，并且几乎不需要手动优化，并且Vue完全有能力处理大规模的应用。

Vue.js是一套构建用户界面的渐进式框架，采用自底向上增量开发的设计，核心库只关注视图层。另一方面，Vue完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。

Vue是一个框架，也是一个生态。可以用不同的方式使用Vue：

无需构建步骤，渐进式增强静态的HTML；
在任何页面中作为Web Components嵌入；
单页应用 (SPA)；
全栈/服务端渲染 (SSR)；
Jamstack/静态站点生成 (SSG)；
开发桌面端、移动端、WebGL，甚至是命令行终端中的界面。

在工作的2年中，一直是在使用Vue开发，如下就让我来实际带大家一起操作一把，首先选择准备好的模板。

在这里插入图片描述

点击就会直接打开一个窗口进行初始化：

在这里插入图片描述

在不到几分钟就初始化好了，并且是自动运行起来。

比对上面，我们不用重复的去安装环境，直接使用即可，是不是很简单呢？如果，你从来没有接触过vue，是不是在几分钟也可以初始化一个环境，并且直接上手进行开发呢？

修改文案的时候，可以做实时调试。

在这里插入图片描述

可以进行停止这个空间，在这里也可以查看所有的空间。

在这里插入图片描述

如果觉得配置不行，也可以进行配置的升级。

在这里插入图片描述

java尝试一下

Java是一门面向对象的编程语言，不仅吸收了C++语言的各种优点，还摒弃了C++里难以理解的多继承、指针等概念，因此Java语言具有功能强大和简单易用两个特征。Java语言作为静态面向对象编程语言的代表，极好地实现了面向对象理论，允许程序员以优雅的思维方式进行复杂的编程。

Java具有简单性、面向对象、分布式、健壮性、安全性、平台独立与可移植性、多线程、动态性等特点。Java可以编写桌面应用程序、Web应用程序、分布式系统和嵌入式系统应用程序等。

在这里插入图片描述

可以看到直接有从腾讯云的网址进行下载，速度非常的快。

Downloaded from nexus-tencentyun: http://mirrors.tencent.com/nexus/repository/maven-public/org/ow2/asm/asm-util/8.0/asm-util-8.0.jar (85 kB at 51 kB/s)
Downloading from nexus-tencentyun: http://mirrors.tencent.com/nexus/repository/maven-public/org/checkerframework/checker-compat-qual/2.5.5/checker-compat-qual-2.5.5.jar
Downloaded from nexus-tencentyun: http://mirrors.tencent.com/nexus/repository/maven-public/com/google/guava/listenablefuture/9999.0-empty-to-avoid-conflict-with-guava/listenablefuture-9999.0-empty-to-avoid-conflict-with-guava.jar (2.2 kB at 1.3 kB/s)

在这里插入图片描述

我们快速了写了一个接口，可以看到非常的方便。

接下来让我们来学习一下Spring框架。

Spring框架简介：

Spring为JavaEE开发提供了一个轻量级的解决方案，主要表现为：

IOC（或者叫做DI）的核心机制，提供了bean工厂（Spring容器），降低了业务对象替换的复杂性，提高了组件之间的解耦。
AOP的将一些通用任务，如安全、事务、日志等集中进行管理，提高了复用性和管理的便捷性
ORM和DAO提供了与第三方持久层框架的良好整合，简化了底层数据访问。
提供了优秀的Web MVC框架。
可以说Spring是贯穿表现层、业务层、持久层，为javaEE提供一站式解决方案的框架。此外，使用Spring还有如下好处，低侵入设计，代码污染极低。
基于Spring框架的应用，可以独立于各种应用服务器，实现 write once, run anywhere,
Spring可以与第三方框架良好整合（如ORM,DAO等模块与其他框架整合），但同时Spring提供了高度开放性，应用不会被强制依赖Spring，开发者可以自由选择Spring的部分或者全部。

在这里插入图片描述

不能同时开2个空间。

在这里插入图片描述

启动之后，可以看到画面。

在这里插入图片描述

而且这里要说明一下，在家里也可以用网址打开，非常方便，不用在公司部署一套，在家里也部署一套，厉害。

在这里插入图片描述

Cloud Studio使用场景

快速启动项目：使用 Cloud Studio 的预置环境，您可以直接创建对应类型的工作空间，快速启动项目进入开发状态，无需进行繁琐的环境配置。
实时调试网页：Cloud Studio 内置预览插件，可以实时显示网页应用。当您的代码发生改变之后，预览窗口会自动刷新，这样您就可以在 Cloud Studio 内实时开发调试网页了。
远程访问云服务器： Cloud Studio 支持您连接自己的云服务器，这样就可以在编辑器中查看云服务器上的文件，进行在线编程和部署工作。

在这里插入图片描述

总结：

Cloud Studio ，是一个基于浏览器的集成式开发环境（IDE），为开发者提供了一个永不间断的云端工作站。用户在使用 Cloud Studio 时无需安装，随时随地打开浏览器就能在线编程。

Cloud Studio 作为在线 IDE，包含代码高亮、自动补全、Git 集成、终端等 IDE 的基础功能，同时支持实时调试、插件扩展等，可以帮助开发者快速完成各种应用的开发、编译与部署工作。