跳到主要内容
信息

本课讲师: @pincman 助教:@cloneable,@愧怍

注意

为了添加更多的基础内容,方便萌新同学也能学习,老课已弃用不再维护!请新同学跟周年版本(新版)开更的新课学习,给大家照成的不便敬请谅解!

✏️相关资源

你可以在学习我们课程的同时学习以下相关资料

📒课程目标

TS全栈课程不讲所谓的“高并发处理”,“云原生架构”,“大型某某项目”,“年薪百万企业级”等等相关内容,如果你喜欢这类课程请自行某课购买或B站搜索!我们更倾向于制作小而美以及极客式的,以引导你获得更好的编码学习方法,并帮助你解决实际问题,减少你的爬坑时间为主的课程. 课程最终的目的是面向远程/坐班求职,海外项目开发,独立开发者等。目标是通过开发一个可扩展的社区网站来编写一套通用的开发框架,在此基础上你可以不断地修改并随时开发出你自己的应用。另外一个目的是帮助你数量掌握各种通用的TS生态,以便可以触类旁通的随时使用相关的其他框架,比如electron写桌面应用,taro写小程序,rn写移动应用,写node爬虫等等。

本课程并不是带你简单的浏览一遍语法塞给你几个小案例和一套PPT讲课视频带你入个门,也不是随便搞个简单源码然后臆想出来的所谓"商业案例"让你照着抄一遍,案例方面我们直接向你提供我们项目组的商业案例源码,那会比臆想出来的"学院派商业项目"更可靠。

同时,课程开发的社区项目也是在汲取我们开发的所有海外商业项目的基础上去粗取精整合而来。

并且我们提供所有的商业项目(只要是TS的)都是基于我们课程里学习的框架基础上开发的!

备注

无论求职还是自由职业的薪资和收入高低都是跟每个人的运气,机遇和领悟力有关的,所以这需要你自己做一个权衡!

