课程介绍
2026新趋势:尽早成为全链路AI全栈工程师!课程结合AI社交应用,”保姆级”带你完成三大核心:Bun+Elysia+React19+TanStack+PostgreSQL打造效能翻倍全栈基座;LangChain/LangGraph/Deep Agents/Mastra+MCP构建自主决策多Agent工作流;Playwright+LangSmith保障系统稳定交付。你将收获:在面试中脱颖而出的“多端+多Agent+全链路”商业级项目、可复用AI工程化方案。助力用1人团队战力,斩获更多心仪Offer。
课程目录
第1章 把握AI浪潮:解锁时代机遇
1人=AI全栈,你准备好了吗?
第2章 功能实现必备技能之环境配置&知识储备
用户端登录注册:业务与技术方案分析
为什么Bun.js越来越被推崇,称为新一代JS运行时之王
多种安装 Bun.js 的方案,总有一款适合你
Bun.js 速览,掌握常用开发命令,轻松上手!
为什么优选 React19
为什么更多工程师使用 Vite 安装 React
react 和 react-dom 的区别是什么
如何使用 useState 处理 react 中的 状态变量以及相关注意事项
useEffect:React 处理副作用的强大工具
为什么 TanStack Router 被称为React 的更高效路由解决方案
TanStack Router 新玩法:文件即路由
TanStack Router 技巧:用代码驱动路由配置
TanStack Router 页面操作,导航与参数的设置和获取
TanStack Router 特色:loader 并行加载数据 & SWR 缓存
TanStack Router 特色:路由预先加载
React useRef持久化数据的便捷工具
React useLayoutEffect 优化页面渲染的得力助手
React useId 生成唯一ID的便捷 Hook
React props 组件之间通信的好帮手
React useImperativeHandle 自定义父组件可以访问的 ref 值
React 自定义 hook,轻松实现个性化功能
React useDebugValue,调试自定义 Hook 的得力助手
第3章 功能实现必备技能之 CSS 知识储备
为什么工程师们认为 Tailwind.CSS 会重塑前端传奇
Tailwind 尺寸与间距:体验 utility classes 编程的魅力
Tailwind 排版样式速成:从基础到高阶定制(上)
Tailwind 排版样式速成:从基础到高阶定制(下)
Tailwind 布局三板斧:Flex、Grid+定位
Tailwind 颜色系统:样式运用+自定义色彩主题
Tailwind 伪类与伪元素:CSS选择器的高级玩法(上)
Tailwind 伪类与伪元素:CSS选择器的高级玩法(下)
daisyUI 凭什么能在众多UI框架中脱颖而出
daisyUI 快速入门,一学即会
第4章 用户端–登录/注册模块之前端实现
用户登录&注册页面:分析页面布局和技术实现
开发用户登录&注册页面:使用 Tailwind.css + daisyUI – 上
开发用户登录&注册页面:使用 Tailwind.css + daisyUI – 下
表单验证:基于 daisyUI Validator 轻松实现
使用 JS & TanStack & React 快速设置 SEO 信息
基于 Vite 和 TS 配置项目的路径别名
使用 TanStack Query , 高效的异步数据获取工具
使用 Vite 插件来 mock 数据,避免等待接口、提升研发效率
配置 Vite 的 env 环境变量,满足不同开发模式的使用需求
使用 TanStack Query 中的 useMutation 函数,处理用户注册和登录逻辑
第5章 构建 AI 时代的高性能网络引擎 NetworkEngine
AI 应用之 http 请求工具的技术方案分析
构建高性能网络引擎:NetworkEngine 的思路分析
NetworkEngine 实战(一):标准化 ApiError 与多级配置模型
NetworkEngine 实战(二):BaseEngine 通用函数的设计开发
NetworkEngine 实战(三):BaseEngine 中 mergeConfig 开发
NetworkEngine 实战(四):BaseEngine 中 mergeConfig 开发
NetworkEngine 实战(五):分析 FetchEngine 的技术架构
NetworkEngine 实战(六):实现 FetchEngine 的核心业务逻辑
NetworkEngine 实战(七):实现 FetchEngine 的核心业务逻辑
NetworkEngine 实战(八):实现 FetchEngine 的核心业务逻辑
NetworkEngine 实战(九):实现引擎的指挥调度中心
基于 NetworkEngine 发送网络请求
基于 ReactDOM createRoot 实现 toast 弹窗组件
React 项目全局状态管理的技术选型分析
使用 Zustand 处理全局用户状态
使用 Zustand persist 中间件持久化数据
第6章 功能实现必备技能之 PostgreSQL 数据库
为什么 PostgreSQL 被认为是 AI 时代的首选全能数据库
Docker 安装 PostgreSQL,使用 pgAdmin 工具操作数据库
PostgreSQL入门:字段类型和约束(上)
PostgreSQL入门:字段类型和约束(下)
PostgreSQL 入门:必备的增删改查技能(上)
PostgreSQL 入门:基础查询与条件过滤(上)
PostgreSQL 入门:基础查询与条件过滤(下)
PostgreSQL 入门:常用的五大类函数
PostgreSQL 入门:常用的五大类函数 SQL 实战
PostgreSQL入门:关键字的底层执行顺序
第7章 功能实现必备技能之 Elysia.js 全栈框架
为什么 Elysia.js 被称为必学的高性能 AI 全栈框架
Elysia.js 核心概念与快速入门
Elysia.js 核心:掌握 GET&POST 路由与数据验证
从单体到模块化:基于 .group() & .use() 构建优雅的 Elysia 架构
API 架构设计:使用 .derive() 实现 api 接口响应规范插件
异常防御架构:基于 .onError() 打造全场景错误拦截插件
使用 Bun 快速操作 PostgreSQL 数据库
常用的 ORM 框架技术选型分析
Drizzle 速通,增删改查快速上手