本文为《TS全栈开发实战》课程的详细介绍页，关于本课程的具体学习和使用步骤，建议查阅社区使用指南
本篇内容下所有的关于“远程工作”的概念只是一个概括说法，也包含了远程工作、海外工作、外企工作、创业型企业的工作等坐班类岗位
📝前言
随着时代的发展以及技术、市场的日新月异之变化，以及3R社区整体方向的不断调整，站长在2024年底规划出了这套新的课程-《TS全栈开发实战》（以下均简称“全栈课”），并于2025年正式开更。全栈课与老课程《nestjs最佳实践》（以下均简称“nestjs课”）的区别在于，全栈课的技术栈（next.js+hono.js+prisma+ai应用开发+serverless等）是一套轻量级的应用开发技能，不仅只适合于远程工作求职，同时，也是个人远程创业者（比如独立应用开发、独立外包接单等）的开发利器。这是一套非常适合“远程自由职业”的技术栈
全栈课是一套主打实用性的JS/TS全栈开发教程，重在快速学会、快速上手。主要目标在于独立自由地开发自己的作品、从事远程个人创业及轻量级的远程工作求职。所以，课程中会涉及大量前端技能（因为初创产品最重要的是让用户或客户看到所见即所得的UI），对后端部分全部采用轻量级开发技术。如果你只专注于高薪远程工作求职并且有非常良好的其它技术栈的经验基础，想找一套研究型的node.js后端开发课程，从而更加深入地掌握ts及node.js方面的高级技能和知识，我建议你看看我们即将重构的《nestjs最佳实践》（以下均简称“nestjs课”）这套课程(此课程是3R起步的课程，我们近期即将对其进行重构上线！)
全栈课虽然是纯技术课程，但是与变现课一样，都是为实现“远程自由职业”（概念详细解释请查看变现课）这个目标而创作的。所以，两者结合在一起学习并实践，效果会更好
此外，在技术层面上，相对于nestjs课，全栈课的学习曲线更加平滑，学习难度也低很多，稍微有些前端或后端的开发基础即可快速掌握。所以，全栈课的目标不仅仅只是帮助会员快速地掌握web领域的前后端开发，同时，也可以通过全栈课可以尽快地学会react、node.js等整个javascript和typescript生态的大多数技能。这样就可以在之后，快速地去融会贯通相关生态的一些其它类型应用的开发。比如react native移动应用、electron桌面应用等
而nestjs课以nestjs+typeorm为主的技术栈，虽然浅度学习还是可以比较轻松地掌握，但是3R的nestjs课和大量外部定位企业级node.js开发的nestjs课程（比如做个案例或按官网文档重复一遍做成视频教程等）那种点到为止或免费或收费的课程不大相同，会大面积深入一些框架和类库本身核心源码的定制、扩展或者涉及到大量服务端生态、底层构建工具开发、命令工具开发、自动化运维和部署等各种基本前后端开发知识之外的东西，学习曲线就会变得非常陡峭。这会造成了许多基础差甚至零基础的会员同学长期无 法学会的现象。所以只推荐已经有相当经验的python、php、java、.net等后端开发者转node.js技术栈，以及对JS/TS编程已经非常熟练掌握且拥有一定的node.js后端开发基础的前端开发者转全栈而学习
以上就是我们开更这套全栈课的技术层面上的原因。在变现层面上，全栈课和nestjs课则各有优缺点。全栈课更侧重于自由职业变现！而在远程工作（包括国内工作、海外工作、外企工作等）求职方面，虽然next.js和react这种偏前端的全栈岗位会比nestjs这种偏后端的全栈岗位多得多，但是会的人也多，学起来也简单。这就导致会求职的时候会卷得多，薪资差距也会非常大，偏后端的TS全栈(比如nestjs应用开发)求职会容易很多而且薪资上会高出许多（但这不代表全栈课就无法求职远程工作，反而用全栈课这套技术栈做远程工作的开发者是主流)。此外，实际开发中，我们很少用到用到nestjs这么重的框架去做一些轻量级快速上线的个人应用作品或web网站。并且，一个后端框架就花费巨大的学习时间成本，对于快速掌握ts的其他多端生态（比如小程序、移动app、web前端、桌面应用、命令行工具等）开发也是非常不利的。为此，全栈课的快速学习和敏捷开发在数字个体创业领域也十分受欢迎
总之，在"远程自由职业"这个范围内，全栈课兼容独立应用开发、外包接单等个人创业模式和远程工作求职两者，但更侧重于个人变现能力，是为结合变现课而创作。nestjs课则更加专注于高薪远程工作及各类坐班求职
🦔准备
在学习本课程前，请务必先学习一下git的安装配置和基本使用以使用我们的课程源码。此外，如果可能的话，最好能有一台macos系统的电脑，这样可以和课程代码的运营环境保持一致。但是如果没有mac，也可以在windows下安装wsl2或者直接装个linux系统来学习。最好不要直接在裸win中装node来跑代码（尤其bun这种工具），后续问题会比较多
如何你是零基础或者其他技术栈的开发者，请在学习本课前请提前学习以下资料
- html5菜鸟教程和css3菜鸟教程
- typescript入门教程
- react官方教程（仅学习起步部分即可）
- postgresql入门教程
- 阮一峰的es6教程和typescript教程以及node.js中文网教程可供查询之用，不必完全学习
✍️学习
一个良好的学习方法，总能达到事半功倍的效果。所以尽量按站长推荐的学习方法和流程学习本课以及正确的使用社区，具体步骤如下
类似git使用、课程问答、[论坛][3rku]账户或商业项目权限开通等此处不再赘述，更详细的流程建议查阅社区使用指南
- 在学习课程前或学习过程中，如果对技术和变现方向比较模糊，可以预约站长进行”一对一“会议咨询
- 通过课程文档学习课程，并自行手动复现每节课的代码
- 在遇到代码跑不通或其他问题时，请克隆仓库中的课程源码，与文档进行对比学习
- 如果遇到实在无法解决的问题，在问题比较简单的情况下可以在QQ群求助助教
- 如果是课程本身BUG问题，请到课程的代码仓库(
classroom/ts-fullstack)中提交工单，站长会抽时间处理 - 在学习完一部分课程后（按课程大纲和你的目标需求来），可以先不用一直学，因为大部分基础的TS全栈开发你已经掌握了。这时候，你应该做的是尝试规划一个属于自己的项目，然后利用TS全栈技术去开发。在遇到需要用到的某项技术时，如果自己不会并且网上资料不多，恰好课程里又有，这时再来学习后续课程里这部分技术相关的内容会事半功倍了
- 在完成你自己的第一个TS全栈web项目的情况下，你可以尝试学习一下同样是TS的electron或者react native（推荐expo框架），然后去开发一款桌面或移动应用，这会加深你的技术的掌握广度和深度。当然，也可以尝试taro这些小程序开发，因为ts能做的事情太多了...
- 如果感兴趣的话，也可以研究到一两个工作室商业项目源码。部分项目可以修改作为自己的案例用于接单或求职需求
- 最后，学习变现课的内容，并按自己的想法和方向尝试结合学习的TS全栈开发技能实践变现，踏入远程自由职业者的行列
- 如果需要求职、招人、接单、融资、合作、售卖作品或服务等，可以关注微信会员群或自行发布消息。如果不希望被不想关的同学加你也可以联系站长帮忙发布（比如发布招聘信息等），这就是我们3R的”资源互助“方式
工作室的商业项目源码由工作室的开发者（教室长期合作的古早期老会员）开发，绝大部分并不是由站长或者助教开发的。所以，在部署、修改及二开方面我们并不能给予太多的帮助，请自行研究。 一些修改后部署的线上效果可以参考miven同学的个人网站
可共享的商业项目源码有五个，我们默认开通了以下项目的源码
- Goflash：一个美国的购物返利网站，使用next.js+antd pro+nestjs开发
- Youni: 一个加拿大的类似校园口袋一样的校园社交移动网站，使用next.js+vben+nestjs开发
- Kuromi：一个加拿大的移民网站，使用next.js+antd pro+nestjs开发
- XiaoWen：一个法国的网络工作室官网（纯静态），使用next.js开发
- Ryzz【默认不开通,有需要联系助教开通】：一个芬兰的仿小红书移动应用，使用react native+antd pro+nestjs开发
如图
📚大纲
本课程以TS全栈开发为核心，主要包含react、next.js、node.js、hono.js、nestjs、AI大模型应用整合开发、服务器运维和部署、serverless等知识与技能。且后续随着时间的推移，我们会不断地增加更多有用的课程，比如桌面应用开发(electron)与移动应用开发(React Native+Expo)等内容
整个课程的内容是环环相扣的，比如TS全栈开发部分的前期板块内容是使用next.js+hono.js写一个cms网站系统。此网站麻雀虽小，但五脏俱全，几乎涵盖了大部分react前端和node.js后端开发的常用生态和知识点。学习后基本上能达到独立开发或远程工作/外企单位/海外求职的水平的，开发后的CMS网站修改后亦可作为自己的个人网站上线。然后结合该部分内容学到的web开发知 识，自己再开发一些作品（因为TS都是想通的，所以利用学到的TS知识不仅可以开发web应用，也可以自行研究一下RN或者Electron来开发一些移动或桌面应用）。而技术课的后半部分则是对这个网站系统不断地扩展，成为一个多用户权限的社区系统。这部分内容不一定要完全学习，在开发自己应用的时候正好遇到这部分课程里涉及的章节，按需查询学习即可。这之后，你可以结合的变现课部分的知识点，开始对求职、独立开发、创业的进行实践！
课程所涉及到的大致知识点如下（下图可能过时，课程在制作中不断调整的，比如增加了一些AI应用开发的知识）
| 课程名称 | 《TS全栈开发实战》 |
|---|---|
| 开更时间 | 2024年12月12日开更，永久维护及回滚迭代 |
| 创作及服务团队 | 创作：站长@pincman；群问答助教：@zhangfeng；论坛问答助教：@cloneable |
| 学习时长 | 建议：3个月左右学习（以零基础或没接触过JS/TS的开发者学习时间计算），然后开始实践 |
| 课程定位 | TS中小型全栈应用开发、自由工作职业规划与变现指南 |
| 课程目标 | 让学习者成为一名js/ts全栈独立开发者以及自由工作者 |
| 适合学者 | 独立产品开发者、外包工作室运营者、技术创业者等各类自由工作者； 远程、外企、海外等岗位的求职者； 所有对JS/TS全栈开发感兴趣的编码爱好者 |
| 学习要求 | 零基础、其他行业转码或 其它技术栈开发者（如Java、PHP、Python、Swift等）转技术栈/前端开发者转全栈 |
| 主要技术 | React(使用Next.js框架)用于前端及全栈开发; Node.js(使用Hono.js框架)用于 后端API开发; Prisma.js ORM用于数据库开发; Tailwind+Shadcn-ui+Antd用于编写UI界面样式等 运维部分、devops(ci/cd)等 一些AI应用开发相关的东西 |
| 教学模式 | 手册文档+课程源码+工作室商业项目源码+群问答+论坛问答等 |
| 源码仓库 | classroom/ts-fullstack |
| 涉及知识 | typescript、node.js、bun.js、react、next.js、prisma.js zod、postgresql、taiwlindCSS、shadcn/ui、antd、 jwt+oauth2(passport.js)、rbac(casl.js)、dayjs、sse、 websocket、bullmq、redis、openapi(swagger)、tdd/e2e测试、 gptapi、支付接口、腾讯云sdk、markdown/mdx、流媒体、性能优化/缓存/日志、 Linux服务器部署运维、Devops(只涉及CI/CD)、monorepo、微服务、AI大模型和接口等 |
整体内容规划图如下（下图可能过时，课程在制作中不断调整的，比如增加了一些AI应用开发的知识）
详细大纲请查看下面的基础、应用、进阶、扩展、变现几部分的目录列表
具体 大纲目录如下（但是随着课程的更新，部分目录可能会有所微调，但大体上内容是没有多少变化的）
🚲基础[维护中]
讲解一些ts全栈开发的一些入门级别和工程构建的知识，包括node.js、react、react hooks、next.js、状态管理等
- node.js环境搭建及应用初始化: zsh配置、node版本管理、tsconfig配置、Eslint配置、断点调试等
- next.js应用初始化：next.js初始化、stylelint配置、css modules、整合shadcn与antd、turbopack、图标库等
- react内置Hooks的使用与自定义详解
- next.js中使用zustand进行状态管理详解：以明暗皮肤为例
- next.js核心概念及应用构建：动态路由、路由组、并行路由、拦截路由、假数据、客户端与服务端组件、server action、表单提交等
🚚应用[维护中]
使用next.js+hono+prisma+postgresql+redis开发一个简单的个人网站博客系统，带有可供客户端使用的后端api并涵盖常见的SEO，页面动效、JWT认证等知识。最后学习一下使用vercel+neno快速简单地部署用用。
学习完本部分课程，可以尝试自由工作。建议边学习后续课程边尝试接单或开发自己的独立作品及网站了。后边的课程也可以作为查询使用，在你开发自己的应用时，用到哪个功能后续课程如果已经制作了，可以作为参考整合到自己的应用中
此外，你还可以利用前15节课程中学到的TS知识去尝试自行拓展学习其它的相关生态，比如RN编写移动应用、Electron编写桌面引用、Taro编写小程序、vite+react编写chrome插件、Node.js编写爬虫等
- server action+prisma全栈开发入门
- markdown编辑器与自研MDX渲染实现
- 用户体验改进与SEO优化：元数据、骨架屏、响应式、表单验证等
- next.js+hono实现全栈开发
- hono整合OpenAPI(Swagger)+Zod实现接口类型安全与可调试
- 使用passport.js+redis实现用户前端JWT认证以及dayjs时间库的封装
- prisma+postgresql开发及第一次应用优化
- prisma实现数据关联与分类的树形无限嵌套结构
- 使用motion+magicui添加网站动效与Landing Page
- 升级tailwindcss到v4以及使用vercel+neon部署
🚄进阶[即将开更]
这部分课程内容是对前面15节课代码的扩展和发散。在原有的博客网站上添加上各种功能，使其变成一个社区网站，并在这个过程中学习各种云计算的API调用、RBAC动态权限、管理后台开发、性能优化、websocket、全文搜索等知识。以此来更加深入的掌握TS的前后双端开发的多种生态
如果是有求职需求（尤其是远程工作、外企、海外本土工作等），学习到此处的26节时，可以着手开发自己的网站和作品并结合变现课尝试求职一份比较好的TS全栈或node.js后端或react前端工作了。后续的学习按兴趣来自己安排即可（也可以直接在学习完24节后跳到"扩展知识"部分学习开发以外的相关技能）
- 使用MeilliSearch实现全文搜索
- 评论模块、项目列表页、软删除等功能实现
- 用户注册、修改密码等功能开发
- 使用腾讯云SDK找回密码、绑定邮箱和手机号等验证功能实现
- 使用Redis+BullMQ实现异步消息队列
- OAuth2(Github等)第三方登录功能实现
- 基于casl.js的RBAC动态权限功能实现
- swr+zustand对数据状态进行管理
- 多国语言实现与整体样式优化
- 使用云存储实现图片上传、裁剪与懒加载
- websocket实现即时聊天及消息离线存储功能
- 动态配置系统实现与第二次应用优化
- 视频断点续传、转码及流媒体播放实现
- nextjs的日志、缓存与性能优化
- 使用sse方式调用chatgpt api实现自动写文章
- 点赞、收藏、关注等社交功能与用户中心开发
- 支付功能与订单系统实现
- 支付宝和微信支付接口的使用
- 收费功能与会员文档系统实现
- 使用Antd和pro components构建应用后台框架
- 后台首页及系统设置开发
- 后台用户与权限管理、内容管理、订单管理开发
🚀拓展[待开更]
这部分内容是对整个技术课程的补充，力求在求职和独立开发时拥有更大的优势。包括devops(ci/cd)、服务器部署运维、AI相关开发、测试等知识点。力求在学习完毕后，一个人能做一个小团队的事情
这部分内容不是必须要学习的，按自己需求来挑选几节对你有用的学习就好。其中2、3、4、5、6部分与nestjs课中的内容重叠，在本部分内容未开更前，继续学习的同学也可以去nestjs课学习这部分内容
- vercel与serverless详解
- 使用Yargs编写安装包
- Linux+Nginx服务搭建与运维
- 使用PM2+Cluster部署应用以及fork进程和多线程的讲解
- 使用Gitea+Drone实现CI/CD热部署
- 分别使用Jest和Vitest编写TDD及单元测试
- E2E测试编写
- cursor及mcp加速开发
- AI大模型的API与SDK使用
- ollama部署本地部署
- 使用dify进行模型编排
- 开发一个自助聊天与客服工具
- node.js实现AI图片生成功
- 微服务架构解说