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

回首

我一直以来都有刷博客的习惯,在暑假的时候,偶然看到小付大佬的博客前端小付 的个人主页 - 文章 - 掘金 (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😘

相关推荐
Profile排查笔记2 分钟前
指纹浏览器手机版怎么选?从本地 App 到云端 Android 的实现方式解析
前端·人工智能·后端·自动化
jufeng13077 分钟前
STM32F103 IAP 实战:串口 Bootloader 分区升级,掉电断电不白写
后端
Lost of 程序猿20 分钟前
ASP.NET Core 多租户架构深度实战:一套系统,管理一支船队
后端·架构·asp.net
浪兎兎26 分钟前
Vue CLI笔记
前端·vue.js·笔记
Csvn28 分钟前
Proxy / Reflect 与响应式原理:完整手写一个 mini Vue3 响应式系统
前端
深念Y30 分钟前
视频平台架构重构:从微服务到可插拔基础设施
后端·微服务·云原生·架构·rabbitmq·音视频·rocketmq
Easy_API30 分钟前
OpenAI三周内第二次降价,GPT-5.6 Sol砍了20%到33
大数据·前端·人工智能·gpt·深度学习
深念Y31 分钟前
07-SSR水合问题实战排查与修复记录
前端·vue·vite·nuxt·ssr·csr·水合
汤姆yu31 分钟前
基于Django的学习资料共享与智能推荐系统
后端·python·django·毕业设计·学习资料共享
前端炒粉33 分钟前
容器预热预跳转方案
前端·vue.js·性能优化