开发函数计算的正确姿势 —— 移植 next.js 服务端渲染框架

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

函数计算(Function Compute): 函数计算是一个事件驱动的服务,通过函数计算,用户无需管理服务器等运行情况,只需编写代码并上传。函数计算准备计算资源,并以弹性伸缩的方式运行用户代码,而用户只需根据实际代码运行所消耗的资源进行付费。函数计算更多信息 参考。
Fun: Fun 是一个用于支持 Serverless 应用部署的工具,能帮助您便捷地管理函数计算、API 网关、日志服务等资源。它通过一个资源配置文件(template.yml),协助您进行开发、构建、部署操作。Fun 的更多文档 参考。
2.0 版本的 Fun,在部署这一块做了很多努力,并提供了比较完善的功能,能够做到将云资源方便、平滑地部署到云端。但该版本,在本地开发上的体验,还有较多的工作要做。于是,我们决定推出 Fun Init 弥补这一处短板。
Fun Init: Fun Init 作为 Fun 的一个子命令存在,只要 Fun 的版本大于等于 2.7.0,即可以直接通过 fun init 命令使用。Fun Init 工具可以根据指定的模板快速的创建函数计算应用,快速体验和开发函数计算相关业务。官方会提供常用的模板,用户也可以自定自己的模板。

背景

next.js 是一种 React 的服务端渲染框架,且 next.js 集成度极高,框架自身集成了 webpack、babel、express 等,使得开发者可以仅依赖 next、react、react-dom 就可以非常方便的构建自己的 SSR React 应用,开发者甚至都不用像以前那样关心路由。

next.js 的高度集成性,使得我们很容易就能实现代码分割、路由跳转、热更新以及服务端渲染和前端渲染。

next.js 可以与 express、koa 等服务端结合使用。为了能让 next.js 在函数计算运行,首先需要让 next.js 
在 express 中运行起来,然后再移植 express 到函数计算中运行。express 应用移植相关文章:

  • 开发函数计算的正确姿势——移植 Express
  • 移植 express.js 应用到函数计算
  • next.js 运行在 express 中

现在,我们提供了一个 fun 模块,通过该模板,三分钟就可以让 next.js 应用在函数计算中运行起来。效果如下:

快速开始

1. 安装 node

curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.5/install.sh | bash
nvm install 8

2. 安装 fun 工具

npm install @alicloud/fun -g

fun 工具的某些子命令可能会用到 docker,所以你需要安装好 docker,具体参考文档:Fun 安装教程。

3. 通过 fun 模板生成项目

fun init -n demo https://github.com/muxiangqiu/fc-next-nodejs8.git

项目生成好后,在根目录下有个 README.md 文件,阅读该文件可以帮你快速了解项目骨架为你做了什么,以及相关的命令。具体详情:README.md。

4. 安装依赖

cd demo # 切换到项目根下面,后面的所有命令,都是在项目根下面执行
npm install

5. 本地运行 next.js

npm run dev

6. 编译 next.js 

npm run build

7. next.js 在本地函数中运行

npm run start

8. 部署函数到云端

部署函数的时候需要用到 AK 等下信息,可以通过 fun config 来配置,如果配置过请忽略,部署函数命令如下:

npm run deploy

小结

该模板默认提供的是 http 触发器方式触发函数,同时也提供了 API 网关方式触发函数,只是与 API 网关的代码被注释掉了而已,其中,template.yml 文件与 API 网关相关的配置也被注释掉了。在模板项目中,提供了两个比较重要的文件:server.js 和 fc.js。server.js 负责 next.js 与 express 对接;fc.js 负责 express 与 express 对接。这两个文件一般情况下不需要修改。接下来,你就可以按照 next.js 标准方式开发 next.js 应用了。


原文链接
本文为云栖社区原创内容,未经允许不得转载。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/518885.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

SpringBoot xml层SQL update之foreach循环的坑

在做二级分类批量删除置父级目录一级分类num-1时,发现数组里放了一样的pid,但是循环里只默认一个pid 145,所以只成功执行了一次num-1 可以选择在mapper接口层执行循环

Zookeeper UI管理界面安装

文章目录1. 安装java环境2. 安装maven打包环境3. 在线安装Git4. 安装zookeeper服务5. 安装zkui6. 开放防火墙7. 浏览器访问1. 安装java环境 下载 略 环境变量 export JAVA_HOME/app/jdk1.8.0_202 export PATH$PATH:$GOROOT/bin export CLASSPATH.:${JAVA_HOME}/jre/lib/rt.j…

虎牙在全球 DNS 秒级生效上的实践

本文整理自虎牙中间件团队在 Nacos Meetup 的现场分享,阿里巴巴中间件受权发布。 这次分享的是全球 DNS 秒级生效在虎牙的实践,以及由此产生的一些思考,整体上,分为以下5各部分: 背景介绍;方案设计和对比…

MySQL 狠甩 Oracle 稳居 Top1,私有云最受重用,大数据人才匮乏! | 中国大数据应用年度报告...

整理 | 屠敏出品 | CSDN(ID:CSDNnews)科技长河,顺之者昌,错失者亡。在这个技术百态之中,中国专业的 IT 社区CSDN 创始人&董事长蒋涛曾多次在公开活动中表示,开发者是对技术变革最敏感的人群。这不仅源于…

JS中split对多个分隔符的处理

