MemFire Cloud让静态托管动起来!

2024-04-10 19:44

本文主要是介绍MemFire Cloud让静态托管动起来!,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

静态托管

我们最常接触到的静态托管是github pages,它的常见工作模式是在github上创建一个仓库,使用hexo类的工具初始化仓库,编写markdown文件,生成静态页面,推送到github上完成页面更新,比如https://blog.nimblex.cn/就是这样一个静态的网站。
在这里插入图片描述

局限性

原生静态托管的局限性在于它的更新通常需要重新将markdown文件编译程静态html,然后再发布到托管站。这是一个重新构建的过程,对于非程序员群体来说是有门槛的。

常见动态web网站

一般用户通常会使用类似csdn、新浪博客之类的站点来构建自己的博客,用户只需要通过一个富文本编辑器编辑文章内容,提交即可发布。架设这样一个网站,通常需要后台支持,例如需要后台提供新增、删除、查询博客的接口,通常还需要提供登录注册鉴权等功能。这已经超出传统静态托管的范围了。

分析下动态web网站相对于静态网站有哪几点特殊能力

  • 包含一个后台服务例如以SpringBoot编写的服务、以Flask编写的服务,这些服务提供一系列接口供前端调用
  • 包含一个数据库,这个数据库存储网站内容、配置信息
  • 可能会包含一些静态文件或者对象存储服务用来存储图片

一般需要维护这样一个动态网站需要前端开发、后台开发或者一个全栈开发工程师的配合,即需要前后端的能力。另外,要架设Spring或者Flaks服务,需要提供相应的运行时能力,换言之需要租服务器,像github pages这种静态托管站是不提供这个能力的。

MemfireCloud的增强

MemfireCloud是一个助力快速开发的云平台可以轻松构建小程序、Web网站、移动应用。

MemfireCloud可以提供什么

MemFire Cloud提供哪些能力呢?目前我关注如下这些:

  1. 云数据库
  2. 静态托管服务
  3. 对象存储(兼容S3)
  4. 提供一个supabase JS sdk ,可以访问上述云数据库、对象存储等能力。注意这是一个JS sdk
  5. 内置登录注册、用户管理等功能

王炸组合

我们看下上文中常见动态网站需要的能力

  1. 接口能力
  2. 数据库
  3. 静态文件存储服务

在MemfireCloud平台上,这些通通都可以实现,而且是仅仅通过html + js就可以实现。放开脑洞,再加上静态托管,我们就可以直接构建动态网站了,不要SpringBoot、不要Flask、不要NodeJS,之要MemfireCloud就够了!!!

让静态托管动起来

