快速迁移 Next.js 应用到函数计算-阿里云开发者社区

开发者社区> 阿里巴巴云原生小助手> 正文

快速迁移 Next.js 应用到函数计算

简介: 本文演示了如何快速从零开始搭建一个 Serverless 的 Next.js 的博客应用。
+关注继续查看

m1.jpg

首先介绍下在本文出现的几个比较重要的概念:

函数计算(Function Compute): 函数计算是一个事件驱动的服务,通过函数计算,用户无需管理服务器等运行情况,只需编写代码并上传。函数计算准备计算资源,并以弹性伸缩的方式运行用户代码,而用户只需根据实际代码运行所消耗的资源进行付费。函数计算更多信息 参考
Fun: Fun 是一个用于支持 Serverless 应用部署的工具,能帮助您便捷地管理函数计算、API 网关、日志服务等资源。它通过一个资源配置文件(template.yml),协助您进行开发、构建、部署操作。Fun 的更多文档 参考

备注: 本文介绍的技巧需要 Fun 版本大于等于 3.7.0。

2

背景

Next.js 是一种 React 的服务端渲染框架,且 Next.js 集成度极高,框架自身集成了 webpack、babel、express 等,使得开发者可以仅依赖 Next、react、react-dom 就可以非常方便的构建自己的 SSR React 应用,开发者甚至都不用像以前那样关心路由。
Next.js 的高度集成性,使得我们很容易就能实现代码分割、路由跳转、热更新以及服务端渲染和前端渲染。

环境准备

首先按照 Fun 的 安装文档 里介绍的方法将 Fun 安装到本机。
PS: 本文介绍的方法,不需要安装 Docker,仅仅安装 Fun 即可,最简单的方式就是直接下载可执行的二进制文件。
安装完成后,可以执行 fun --version 检查 Fun 是否安装成功。

快速开始

  1. 创建一个 Next 项目,这里以 nextjs 为例:
npm init next-app
  1. 进入到刚刚创建的示例项目中:
cd nextjs
  1. 本地运行测试该示例:
npm run dev 或者 yarn dev

效果如下:
20200313103411.jpg

  1. 编译 nextjs 项目:
npm run build
  1. 部署项目到函数计算:
    仅需要一个命令fun deploy,Fun 会自动进入部署流程,在该流程中,用户仅仅需要按下一系列的回车即可。流程细节如下:
