阿里云云开发平台重磅推出开源应用中心,聚合最热门的开源应用,让你像安装app一样快速上线一个网站。面向新人和持续活跃的开发者用户推出上线激励加油包,最高100元无门槛代金券免费送,现在体验还能够领取年轻人的养生神器,桌面不锈钢保温杯!

聚合最热门的开源应用

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

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

云开发平台同样面向广大的开源作者征集应用,对于热门的应用我们能够提供现金激励、以及流量曝光等扶持。

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

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

  • 操作简单: 无需购买服务器、配环境、手动上传文件等,云开发平台都可以帮你自动操作,包括在需要时随时一键上线/下线。
  • 使用零成本: 支持GitHub和云效的Codeup仓库,快速将仓库的代码进行构建部署。
  • 免费资源扶持: 免费提供临时的测试域名,对于新用户和持续活跃的用户提供免费的云资源加油包。
  • 无数量限制: 没有使用的repo数量和应用数量的限制, 不管是开源仓库还是自己账户下的repo,每一个代码repo都可以部署为一个静态网站。

简单几步使用云开发平台上线静态应用

1. 账号准备工作

  • 你需要一个阿里云账号,并使用阿里云账号登录云开发平台 (https://workbench.aliyun.com/),按照提示创建团队,点击同意协议。没有阿里云账号就在登录页面注册一个继续登录。
  • 拥有Github账号 (https://github.com/),没有就注册一个。为保证最好的使用体验,请使用Chrome浏览器。
  • 未开通阿里云OSS的用户,点击链接 (https://workbench.aliyun.com/product/open?code=oss)开通OSS服务。OSS开通免费,有一定的免费额度,超过额度之后按量付费。

2. 创建应用

2.1 选择应用中心任意模版创建应用

  • 选择应用中心任意模版创建应用。 如果您之前没有使用过云开发平台,会出现云资源授权管理的选项,往下拉出现直至同意授权的字样,点击「同意授权」后出现授权成功,点击进入「下一步」。

  • 绑定GitHub账号。 授权完成后选择来源仓库为GitHub,按照提示点击去绑定,绑定GitHub帐号,登录后并点击Authorize AliyunWorkbench允许云开发平台构建、发布你的GitHub代码为可访问的网站。 绑定完成后返回应用创建页面,代码仓库按照默认「模板仓库」以及默认主干分支不用操作,并点击「下一步」。

  • 填写应用信息完成创建。 填写必要的的应用信息完成创建(我们已提供默认配置),成功后进入到应用详情和部署界面。首次登录并没有可选所属生产线,点击右侧自动创建产品线即可。

2.2 使用自己的仓库应用创建

  • 选择自己仓库里需要部署的应用。除了可以使用应用中心的模版创建网站,云开发平台也支持使用本地代码或者开源代码创建静态网站。与通过模版中心的应用创建的区别在于,在绑定Gihutb之后选择“自己的仓库”,找到上一步自己创建的GitHub仓库及master分支。然后在应用详情页面根据以上的步骤继续填写即可。

  • 设定部署配置。 当部署的是您自己的代码仓库时,开发平台需要您根据具体代码进行简单配置来部署成功:

    1. 编写build.sh:代码从源码,经过npm打包编译等过程,到生成为纯粹HTML/CSS/JS静态文件的全过程的shell指令,需要被完整填写到发布分支根路径下的build.sh文件中,例如:

不知道如何操作?您也可直接点击一次“部署”按钮,之后,对默认生成的build.sh内容进行任意修改:

b. 填写静态文件相对目录:在build.sh执行后,从代码生成出的静态文件所在的相对目录,需要被填写到“部署配置-资源路径”中。

Tip:例如React应用(如图),一般会填写“./build”;Vue应用则一般为“./dist”。

c. 调整配置:当您完成上述步骤后,发现自己的代码仍然部署错误时,需查看排查部署日志,对上面的build.sh和部署资源路径进行修改。常见的几种部署错误情况如下:

3. 在日常环境部署站点

  • 一键进行应用部署。 在应用详情页面点击日常环境的「部署」按钮进行一键部署,部署状态变成绿色已部署以后可以点击访问部署网站查看效果。

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

4. 配置自定义域名在线上环境上线

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

  • 配置CNAME地址。 复制好 API网关域名地址后,来到你自己的域名管理平台(此示例中的域名管理是阿里云的域名管理控制台,请去自己的域名控制台操作)。添加记录的「记录类型」选择「CNAME」,在「主机记录」中输入你要创建的二级域名,这里我们输入「company」,在「记录值」中粘贴我们之前复制的 API网关域名地址,「TTL」保留默认值或者设置一个你认为合适的值即可。

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

立即体验领取双重好礼

第一个任务:使用阿里云账号登录云开发平台,创建团队和同意平台使用协议,仅云开发平台新用户可以完成。

第二个任务:部署开源应用中心列表页任意一个应用,并绑定自己的个人域名在线上环境上线。

第三个任务:点击前往提交你最想在开源应用中心看到的开源应用,可以是从现有列表中的应用,也可以是开源应用中心还没有上线的应用,我们收到你的需求后会优先上线。

一重礼:桌面不锈钢保温杯

完成全部3个任务即可领取桌面不锈钢保温杯领取资格,打卡任务状态有一定延时,请完成后刷新。活动期间(12月15日-12月22日)每个工作日150个,上午10点发放,领完为止。如果当天奖品已经领完,可以先完成打卡任务,第二天准时来领取即可!


二重礼:免费云资源激励加油包

云开发平台为新用户提供了10元无门槛加油包,在活动页面完成相应的新手任务即可领取。

针对使用云开发平台上线个人或者企业站点的用户,可以申请领取100元的无门槛加油券。申请的用户需要满足两个条件,1.通过云开发平台上线了个人或者实际使用的网站,2. 撰写一篇基于云开发平台上线该网站的经验分享文章。工作人员会在收到申请后的60天完成审核,请确保站点保持在线上。

详细活动规则

活动对象:阿里云官网注册的已实名认证用户
活动时间:2021.12.15-2021.12.22
活动网址:https://workbench.aliyun.com/app

  1. 用户需要完成指定的所有打卡任务才可以领取奖品,同一用户限领一次。活动期间奖品每天发放150个,周六除外,每天上午10都会新补仓奖品,当日奖品领完以后可以次日再来领取,先到先得,发完即止。
  2. 实物奖品以实物为准,颜色随机,图片仅供参考,活动结束后15个工作日内发货。如果由于疫情影响,导致实物奖品发货时间不确定,请留意活动群的公告信息。
  3. 10元代金券奖品需要在新手加油包页面完成新手任务以后才可以领取。100元代金券需要按照表单填写进行申请,工作人员会在收到申请后的60天完成审核,请确保站点保持在线上。如果在60天内审核当天网站无法访问,将会造成无法通过审核。
  4. 阿里云可以根据活动的实际情况对活动规则进行变动或调整,相关变动或调整将公布在活动页面上,并于公布时即时生效;但不影响用户在活动规则调整前已经获得的权益。
  5. 活动相关问题可以钉钉扫码加入云开发的活动群或者搜索钉钉群号: 34096194加入。
  6. “同一用户”,是指根据不同阿里云账号在注册、登录、使用中的关联信息,阿里云判断其实际为同一用户。关联信息举例:同一证件、同一手机号、同一支付账号、同一设备、同一地址等。
  7. “同人账号”,是指同一用户拥有多个阿里云账号的,各个账号之间互为同人账号。
  8. 为保证活动的公平公正,如用户在活动中存在隐瞒、虚构、作弊、欺诈或通过其他非正常手段规避活动规则、获取不当利益的行为,例如:作弊领取、恶意套现、网络攻击、虚假交易等,阿里云有权收回相关权益、取消用户的活动参与资格,撤销违规交易,必要时追究违规用户的法律责任。
  9. 本活动最终的解释权归阿里巴巴集团所有。

本文来自:https://developer.aliyun.com/article/829641

建站就用这个方法,无需购买服务器10分钟快速部署你的静态网页相关推荐

  1. php 建站宝盒 哪个好用,自建站”我太难了“,我选宝盒快速建站

    原标题:自建站"我太难了",我选宝盒快速建站 有想要建设网站的想法,很多人会先尝试自我建站,觉的建设一个网站难度不大,但是到最后才发现,自建站"我太难了",发现 ...

  2. _网站建站基础第十一课(域名解析服务器环境linux安装宝塔)

    在服务器,域名(国内备案)购买好之后,就可以开始搭建网站了,建站要为服务器解析好域名,然后配置好服务器环境,服务器环境就以linux系统+宝塔面板为例给大家演示: 域名备案成功后,进入服务器商的控制台 ...

  3. 【新手建站教学】如何使用成本更低的虚拟主机实现快速建站?手把手教你搭建一个属于自己的网站。

    本篇文章教大家如何使用成本更低的虚拟主机去搭建一个网站. 虚拟主机价格远低于服务器,所以选择虚拟主机建站是个非常不错的选择. 虚拟主机就是一台服务器分出来的小空间,一台虚拟机只能建一个网站,一台服务器 ...

  4. dede服务器建站_织梦教程,网站搭建,网站成功部署教程

    最近做的网站终于上线了,记录一下自己建站的全过程.也给别的想建站的小伙伴提供一些踩坑的经验. 前期准备工作: 1.买域名.普通的com结尾的在60元左右,学生党只是图个新鲜或者搭个博客建议用更便宜的n ...

  5. 无需购买服务器,用cpolar发布本地web网站

    随着互联网的快速发展,网络也成为我们生活中不可缺少的必要条件,为了能在互联网世界中有自己的一片天地,建立一个属于自己的网页就成为很多人的选择.但互联网行业作为资本密集的行业,委托别人建立一个像样的网站 ...

  6. 迅速搭建一个网站(无需购买服务器和域名)

    想要实现标题所说的事实,我们需要GitHub这个工具,先别着急,我们来了解一下GitHub.(希望你可以看到最后,这对于新手来说很有帮助) 1.了解GitHub. GitHub是一个代码托管服务平台, ...

  7. 阿里云服务器几分钟快速建站

    安装宝塔面板 https://www.bt.cn/ 点击立即安装 点击复制然后 在服务器里进行中右键黏贴 安装成功后,输入bt,进入宝塔面板命令行修改密码和用户名 在网页上输入服务器IP:8888(8 ...

  8. 1.个人建站的准备:购买云服务器和域名

    1. 购买服务器和域名 个人网站是我们在网络世界中的自留地,就像在地里我们可以种稻谷.蔬菜.水果,在网站上我们可以分享图片.音乐.感悟,叙述自己的生活.建立个人网站,我们需要购买两个东西:域名和服务器 ...

  9. 怎么使用下载的建站公司网站源码搭建自己的企业网站

    网站源码是指未编译的文本代码或一个网站的全部源码文件,每种网站都有属于自己的建站程序,每种建站程序所用到的源码都是不一样的,专业的技术人员看到源码之后就知道这个网站的质量如何了.下面来说说怎么使用下载 ...

最新文章

  1. Typora输出表情 Typora_Smile
  2. Python 之 matplotlib (十)Image
  3. [device]/proc/devices and /dev/
  4. linux6.4 vnc安装与配置,Oracle Enterprise Linux 6.4 下配置vncserver
  5. CentOS6.7 时间同步
  6. java 中映射关系_java – 在Hibernate中映射一对多的关系?
  7. html图片上加水印,css给图片添加水印
  8. android关于pull解析的问题-1
  9. 新生儿操作系统操作手册
  10. 通过IP地址和子网掩码,如何计算出网络地址、广播地址和主机数?
  11. html文件下载时的header设置
  12. 红色警戒2修改器原理百科(九)
  13. Java 面试简答题
  14. html简单旋转木马
  15. Python数据分析师使用低代码Streamlit实现Web数据可视化方法——Plotly可视化基础篇
  16. Ubuntu 20.04安装微信和QQ,解决微信不能输入中文
  17. GeForce GTX 1050-2G驱动安装
  18. ruby on rails_如何将刺激添加到Ruby on Rails应用程序
  19. PHP 基本语句
  20. python函数中的变量取出来_在Python中从函数调用中提取变量

热门文章

  1. 让vscode更好用
  2. Opencv+Python学习记录7:图像加权和(内附详细代码)
  3. Alien Skin Exposure X7最新2022好用的ps滤镜插件
  4. python+selenium 登录126邮箱
  5. 关于水晶报表中的一些报错解决方法
  6. 产品策划四:App升级系统策划方案
  7. 混合模式程序集是针对“v2.0.50727”版的运行时生成的,在没有配置其他信息的情况下,无法在 4.0 运行时中加载该...
  8. QCon北京2016:企业级云服务技术应用与实践
  9. 无人驾驶感知篇之融合(十一)
  10. android如何制作出一个简单的聊天app