我就用MemfireCloud构建并托管了一个类似Flomo的web应用(http://cmsrcpa5g6h1f588b1j0.app.memfiredb.cn/),这个应用其实是一个思绪整理工具。这个应用目前的主要功能是:

  • 用户可以在后上角输入想法内容,打上标签(#tag1 xxx这种方式),保存想法
  • 同类标签会进行分归类
  • 支持回收站
  • 支持多用户注册登录访问

大家从域名可以看到,这是一个公网服务且利用了Memfire Cloud的静态托管服务,但是我们完全看不出来它是一个静态网站,它真的很动态!
在这里插入图片描述

它是怎么实现的

完全不像是github pages中常见的hexo等静态博客工具,这个网站是用React开发的单页面应用,在开发的过程中我完全就是把它当作一个动态应用来开发的,antd、Echarts之类的组件库直接用起来。下面我简要介绍其中的一些实现。

数据库定义

数据库定义直接使用MemfireCloud的数据库编辑页面进行
在这里插入图片描述

增删改查

使用Supbase JS sdk可以让js直接操作数据库,这块大家如果感兴趣可以通过文中链接查看他们的官网教程,使用起来也是非常简单的,非常类似于Python的SQLalchemy、Java的Mybatis等ORM框架,这里我以新增为例。

thoughts是定义的数据表,直接使用js api往库里面加数据。其他的操作也是类似的。

        const {data, error} = await supabase.from('thoughts').insert(thoughts).select('id')

静态托管

网站开发好了,需要将其发布到线上,也是很简单,直接将React打包并压缩成ZIP文件,上传到MemfireCloud即可访问在线网站了。
在这里插入图片描述

思考

MemfireCloud赋予开发者一种能力

可以一站式开发、部署应用,特别是给予前端同学一种摆脱后端同学依赖的能力,不需要学习后端开发语言,就可以成为一名全栈开发工程师,这是MemfireCloud平台对每个前端开发工程师的赋能!这个意义是非常深远的,感谢MemfireCloud团队

复杂的工作通过pg function来实现,倒逼我们思考数据库如何更高效的使用

例如要实现基本的统计功能:
在这里插入图片描述

数据分布在两个表里面,如果我用java实现,那么按惯性我就会写三条sql语句,然后用JDBCtemplate执行三次,合并结果数据作为接口返回。但是如果这个场景放在MemfireCloud上,就需要调用三次接口,这样很浪费资源网络资源。这反而暴露了另外一个问题:我们日常浪费了很多数据库请求。

反过来使用Pg Function,不管是Java调用还是MemfireCloud调用只需要一次数据库请求。实现如下:

create or replace function overview_data(userid uuid)  
returns table(ts_count integer, tag_count integer, days integer)
as $$
declarets_count integer := 0;    tag_count integer := 0;min_date date;max_date date;days integer := 0;res record;
beginselect count(*) into ts_count from thoughts where user_id = userid;select count(*) into tag_count from tag where user_id = userid; select DATE_TRUNC('day', min(created_at)) into min_date from thoughts where user_id = userid;select DATE_TRUNC('day', max(created_at)) into max_date from thoughts where user_id = userid;IF max_date IS NOT NULL thendays := max_date - min_date + 1 ;END IF;return query select ts_count, tag_count, days;
end;
$$ language plpgsql;

这篇关于MemFire Cloud让静态托管动起来!的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/891966

相关文章

MySQL数据库宕机,启动不起来,教你一招搞定!

作者介绍:老苏,10余年DBA工作运维经验,擅长Oracle、MySQL、PG、Mongodb数据库运维(如安装迁移,性能优化、故障应急处理等)公众号:老苏畅谈运维欢迎关注本人公众号,更多精彩与您分享。 MySQL数据库宕机,数据页损坏问题,启动不起来,该如何排查和解决,本文将为你说明具体的排查过程。 查看MySQL error日志 查看 MySQL error日志,排查哪个表(表空间

Thymeleaf:生成静态文件及异常处理java.lang.NoClassDefFoundError: ognl/PropertyAccessor

我们需要引入包: <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-thymeleaf</artifactId></dependency><dependency><groupId>org.springframework</groupId><artifactId>sp

用Unity2D制作一个人物,实现移动、跳起、人物静止和动起来时的动画:中(人物移动、跳起、静止动作)

上回我们学到创建一个地形和一个人物,今天我们实现一下人物实现移动和跳起,依次点击,我们准备创建一个C#文件 创建好我们点击进去,就会跳转到我们的Vision Studio,然后输入这些代码 using UnityEngine;public class Move : MonoBehaviour // 定义一个名为Move的类,继承自MonoBehaviour{private Rigidbo

C++/《C++为什么要有静态成员函数》

摘要        本文说明了什么是静态成员变量,什么是静态成员函数的概念,讨论了访问私有静态成员变量的三个方法。得出用静态成员函数访问静态私有成员变量是最佳方法即回答了“C++为什么要有静态成员函数“的问题。 类的静态成员 我们可以使用 static 关键字来把类成员定义为静态的。当我们声明类的成员为静态时,这意味着无论创建多少个类的对象,静态成员都只有一个副本。静态成员在类的所有对象中是

c++的静态变化!

静态成员   对于非静态成员,一个类的每个对象都自己存有一个副本,每个对象根据自己拥有的非静态的数据成员来区别于其他对象。而静态成员则解决了同一个类的多个对象之间数据和函数的共享问题。   静态数据成员   静态数据成员的作用是:实现同一类的不同对象之间的数据共享。   #include<IOSTREAM>   using namespace std;   class Po

本地如何快速启动静态服务器

本地快速启动静态服务器 有许多第三方库可以帮助你快速启动一个静态服务器,甚至无需编写代码。通过命令行运行这些库后,它们会自动启动一个服务器并打开指定端口,展示当前目录下的文件内容: 电脑得提前安装NodeJS 1、http-server http-server 是一个轻量级的命令行工具,允许你快速启动一个静态文件服务器。 安装 npm install -g http-server

Java后端微服务架构下的服务网关设计:Spring Cloud Zuul

Java后端微服务架构下的服务网关设计:Spring Cloud Zuul 大家好,我是微赚淘客返利系统3.0的小编,是个冬天不穿秋裤,天冷也要风度的程序猿! 在微服务架构中,服务网关是微服务系统与外部世界的入口点,它负责请求路由、负载均衡、认证、监控等任务。Spring Cloud Zuul是一个基于Spring Boot的网关服务,它为微服务架构提供了一种灵活、高效的网关解决方案。 服务

Spring Cloud整合Seata实现分布式事务

文章目录 1.Seata1.1 官网1.2 下载1.3 通过安装包运行seata1.3.1 解压seata-server-1.3.0.zip1.3.2 修改 conf/file.conf 配置文件1.3.3 修改conf/registry.conf配置文件1.3.4 添加seata配置信息到nacos1.3.5 配置seata服务端数据库表结构1.3.6 启动seata 2.Spring

ELK+Spring Cloud搭建分布式日志中心

ELK+Spring Cloud搭建分布式日志中心 1.ELK简介2.资源包下载3.Elasticsearch安装3.1 解压Elasticsearch3.2 修改Elasticsearch的配置文件3.3 修改系统配置3.4 启动Elasticsearch 4.ElasticSearch-head插件安装5.Logstash安装6.Kibana安装7.SpringCloud集成logsta

神经网络训练不起来怎么办(零)| General Guidance

摘要:模型性能不理想时,如何判断 Model Bias, Optimization, Overfitting 等问题,并以此着手优化模型。在这个分析过程中,我们可以对Function Set,模型弹性有直观的理解。关键词:模型性能,Model Bias, Optimization, Overfitting。 零,领域背景 如果我们的模型表现较差,那么我们往往需要根据 Training l