下面是我们的课程目标

  • 学会Nestjs框架的核心概念,原理以及使用方法
  • 完成一个自行封装后的兼具nestjs模块化和laravel敏捷式的后端框架
  • 在此框架上完成一个弹性可扩展的CMS系统后端以及社区网站后端 - 3rcu
  • 3rcu后端手动开发一个基于React的后台管理系统
  • 使用Nextjs为3rcu开发一个强大的SSR网站
  • 使用monorepo整合API后端,React后台以及Nextjs前台
  • 使用Gitea+Drone+Nginx+PM2实现自动化构建及热部署
  • 学会个人网站的开发以及个人品牌的建设(这部分主要在《远程掘金课》中教学

🎓学习方法

注意

默认商业项目源码是不开放的,但是你联系@cloneable助教来开启

  1. 使用@pincman给的账号登录git仓库
  2. 查看本课程仓库的说明文档(必须登录后才能查看,否则404
  3. 按照课程仓库的说明文档的方法下载git,docker等,并启动课程文档,打开localhost:3333查看课程
  4. 如果学习太累的时候,可以放松式的看视频学习一段(建议不要作为主要学习途径,会照成按部就班,无法拓展思维后续无法灵活开发的状态)
  5. 学习中有任何问题,请在discord的 问答频道(目前已迁移至自建论坛3r酷)中提问,如果是加急问题,请@cloneable或者@愧怍
  6. 学习课程的同时可以关注我们社区中的 项目组队频道(目前已迁移至自建论坛3r酷)(因为我们的岗位和外包并不是全部与我们所教的课程一致的,也许就有与你匹配的golang或者.net技术栈哦😁)
  7. 学习课程的同时也可以下载我们的商业项目源码学习
  8. 新手请在学习完至少两个商业项目后,如果发现 项目组队频道(目前已迁移至自建论坛3r酷)中有适合你的新项目进来,可以联系@pincman加入我们的工作室参与开发简单的项目(开发者是有报酬的)

🔥商业案例

3R工作室商业案例可以查看项目案例页面(更新比较慢),或者社区的 项目组队频道(目前已迁移至自建论坛3r酷

与本课技术栈一直,且站长推荐的几个项目如下

success

如有后台,账号均为: "admin",密码均为: "123456aA$"
经部分客户反馈后不再向外部非会员公开提供程序演示,只提供项目详情(预算、工期、设计稿或需求文档等)

📝知识点

因为学习3R的TS全栈课程,相信您必定已经了解了JS/TS,React以及Node的优势与劣势,正如你所想的,优势是,使用这些技术的供求比很低,也就是职位需求量大,但开发者远远没有达到市场需求的饱和状态,不仅仅是海外远程,国内使用的企业也在快速增多,这与php和.net(仅国内)岗位稀缺的情况或者java岗位虽多如牛毛,但求职者是其岗位的好几倍的情况不同,应该说好得多。但是劣势是生态真的差到极点,nestjs是其中唯一可以看得过去的,那么你要做的就是只能慢慢的打磨nestjs,把他打磨的像其他语言的框架一样顺手,而不是只学习一下官网的基本使用方法,这对接单海外项目和求职远程工作帮助并不大,所以需要投入大量的精力和时间来磨平学习曲线,加油!

我们的课程结构大体是这样的:

  1. 起步篇,主要是搭建开发环境,项目的monorepo结构,服务器运维部署,CI/CD等
  2. 从实战篇开始,先学习一些基础的知识点和一些核心的概念及重要类库的使用方法
  3. 然后再Nestjs部分的课程先简单的做一个文章管理系统的API
  4. 然后就开始构建一个非常好用的弹性可扩展架构和CLI命令这些
  5. 接着不断地给这个架构上追加Auth,短信邮件发送,实时通讯,动态权限,流式文件下载等功能来实现一个强大可扩展的CMF架构的API
  6. React部分的课程则负责为这个强大的CMF框架开发一个完美的管理后台,手动复刻Antd Pro,vben等常用后台面板的优秀功能
  7. Nextjs部分的课程开发一个SSR网站来匹配前两套课实现一个比较Fushion的现代化SSR网站
  8. 最后我们把在这个CMF框架上构建出一个社区网站出来,后续我们也可以自行在这个框架上编写电商网站等各种应用
  9. 《远程掘金课》是在学习技术课的同时或学习之后,帮助同学们可以更好的使用TS全栈来获取更多money,因为学以致用才是最重要的!

📚课程目录

目前有《TS全栈开发实战》和《远程掘金课》两套课程在更新和维护,后续我们会增加更多课程,敬请期待!

🍋TS全栈课

本课程带领大家从零基础入门开始,使用Typescript开发一个完整可扩展的社区网站

课程所开发的应用案例不局限于一个社区网站,更像是一个随时可扩展的CMS系统框架,你可以在此之上构建C2C的电商网站,纯展示型的企业网站等等

当前课程所涉及的内容包括:

  • SSR 响应式网站开发
  • 中后台管理系统开发
  • 后端API开发
  • CLI命令行工具开发
  • 自动化构建/部署/运维(即CI/CD)
  • 使用全栈开发技能赚钱获利
  • ...
信息

后续我们会添加更多课程,比如 React Native移动应用开发,Electron跨平台桌面应用开发,Taro小程序开发等,敬请期待

本课程涉及的各个主技术栈版本号

  • Node.js: v20
  • Nestjs: v10
  • React: v18
  • Nextjs: v13

🚲起步篇

信息

主要涉及: Node开发环境/各种TS应用的脚手架搭建/Monorepo应用构建/Linux服务器与PHP应用搭建/CICD自动构建部署等等

  1. Node.js环境配置
  2. Nestjs+Eslint+SWC应用初始化及断点调试
  3. Vite+React18+Eslint+Stylelint+TailwindCSS+Antd应用初始化
  4. Nextjs13+Eslint+Stylelint+TailwindCSS+shadcn/ui应用初始化
  5. Turborepo+Nestjs+React18+Nextjs13构建monorepo脚手架
  6. 无懈可击的Linux服务器构建
  7. 使用Gitea+Drone+PM2自建CICD平台 - 实现自动化运维与部署
  8. Cluster均衡负载及Fork进程详解

🚀实战篇

Nestjs最佳实践

Nestjs后端API及CLI工具开发


信息

主要涉及: Node.js/Typeorm/Nestjs/Yargs/Fastify/BullMQ/Passport.js/CASL/Redis等

  1. 『基础知识』Node.js环境配置
  2. 『基础知识』Nestjs+Eslint+SWC应用初始化及断点调试
  3. 『基础知识』Nestjs核心概念
  4. 『内容模块』Nestjs整合Typeorm实现基本的CRUD操作及分页数据查询
  5. 『内容模块』请求数据的验证和响应数据的序列化
  6. 『内容模块』数据关联与树形嵌套结构的分类和评论的实现
  7. 『内容模块』自定义全局的验证管道,拦截器和过滤器
  8. 『内容模块』自定义数据验证约束及约束中的依赖注入
  9. 『内容模块』批量操作及软删除(回收站)功能使用
  10. 『内容模块』使用Mysql,MeilliSearch,ElasticSearch等多种方式实现全文搜索
  11. 『核心框架』实现一个CRUD框架以抽象化代码
  12. 『核心框架』自建配置系统实现
  13. 『核心框架』嵌套路由与Swagger文档实现
  14. 『CLI工具』使用Yargs构建命令行工具
  15. 『CLI工具』整合bun与pm2实现开发环境与生产环境免编译和自启
  16. 『CLI工具』数据迁移功能的实现
  17. 『CLI工具』数据填充命令及数据工厂的实现
  18. 『用户与权限』用户模块开发以及使用Passport实现JWT认证和无痛刷新
  19. 『用户与权限』基于CASL的RBAC动态角色及权限模块实现
  20. 『用户与权限』使用OAuth2实现Github等第三方登录
  21. 『文件模块』Fastify驱动下的文件上传下载导出及图片流式加载实现等功能的实现
  22. 『文件模块』图片的自动剪裁及压缩实现实现
  23. 『云服务』整合腾讯云SDK实现文件的云存储
  24. 『云服务』用户注册,登录,找回密码绑定邮箱和手机号等验证功能实现
  25. 『高级功能』使用Redis+BullMQ实现基于消息队列的异步短信及邮件验证
  26. 『高级功能』websocket实现即时聊天及消息离线存储功能
  27. 『高级功能』整合Log4j2实现日志功能
  28. 『运维与测试』Nestjs应用的缓存与性能优化
  29. 『性能与运维』使用Jest编写TDD测试以及E2E测试编写
React+Nextjs最佳实践

React18中后台开发实战以及Nextjs13 Nextjs网站开发实战


信息

主要涉及: Vite/React/Nextjs/TailWindCSS/Antd/Zustand/React Router/radix-ui/React Spring/websockets等等

  1. 『基础知识』TailwindCSS使用详解
  2. 『基础知识』常用React Hooks使用详解
  3. 『基础知识』Zustand与Immer的使用以及持久化存储封装(示例: 使用Zustand实现动态暗黑主题,动态皮肤与国际化等配置组件)
  4. 『基础知识』React Router v6.4+的使用详解
  5. 『基础知识』Svg组件与基于Ionify的图标组件的封装
  6. 『基础知识』多种雪碧加载动画的实现
  7. 『中后台面板』React Router封装及懒加载与Loadding的实现
  8. 『中后台面板』路由菜单与布局的初步实现
  9. 『中后台面板』应用右拉设置抽屉实现
  10. 『中后台面板』KeepAlive组件与多标签功能开发
  11. 『中后台面板』顶栏和左栏布局及响应式移动布局实现
  12. 『中后台面板』左栏双菜单嵌入式布局实现
  13. 『中后台面板』使用Axios+Swr.js编写数据加载组件
  14. 『中后台面板』Mock数据服务器实现
  15. 『中后台面板』i18n国际化实现
  16. 『中后台面板』用户登录页面编写
  17. 『中后台面板』动态权限路由和菜单实现
  18. 『中后台面板』面包屑功能实现
  19. 『中后台面板』使用Antd Charts实现可视化仪表盘
  20. 『中后台面板』React-DND拖动库的使用详解
  21. 『中后台面板』Pro components的表单与表格使用详解
  22. 『中后台面板』整合Nestjs实文章管理
  23. 『中后台面板』整合Nestjs实现树形分类,评论管理
  24. 『中后台面板』整合Nestjs实现用户设置
  25. 『中后台面板』整合Nestjs实现云接口等系统设置
  26. 『中后台面板』整合Nestjs实现用户管理
  27. 『中后台面板』整合Nestjs实现复杂的动态字段权限管理
  28. 『中后台面板』Vitest测试编写
  29. 『Nextjs网站』Nextjs核心概念(服务端组件,路由,数据操作,项目结构等)详解
  30. 『Nextjs网站』在Nextjs中使用Zustand,Axios以及Swr.js等库的注意点
  31. 『Nextjs网站』radix-ui与shadcn/ui的使用
  32. 『Nextjs网站』首页布局与Swiper.js的轮播库使用
  33. 『Nextjs网站』网站基本布局及页面骨架实现
  34. 『Nextjs网站』登录页面编写及JWT登录实现
  35. 『Nextjs网站』网站权限动态菜单与面包屑实现
  36. 『Nextjs网站』Github等社会化平台的OAuth登录实现
  37. 『Nextjs网站』React-Spring动画库的使用详解
  38. 『Nextjs网站』MDX的使用详解
  39. 『Nextjs网站』文章发布,列表页面及文章详情页编写
  40. 『Nextjs网站』无限级分类、标签、热门等挂件实现
  41. 『Nextjs网站』网址导航页面实现
  42. 『Nextjs网站』项目案例页面实现
  43. 『Nextjs网站』Websockets消息广播与即时通讯实现
  44. 『Nextjs网站』整合Chatgpt实现自动写文章
  45. 『Nextjs网站』使用Vercel部署网站
  46. 『Nextjs网站』使用Gitea+Drone+PM2+Nginx自建服务器部署Nextjs应用
  47. 『Nextjs网站』Turopack和Turborepo的介绍与使用