小编辑也来开发应用了,你敢信~

105 阅读2分钟

首期创意营中产生了不少好作品,例如我就不说了,先说说小编觉得惊艳的这个:

【昵称】:sh47dow

【应用名称】:个人博客

【应用简介】:这是一个基于nextjs的个人小博客,使用了memfire cloud的应用,数据库,认证管理和云存储功能

【仓库地址】:github.com/sh47dow/blo…

当时演示环境还健在时,有幸欣赏了作者的家庭美照,被娃萌翻了(悄悄透露一下,作者是位程序媛小姐姐)。当即就决定down下代码,为了国庆应景,搞一个国庆阅兵合集,回顾1949--2009新中国的14次国庆大阅兵~

作为一个毫无编程基础的小编辑,大概也就1、2天吧,攻克了所有难题撸上了线(别问细节,说多了都是泪...不过只要有一位前端新手加持就能通关)。。

【演示环境-国庆阅兵合集】:app.memfiredb.com/ccp6dui5g6h…

这个应用里面用到了MemFire Cloud应用中的数据库、云存储、认证、静态网站托管和API接口等功能,有兴趣或者相同功能实践需求的朋友,可以直接参考这个应用。

「砖来了!」 作者还给小编布置了一个任务。。说这个博客还有待完成的功能,还可以继续完善,升级为一个有可视化后台管理的应用。例如上传图文影音和日常文件的发布、更新、删除等操作。

好了,小编的🧱已就位,功成身退之前,再给大家分享一个过程中在静态托管模块遇到的坑吧。

躺坑小技巧

过程中,小编发现一边通过应用里面的数据表直接编辑,一边就可以实时预览修改的图文效果。一时之间仿佛真的变成了一位程序员,开发体验感拉满!!

图片

图片

但是在静态托管的模块,却栽了跟头,无论如何也跨不过去的鸿沟。托管上去什么也看不了。于是,在我的强烈要求之下。我们的前端给上了手把手演示说明,如下:

「原理:应用打包,生成build目录,目录中所有文件只要引用了本项目结构里面的文件,都要将引用的绝对路径改为相对路径。」

截屏演示:

out/index.html

图片

out/_next/static/chunks/pages/list-936df5cce472d48a.js

图片

图片