关于JavaScript split() 方法,菜鸟教程是这样介绍的: split() 方法用于把一个字符串分割成字符串数组。 提示: 如果把空字符串 ("") 用作 separator,那么 stringObject 中的每个字符之间都会被分割。 注意&#xff1…

分布式6大核心专题_分布式ID

文章目录一、号段模式1. 拉取项目源码编译2. springboot集成Leaf3. 配置leaf.properties4. 创建数据库5. 初始化表结构和数据6. 测试案例7. 浏览器测试美团Leaf的号段模式和雪花算法模式生成分布式全局唯一id方式2种 一、号段模式 目前jar在maven仓库中没有上传 1. 拉取项目源…

现代编程语言大 PK,2020 年开发者关心的七大编程语言!

【CSDN 编者按】“如果我们把人类文明想象成汽车的话,那么软件开发行业就相当于汽车的引擎,编程语言就像引擎的燃料。”作为一名开发者,需跟随技术潮流的发展来学习新技术。2020年,你有计划新学一门编程语言吗?本文作者…

一文读懂深度学习:从神经元到BERT

阿里妹导读:自然语言处理领域的殿堂标志 BERT 并非横空出世,背后有它的发展原理。今天,蚂蚁金服财富对话算法团队整理对比了深度学习模型在自然语言处理领域的发展历程。从简易的神经元到当前最复杂的BERT模型,深入浅出地介绍了深…

启动redis闪退/失败

问题:正常启动redis-server.exe时,项目出现闪退情况 解决方式:按照下图完整流程输出即能正常启动

阿里开发者招聘节 | 2019阿里巴巴技术面试题分享:20位专家28道题

为帮助开发者们提升面试技能、有机会入职阿里,云栖社区特别制作了这个专辑——阿里巴巴资深技术专家们结合多年的工作、面试经验总结提炼而成的面试真题这一次将陆续放出(面试题官方参考答案将在专辑结束后统一汇总分享,点此进入答题并围观他…

uniapp页面传参使用encodeURIComponent转义特殊符号

答主在uniapp页面跳转传imgUrl(地址为:https://metting.oss-cn-beijing.aliyuncs.com/20210615153312771.9AT5NO.jpg?Expires4779415992&OSSAccessKeyIdLTAI4GKXzR3eLCustbbLYxFf&Signature***********)时,图片无法正常显…

论程序员的自我修养——我在阿里干了十年开发

究竟是努力重要,还是选择重要?资深阿里技术人毕玄师兄有着自己的见解。 毕玄,阿里巴巴基础设施事业群负责人,资深技术专家。打造了阿里目前使用最为广泛的核心中间件之一的服务框架;设计并带领团队实现了阿里技术发展…

一文了解 Spring Boot 服务监控,健康检查,线程信息,JVM堆信息,指标收集,运行情况监控!...

作者 | Richard_Yi责编 | 徐威龙稿源 | 掘金封图| CSDN 下载于视觉中国本文为作者个人经验,供大家参考。去年我们项目做了微服务1.0的架构转型,但是服务监控这块却没有跟上。这不,最近我就被分配了要将我们核心的微服务应用全部监控起来的任务…

分布式6大核心专题_分布式Session

文章目录一、Session存在服务器上还是tomcat中?1. 创建springboot项目2. 启动项目3. 调用登录接口4. 调用获取用户信息接口5. 重启tomcat调用获取用户信息接口二、Session与Cookie的关系三、传统Session3.1. 启动项目3.2. 浏览器测试四、分布式Session解决方案4.1. …

Nacos: Namespace 和 Endpoint 在生产环境下的最佳实践

随着使用 Nacos 的企业越来越多,遇到的最频繁的两个问题就是:如何在我的生产环境正确的来使用 namespace 以及 endpoint。这篇文章主要就是针对这两个问题来聊聊使用 nacos 过程中关于这两个参数配置的最佳实践方式。 namespce 关于 namespace &#x…

java.lang.ArrayIndexOutOfBoundsException:数组下标越界越界

前台vue初始化 pinIds:[],但是当pinIds前台查询条件传值为空时,pinIds[0]、pinIds[1]取不到值,就会报数组下标越界越界 改为 就可以了

如何实现“持续集成”?闲鱼把研发效率翻了个翻

阿里妹导读:业务的快速发展,需要我们更快速地响应,和更高质量产品的交付。如何从原来大(xiao)迭(pu)代(bu)的开发模式切换为精益开发模式?以 2-1-1(2周需求交付周期,1周需求开发周期,1小时集成时…

分布式Session解决方案_Spring Session + Redis

接上一篇:分布式6大核心专题_分布式Session https://gblfy.blog.csdn.net/article/details/113802195 文章目录1. 安装redis服务并启动2. 引入Spring Session组件3. 分别启动8081端口和8082端口4. 调用8081登录接口5. 调用8081获取用户信息接口6. 调用8082获取用户信…

酸了!华为补贴湖北员工每天最高 2000 元

近日,华为员工发帖称,华为将给武汉研究所现场办公的人员,每人补助2000元(从2020年1月23日开始算,以湖北发布疫情终止之日截止),湖北以外其他地区1000 元,海外每天150美金&#xff08…

java.lang.IllegalArgumentException: invalid comparison: java.time.LocalDateTime and java.lang.String

数据库字段: 数据库中的时间字段handle_time是datatime 前端: xml文件: 运行结果: 原因 这是因为原因是mybatis 中对于时间参数进行比较时的一个bug. 如果拿传入的时间类型参数与空字符串进行对比判断则会引发异常. 所以在上面…