我在掘金学到的第一个项目开源了

回首

我一直以来都有刷博客的习惯,在暑假的时候,偶然看到小付大佬的博客前端小付 的个人主页 - 文章 - 掘金 (juejin.cn),当时还没有学react,但是感觉项目还是挺不错的,就收藏下来了,9月份之后想学习下react,我觉得做项目和看书是技术提升最快的方式,于是在学完react基础知识之后,开始了对react项目的学习。令我意外的是,小付哥的项目是我在掘金见过为数不多的完整的项目,而且连续周更,可以说很良心。因为我对nest 比较熟,所以没有去用midway去做后端,其他技术栈dockernginx我也熟一些,技术栈基本完全匹配,于是开始了长达一个半月的学习,这个项目的学习对我来说提升的幅度比做俩项目都多,很推荐大家去学习,如果有小伙伴也想用nestjs来写,希望我的代码对你来说有帮助。

技术栈

整个项目技术栈如下:

前端:

  • react
  • zustand
  • vite
  • tailwindcss
  • ahooks
  • antd + ant-design/plots

后端:

  • nestjs
  • mysql
  • redis
  • prisma
  • minio

部署:

  • docker
  • nginx
  • github actions
  • aliyun

收获

通过学习本项目你可以学到的东西有很多很多,比如组件封装动态路由 ,高阶组件 ,多页签封装 , 无感刷新 , 前端限流 等等客户端知识, 还有服务端 , 数据库运维方面的很多知识,可以说是收获满满。学习项目的期间,就跟追剧一样,每集看完,都津津有味,收获满满,也是期待后面的内容。学习的期间学习了很多东西的用法,以及封装的思想,原理等,也是将踩过的坑一一解决。

项目的内容主要是b端老生常谈的rbac权限管理,附加一些常见的其他功能,大家可以自行探索。下面附上几张效果图。

项目地址为www.mengmeng.tech/ 大家可以体验一番,希望不要打网站,开源出来的初衷也是为了供大家学习,大家直接用准备好的账户登录就行,因为我控制着删除的权限,如果没有管理员账户是不可以删除的,为了防止大家误删东西,其他的话,如果我们有很多用户同时登录同一个账户,如果权限被修改了是会被websocket实时推送给其他正在登录的用户的。

github仓库地址

前端:github.com/js-0127/men...

后端:github.com/js-0127/men...

结语

这个全栈项目还是挺不错的,能学到不少东西,希望大家有学习的想法就坚持下去。我本人下周要去实习了,如果对于代码不懂的地方可以去小付大佬的对应文章的评论区询问,对于项目里面遇到的nestjs的问题,欢迎到下方评论区留言,看到后第一时间为大家解答。对于后端部署的问题,可以参考我的上一篇文章带你从0到1部署nestjs项目 - 掘金 (juejin.cn)。最后希望大家如果觉得不错的话可以留个赞,仓库来颗star😘

相关推荐
阿喵派我来抓鱼16 小时前
深入理解 AI 流式接口:从请求到响应的完整解析
react.js·ai·前端框架·vue
sdgsdgdsgc16 小时前
Next.js企业级应用开发:SSR、ISR与性能监控方案
开发语言·前端·javascript
哲此一生98416 小时前
搭建Vue3工程(去除不必要的文件)
前端·javascript·vue.js
摇滚侠18 小时前
Spring Boot 3零基础教程,IOC容器中组件的注册,笔记08
spring boot·笔记·后端
黑云压城After19 小时前
H5使用环信实现视频或语音通话
前端·javascript·vue.js
未来之窗软件服务20 小时前
自己写算法(九)网页数字动画函数——东方仙盟化神期
前端·javascript·算法·仙盟创梦ide·东方仙盟·东方仙盟算法
程序员小凯20 小时前
Spring Boot测试框架详解
java·spring boot·后端
你的人类朋友21 小时前
什么是断言?
前端·后端·安全
FIN66681 天前
昂瑞微:实现精准突破,攻坚射频“卡脖子”难题
前端·人工智能·安全·前端框架·信息与通信
椎4951 天前
苍穹外卖前端nginx错误之一解决
运维·前端·nginx