1. Fun 检测到这不是一个 Fun 项目,会提示协助创建(直接回车或者输入 y 即可):
    ![20200313105720.jpg](https://intranetproxy.alipay.com/skylark/lark/0/2020/jpeg/200393/1584068254790-8f53c8aa-bcb5-4f91-9160-a028bbb9b13a.jpeg) 
2.     Fun 项目自动创建成功,提示是否进行部署?可以直接回车,或者输入 y 进行确认:
  ![20200313111040.jpg](https://intranetproxy.alipay.com/skylark/lark/0/2020/jpeg/200393/1584069057784-57021e01-287a-4169-9237-22a65984ced2.jpeg) 
3.  然后 Fun 会直接将应用部署到线上了。
    ![20200313111259.jpg](https://intranetproxy.alipay.com/skylark/lark/0/2020/jpeg/200393/1584069191767-2e544c50-a331-4dc3-9b45-f260f6447801.jpeg) 
部署完成后,我们可以根据部署成功的日志看到,函数计算为我们生成了临时域名 14069166-1986114430573743.test.functioncompute.com,我们可以通过这个临时域名直接访问我们刚刚部署的应用。
**注意:临时域名仅仅用作演示以及开发,是有时效的,如果用作生产,请绑定已经备案的域名,绑定自定义域名可以参考 [详情](https://statistics.functioncompute.com/?title=%E5%BF%AB%E9%80%9F%E8%BF%81%E7%A7%BB%20Next.js%20%E5%BA%94%E7%94%A8%E5%88%B0%E5%87%BD%E6%95%B0%E8%AE%A1%E7%AE%97&author=%E7%94%B0%E5%B0%8F%E5%8D%95&src=&url=https%3A%2F%2Fhelp.aliyun.com%2Fdocument_detail%2F90722.html)**

总结

本文主要介绍了如何将 Next.js 应用部署到函数计算。相比较与传统的部署方法,不仅没有更复杂,还省略了购买机器等步骤。实现,将传统的 Next.js 应用在本地开发完成后,一键部署到远端直接用于生产,并拥有了弹性伸缩、按量付费、免运维等特性。

阿里巴巴云原生关注微服务、Serverless、容器、Service Mesh 等技术领域、聚焦云原生流行技术趋势、云原生大规模的落地实践,做最懂云原生开发者的技术圈。”

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
如何在函数计算中使用 Node.js 处理 multipart 文件上传请求
## 前言 web 开发中我们经常会允许用户通过 HTTP POST 请求上传文档到服务器,如何使用函数计算来做文件上传服务呢?下面我们使用 nodejs 来实现一个文件上传的案例: 我们知道浏览器中上传文档通常会使用 `multipart` `form-data` 来多文件同时上传文件。 例如,我们可以使用curl来做这个测试模拟上传两个文件: `test.txt` 和 `inde
1600 0
php中使用exec,system等函数调用系统命令
php的内置函数exec,system都可以调用系统命令(shell命令),当然还有passthru,escapeshellcmd等函数。   在很多时候利用php的exec,system等函数调用系统命令可以帮助我们更好更快的完成工作。
680 0
如何在函数计算中使用 Node.js 处理 multipart 文件上传请求
web 开发中我们经常会允许用户通过 HTTP POST 请求上传文档到服务器,本文将介绍在函数计算中基于 node.js 使用 multipart form-data 来实现文件上传服务。
2706 0
云计算数据库迁移需要避免的10个错误
云计算数据库迁移需要避免的10个错误139w.com 鼎点网络 数据库专家Chris Foot分享了IT团队在进行云计算数据库迁移时通常会遇到的十个疏忽和错误,并为此提供了如何避免这些错误的建议。
533 0
《云计算:原理与范式》一第2章 迁移到云2.1 引言
本节书摘来自华章出版社《云计算:原理与范式》一书中的第2章,第2.1节,作者 (澳)Rajkumar Buyya James Broberg Andrzej Goscinski,更多章节内容可以访问云栖社区“华章计算机”公众号查看
1152 0
企业加快云计算应用的十大理由
本文讲的是企业加快云计算应用的十大理由,【IT168 资讯】据Skytap公司称,企业加快云计算应用有十个主要理由。
1013 0
《Kinect应用开发实战:用最自然的方式与机器对话》一3.2 基于“管道”的系统架构
本节书摘来自华章出版社《Kinect应用开发实战:用最自然的方式与机器对话》一书中的第3章,第3.2节,作者 余涛,更多章节内容可以访问云栖社区“华章计算机”公众号查看
1827 0
《云计算:原理与范式》一2.2 迁移到云的主要途径
本节书摘来自华章出版社《云计算:原理与范式》一书中的第2章,第2.2节,作者 (澳)Rajkumar Buyya James Broberg Andrzej Goscinski,更多章节内容可以访问云栖社区“华章计算机”公众号查看
1122 0
《云计算:原理与范式》一2.3 迁移到云的七步模型
本节书摘来自华章出版社《云计算:原理与范式》一书中的第2章,第2.4节,作者 (澳)Rajkumar Buyya James Broberg Andrzej Goscinski,更多章节内容可以访问云栖社区“华章计算机”公众号查看
1236 0
讯鸟亮相云计算应用与呼叫中心高峰论坛
本文讲的是讯鸟亮相云计算应用与呼叫中心高峰论坛,2012年11月2日,由合肥市人民政府和中国呼叫中心与BPO产业联盟主办,合肥市商务局、蜀山区人民政府、北京讯鸟软件有限公司、中国电信安徽省公司承办的“2012中国云计算应用与呼叫中心高峰论坛”在安徽省合肥市贝斯特韦斯特酒店成功落下帷幕。
1490 0
1302
文章
0
问答
来源圈子
更多
阿里云 云原生应用平台 肩负阿里巴巴集团基础设施云化以及核心技术互联网化的重要职责,致力于打造稳定、标准、先进的云原生产品,成为云原生时代的引领者,推动行业全面想云原生的技术升级,成为阿里云新增长引擎。商业化产品包括容器、云原生中间件、函数计算等。
+ 订阅
文章排行榜
最热
最新
相关电子书
更多
《2021云上架构与运维峰会演讲合集》
立即下载
《零基础CSS入门教程》
立即下载
《零基础HTML入门教程》
立即下载