Article / 文章中心

无需购买服务器10分钟快速部署一个静态网页

发布时间:2021-12-10 点击数:550


    

阿里如此开发渠道重磅推出开源运用中心,聚合最抢手的开源运用,让你像装置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 挑选运用中心恣意模版创立运用

  • 挑选运用中心恣意模版创立运用。假如您之前没有运用过云开发渠道,会出现云资源授权办理的选项,往下拉出现直至赞同授权的字样,点击「赞同授权」后出现授权成功,点击进入「下一步」。

1.png

  • 绑定GitHub账号。授权完结后挑选来历库房为GitHub,依照提示点击去绑定,绑定GitHub帐号,登录后并点击Authorize AliyunWorkbench允许云开发渠道构建、发布你的GitHub代码为可拜访的网站。 绑定完结后回来运用创立页面,代码库房依照默许「模板库房」以及默许主干分支不用操作,并点击「下一步」。

2.png

  • 填写运用信息完结创立。填写必要的的运用信息完结创立(咱们已供给默许装备),成功后进入到运用概况和布置界面。初次登录并没有可选所属生产线,点击右侧主动创立产品线即可。

3.png

2.2 运用自己的库房运用创立

  • 挑选自己库房里需求布置的运用。除了能够运用运用中心的模版创立网站,云开发渠道也支撑运用本地代码或许开源代码创立静态网站。与经过模版中心的运用创立的区别在于,在绑定Gihutb之后挑选“自己的库房”,找到上一步自己创立的GitHub库房及master分支。然后在运用概况页面依据以上的步骤持续填写即可。

4.png

  • 设定布置装备。当布置的是您自己的代码库房时,开发渠道需求您依据具体代码进行简略装备来布置成功:
    1. 编写build.sh:代码从源码,经过npm打包编译等进程,到生成为朴实HTML/CSS/JS静态文件的全进程的shell指令,需求被完好填写到发布分支根途径下的build.sh文件中,例如:

5.png

6.png

不知道如何操作?您也可直接点击一次“布置”按钮,之后,对默许生成的build.sh内容进行恣意修正:


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

8.png

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

9.png

c. 调整装备:当您完结上述步骤后,发现自己的代码依然布置错误时,需检查排查布置日志,对上面的build.sh和布置资源途径进行修正。常见的几种布置错误情况如下:

10.png

11.png

3. 在日常环境布置站点


  • 一键进行运用布置。在运用概况页面点击日常环境的「布置」按钮进行一键布置,布置状况变成绿色已布置今后能够点击拜访布置网站检查作用。

12.png

  • Dinosaurs网站日常环境布置好了。日常环境的测试域名也是能够拜访的,点击拜访已布置网站按钮会出现一个弹出,点击弹出上的当即拜访就能够拜访现已布置好的站点了。在布置完结后,能够持续本地编码,并将代码push到运用的“基本信息”中对应的代码库房内。

13.png

4. 装备自定义域名在线上环境上线


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

14.png

  • 装备CNAME地址。仿制好 API网关域名地址后,来到你自己的域名办理渠道(此示例中的域名办理是阿里云的域名办理控制台,请去自己的域名控制台操作)。添加记载的「记载类型」挑选「CNAME」,在「主机记载」中输入你要创立的二级域名,这儿咱们输入「company」,在「记载值」中粘贴咱们之前仿制的 API网关域名地址,「TTL」保留默许值或许设置一个你以为合适的值即可。

15.png


  • 在线上环境布置上线。回到云开发渠道的运用概况页面,依照布置的操作,点击线上环境的「布置按钮」,布置完结今后就在你自定义的域名进行了上线。CNAME 收效之后,咱们输入 company.workbench.fun(示例网址) 能够翻开布置的页面。至此,如何布置一个运用到线上环境,如何绑定自己的域名来拜访一个线上的运用就完结了,赶紧布置自己的运用到线上环境,用自己的域名玩起来吧 ;)

16.png

当即体会收取两层好礼


第一个使命:运用阿里云账号登录云开发渠道,创立团队和赞同渠道运用协议,仅云开发渠道新用户能够完结。

第二个使命:布置开源运用中心列表页恣意一个运用,并绑定自己的个人域名在线上环境上线。

第三个使命:点击前往云开发小课页面浏览页面即可。

17.png

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

完结全部3个使命即可收取桌面不锈钢保温杯收取资历,打卡使命状况有必定延时,请完结后刷新。活动期间(12月15日-12月22日)每个工作日150个,上午10点发放,领完为止。假如当天奖品现已领完,能够先完结打卡使命,第二天按时来收取即可!

18.jpeg19.jpeg

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

云开发渠道为新用户供给了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. 本活动最终的解释权归阿里巴巴集团一切。