📢 活动链接：阿里云-云开发平台 (aliyun.com)

开源应用中心，聚合最热门的开源应用，前端应用一键托管启用、快速部署。

🎨 实验简介

📌📌📌

---

聚合最热门的开源应用🎨🎨🎨

---

开源应用中心聚合了目前最热门的前端开源应用模版，让大家真正可以做到像安装APP一样来上线一个网站。目前已经支持最热门的前端框架，包括Vue.js、React、Nuxt.js、Next.js、AntDesign等，还有内容管理平台Hexo、Docusaurus、VuePress、Sapper等。使用部署开源模版非常适合您的以下场景：

• 个人学习：轻松创建个人主页、博客等网站，边部署边学习。
• 协同开发：创建信息管理系统、CMS等前端项目，多人协同维护开发。

---

开源应用一键同步一键部署 🎨🎨🎨

---

阿里云云开发平台前端应用部署功能旨在为前端开发者改善工作环境，优化前端开发和部署体验。同时还可以结合云开发平台云原生的架构能力和主机应用的部署能力，让前后端应用能够更高效地协同。

• 操作简单： 无需购买服务器、配环境、手动上传文件等，云开发平台都可以帮你自动操作，包括在需要时随时一键上线/下线。

• 使用零成本: 支持GitHub和云效的Codeup仓库，快速将仓库的代码进行构建部署。

• 免费资源扶持: 免费提供临时的测试域名，对于新用户和持续活跃的用户提供免费的云资源加油包。

• 无数量限制: 没有使用的repo数量和应用数量的限制, 不管是开源仓库还是自己账户下的repo，每一个代码repo都可以部署为一个静态网站。

🏆 实验部署——搭建Hexo

🟥一、创建模板应用

参考链接🔗新手建站就用这个方法，无需购买服务器10分钟快速部署你的静态网页-阿里云开发者社区 (aliyun.com)

✅ 1、应用中心模版创建应用

✅ 2、绑定GitHub账号

✅ 3、授权使用

✅ 4、完成绑定

✅ 5、填写相关信息完成创建

🟥 二、在日常环境部署站点

⛳ 1、一键应用部署

⛳ 2、点击“立即部署”

⛳ 3、完成部署

⛳ 4、访问Dinosaurs网站

日常环境的测试域名也是可以访问的，点击访问已部署网站按钮会出现一个弹出，点击弹出上的立即访问就能够访问已经部署好的站点了。在部署完成后，可以继续本地编码，并将代码push到应用的“基本信息”中对应的代码仓库内。

测试域名查找：点击“部署配置” 即可查看到。如下图所示。

点击“高级”，点击此链接继续访问即可打开Hexo。

成功进入

🟥 三、配置自定义域名在线上环境上线

在功能开发验证完成后要在线上环境进行部署，在线上环境的「部署配置」-「自定义域名」中填写自己的域名。例如我们添加一个二级域名 company.workbench.fun 来绑定我们部署的前端应用。然后复制自定义域名下方的API网关地址对添加的二级域名进行CNAME配置。

参考实例

🎈 1、配置线上环境自定义域名

测试域名：release1yjivxr3djrel89rh32.workbenchapi.com

---

自定义域名：xybhexo.xybdiy.tk

---

自定义域名解析到地址：aliyun-wb-hhe7klayud.oss-cn-shanghai.aliyuncs.com

🎁 2、配置CNAME地址

在功能开发验证完成后要在线上环境进行部署，在线上环境的「部署配置」-「自定义域名」中填写自己的域名。例如我们添加一个二级域名 company.workbench.fun 来绑定我们部署的前端应用。然后复制自定义域名下方的API网关地址对添加的二级域名进行CNAME配置。

参考示例

✨（1）进入域名解析列表

✨（2）添加域名

✨（3）添加记录

✨（4）点击“确认”

🎨5、在线上环境部署上线

回到云开发平台的应用详情页面，按照部署的操作，点击线上环境的「部署按钮」，部署完成以后就在你自定义的域名进行了上线。CNAME 生效之后，我们输入 company.workbench.fun（示例网址） 可以打开部署的页面。至此，如何部署一个应用到线上环境，如何绑定自己的域名来访问一个线上的应用就完成了，赶紧部署自己的应用到线上环境，用自己的域名玩起来吧 ；）

参考示例

🥇（1）选择分支管理

💖（2）点击“部署”

💎（3）点击“立即部署”

🥇（4）等待部署完成

💖（5）部署完成

💞（6）输入自定义网址访问

本实验自定义域名地址是： http://xybhexo.xybdiy.tk

🎄 6、请下线不必要的应用

云开发平台本身使用免费，但是对于需要消耗的OSS云资源是收费的，网站上线会根据实际消耗量开始按量计费，对于不需要的应用和网站，请点击「日常环境」和「线上环境」页面最右方的「下线」操作。

至此实验完成。