体验简介

本场景介绍使用函数计算服务搭建一个Vuepress博客。使用Serverless Devs命令行工具可以将很多框架、应用、案例一键部署到函数计算平台中。

背景知识

本场景主要涉及以下云产品和服务：

● 函数计算（FunctionCompute）

函数计算是事件驱动的全托管计算服务。使用函数计算，您无需采购与管理服务器等基础设施，只需编写并上传代码。函数计算为您准备好计算资源，弹性地可靠地运行任务，并提供日志查询、性能监控和报警等功能。函数计算帮助您无需管理服务器（Serverless），仅专注于函数代码就能快速搭建应用。函数计算能够弹性地伸缩，您只需要按使用量付费。
函数计算Serverless服务和自建服务相比有以下优点：

○ 上手简单，只专注业务逻辑开发，极大提高工程开发效率。
○ 自建方案有太多学习和配置成本，例如针对不同场景，ESS需要做各种不同的参数配置系统环境的维护升级麻烦等。
○ 免运维，函数执行级别粒度的监控和告警。
○ 毫秒级弹性扩容，保证弹性高可用，同时能覆盖延迟敏感和成本敏感类型。

● 对象存储OSS

对象存储OSS是一款海量、安全、低成本、高可靠的云存储服务，提供99.9999999999%(12个9)的数据持久性，99.995%的数据可用性。多种存储类型供选择，全面优化存储成本。

● CDN

CDN通过广泛的网络节点分布，提供快速、稳定、安全、可编程的全球内容分发加速服务，支持将网站、音视频、下载等内容分发至接近用户的节点，使用户可就近取得所需内容，提高用户访问的响应速度和成功率。

● Serverless Devs开发者工具

Serverless Devs是一个组件化与插件化的Serverless开发者平台，开发者可以在平台中可插拔式的使用不同Serverless的服务和框架，同时可参与组件和插件的开发。无论是工业级的Serverless服务，还是各类开源的Serverless框架，Serverless Devs都可友好支持。开发者无需对市面上每一款Serverless工具进行研究和学习，只需通过Serverless Devs，就可以简单、快捷的“上手”主流Serverless服务和框架。

● Vuepress
Vuepress是一款轻量级的前端博客系统。更多信息请参见Vuepress文档。

创建资源

前往阿里云云起实验室开通获取ECS资源,

开通函数计算服务

在使用函数计算前，您需要开通函数计算服务。

说明 ：

本场景中提供的阿里云子账号无函数计算服务操作权限，所以请使用您自己的阿里云账号操作。您无需担心扣费问题，因为函数计算服务有一定的免费额度，请参见计费方式。

1. 使用您自己的阿里云账号登录阿里云控制台，然后进入函数计算详情页。
2. 单击免费开通。

1. 阅读《函数计算服务协议》勾选同意服务协议，最后单击立即开通。

1. 看到如下页面表示开通成功。

开通CDN服务

在使用CDN服务前，您需要开通CDN服务。

说明 :

本场景中提供的阿里云子账号无CDN服务操作权限，所以请使用您自己的阿里云账号操作。CDN具体计费说明请参见计费方式。

1. 使用您自己的阿里云账号登录阿里云控制台，然后进入CDN服务详情页 。
2. 单击立即开通。

1. 阅读《内容分发网络CDN服务协议》勾选同意服务协议，最后单击立即开通。

1. 看到如下页面表示开通成功。

安装Serverless Devs命令行工具

1. 安装Node.js环境。

   1. 执行如下命令，下载Node.js安装包。

wget https://npm.taobao.org/mirrors/node/v12.4.0/node-v12.4.0-linux-x64.tar.xz

1. 执行如下命令，解压安装包并重命名。

tar -xvf node-v12.4.0-linux-x64.tar.xz && mv node-v12.4.0-linux-x64/ /usr/local/node

1. 执行如下命令，配置环境变量。

echo "export PATH=$PATH:/usr/local/node/bin" >> /etc/profile
source /etc/profile

1. 执行如下命令，安装Serverless-Devs工具。

npm install @serverless-devs/s -g

说明 :

如果安装过程较慢，可以使用淘宝npm源，安装命令为npm --registry=https://registry.npm.taobao.org install @serverless-devs/s -g。

1. 执行如下命令，查看版本并检查安装是否正确。

s -v

配置阿里云账号信息配置阿里云账号信息

说明：

本场景提供免费的ECS服务器，但是使用的函数计算服务是开通在您账号下，以下配置信息也是需要配置AKID和AKSecret信息。

执行如下命令，配置账号信息。

s config add

然后根据提示填写以下信息。

• 云厂商：选择阿里云（alibaba）。

• AccessKeyID和AccessKeySecret：请在安全信息管理页面查看您账号的AccessKey ID和AccessKey Secret。

  • 如果您使用的是阿里云主账号，请在安全信息管理页面的安全提示弹框中单击继续使用AccessKey。

• 如果您使用的是阿里云RAM子用户，需要确保您的子用户拥有函数计算管理权限AliyunFCFullAccess，请参见为RAM用户授权。

如下图所示为您的AccessKey ID和AccessKey Secret。如果您的账号未使用过AccessKey，请单击右上角创建AccessKey。

配置成功后显示类似如下。

搭建Vuepress博客项目

\1. 执行以下命令，在当前路径初始化一个Vuepress项目。

s init devsapp/website-vuepress

a. 返回结果如下，输入项目文件名website-vuepress。

b. 安装依赖组件，输入yes按回车。

c. 输入OSS Bucket名称后按回车。

​ 说明：阿里云OSS控制台中创建的Bucket名称，可在步骤三的云产品资源下拉列表的文件存储OSS中查看。

d. 选择默认凭据后按回车。

结果类似如下。

\2. 将Vuepress项目部署到函数计算服务上。

a. 执行以下命令，进入项目所在目录。

cd website-vuepress

b. 执行以下命令，部署项目。

s deploy

结果类似如下。

\3. 打开虚拟桌面浏览器，访问测试域名查看部署好的Vuepress博客系统。

\4. 执行以下命令，安装Vuepress。

npm install -g vuepress

结果类似如下。

\5. 执行以下命令，创建一个markdown文件。

echo '# Hello VuePress!' > README.md

结果类似如下。

\6. 执行以下命令，开始写作。

vuepress dev .

结果类似如下。

\7. 在虚拟桌面浏览器中访问http://:8080，可以看到所创建的文件。

接下来您可以添加一些主题和插件以丰富您的博客系统。