大厂技术  高级前端  Node进阶

点击上方 程序员成长指北,关注公众号

回复1,加入高级Node交流群

今天分享一款轻量级的基于 Node.js 的开源 CMS,采用前后端分离开发模式,集成了 API、后台管理、WEB 展示三个完整项目。开箱即是一套完整的企业网站,适合企业、个人直接使用或二次开发。

API

API 使用 Node.js 服务端框架 NestJS,实现了:

  • 首页 banner 增删改查;

  • 首页推荐产品改查;

  • 关于我们、联系我们改查,网页标题(Title)和描述(Descriptiton)设置;

  • 产品分类增删改查,网页标题(Title)和描述(Descriptiton)设置,以及自定义路由;

  • 产品增删改查,产品自定义路由;

  • 图片上传;

  • JWT 权限认证;

  • Swagger 输出 API 文档。

bf89e3692e82cb07183143d698265bf7.png

WEB

WEB 端使用 Vue.js 的框架 NuxtJS SSR渲染,采用 Bootstrap-vue 完成响应式网页,实现了:

  • SSR 服务端渲染,全站伪静态,增加搜索引擎收录机会,有利于 SEO;

  • 生成静态 HTML 全站点,方便布署且增加搜索引擎收录机会,有利于 SEO;

  • 响应式网页设计,可自动适配移动、PC 端。

4ef21f16dca41b938f9f3f80010c381d.png

后台管理

后台管理使用 Element UI + Vue.js 开发,实现了:

  • 管理员登录 JWT 认证;

  • 管理员增删改查;

  • 首页 Banner 增删改查;

  • 首页产品推荐;

  • 产品分类管理,自定义路由;

  • 产品管理,自定义路由;

  • 关于我们/联系我们管理;

  • 图片上传功能;

  • 引入 自定义 CKeditor5 富文本编辑器,图片上传增加 JWT 认证,提升系统安全。

2a7b91d32212049817203f78bd4ed0b8.png

项目源码

  • GitHub:https://github.com/givebest/node-nest-vue-nuxt-cms

  • Gitee:https://gitee.com/givebest/node-nest-vue-nuxt-cms

文章转自: https://blog.givebest.cn/nodejs/2021/10/22/node.js-cms-based-nest.js-nuxt.js-vue.js.html

6e78ce44a1c0f5ba939058a0153ed7e6.png

Node 社群

我组建了一个氛围特别好的 Node.js 社群,里面有很多 Node.js小伙伴,如果你对Node.js学习感兴趣的话(后续有计划也可以),我们可以一起进行Node.js相关的交流、学习、共建。下方加 考拉 好友回复「Node」即可。

d05350f2acb621524fe1c66e6ef6e4fe.png

   “分享、点赞、在看” 支持一波👍

Logo

有“AI”的1024 = 2048,欢迎大家加入2048 AI社区

更多推荐