跳到主要内容
版本：2026 TECHNEST 项目

视频教程

这里是 TECHNEST 2026 项目的视频中心。

视频随项目进度陆续上线

TECHNEST 2026 正在进行中 —— 每周课程结束后录像会在本页陆续上线。第 1 周至第 6 周已发布，后续周次将随课程推进继续添加。

每周课程录像​

按周次排列的 TECHNEST 2026 课程录像，每条都附带回到对应文字讲义的链接。

第 1 周：AI 开发者工具包安装​

导师自我介绍、本项目用到的 AI 工具栈概览（Cursor、Claude Code、Gemini CLI、MCP 服务器等）、安装演练，以及一次完整的"简单个人网站从开发到部署"实操。

查看完整文字讲义：第 1 周：AI 开发者工具包安装

第 2 周：部署你的个人网站​

第 1 周技术栈回顾、现代 UI 组件库巡礼（Once UI、Magic UI、Shadcn UI、React Bits、Aceternity UI、Radix UI、21st）、专业的"本地 → GitHub → Vercel"CI/CD 工作流、用 Magic Portfolio 这个 Vercel 模板部署个人网站，以及第一次接通 Gemini 2.5 Flash 的轻量版 AI 分身。

查看完整文字讲义：第 2 周：部署你的个人网站

第 3 周：开通 Neon Postgres 并上线访客留言功能​

在 Vercel 控制台里创建 Neon Postgres 数据库并关联到你的个人网站项目，安装 Neon CLI 与 Drizzle ORM，然后为博客文章上线一套访客留言功能 —— 表结构设计、Server Action、前后端串联一条龙。Neon Auth 与访客注册 / 登录会留到下一周再讲。

查看完整文字讲义：第 4 周：全栈进阶 —— Neon + Auth

第 4 周：接入 Neon Auth 登录 + Vercel Blob 图片上传​

接着上周的访客留言板，把 Neon Auth 的 Google 登录接入到个人网站，再开通一个 Vercel Blob 存储桶，让登录后的访客可以在留言中附带图片 —— 通过 Server Action 颁发上传 token、客户端预览、文件头校验，并一路部署上线。

查看完整文字讲义：第 4 周：全栈进阶 —— Neon + Auth（后半部分）与 第 5 周：用 Vercel Blob 上传图片

第 5 周：搭建博客系统​

在 Next.js 项目里"写博客"到底意味着什么 —— Markdown 与 MDX 两种内容格式的区别 —— 以及两条可行的博客系统落地路线：(a) 直接复用 Magic Portfolio 模板里自带的博客路由，或 (b) 注册 Mintlify 账号、连接 GitHub，让 Mintlify 自动为你创建一个独立的 docs 代码仓库。另外还有一段 Office Hour 片段，演示 GitHub 主页 README 的小技巧 —— 创建一个与用户名同名的代码仓库，仓库里的 README.md 会直接渲染在你的 GitHub 主页上。

Office Hour 片段 —— GitHub 主页 README​

第 5 周 Office Hour 的一段录像：创建一个仓库名与你 GitHub 用户名完全一致的代码仓库，在里面放一份 README.md，GitHub 会把这份文件渲染到你的公开主页上。

公开课录像 —— 搭建博客系统​

先讲清楚 Markdown 与 MDX 两种内容格式的区别，然后给出两条实操路线：(1) 直接接入 Magic Portfolio 模板里已经写好的博客系统，或 (2) 注册 Mintlify 账号、连接 GitHub，让 Mintlify 自动为你创建一个 docs 仓库并部署上线。

查看完整文字讲义：第 6 周：搭建博客系统

第 6 周：构建 Slack 应用​

Slack 应用到底是什么、又该如何从零构建一个 —— 为第 7 周"把实时 Slack 通知接入你的项目"那份讲义打好基础。另外还有一段关于 Claude Code Skill 的 Office Hour：什么是 agent skill、现场演示如何用 Chan 自己开源的 svg-animation-studio skill 把品牌 logo 变成一段 SVG 动画，并解答了同学们关于求职和技术栈选择的问题。

Office Hour 片段 —— Claude Code Skill 与 Logo 动画​

介绍 Claude Code skill（可复用的"agent skill"，用来扩展 Claude Code 的能力），并推荐大家试用 Chan 开源的 svg-animation-studio skill 来构建自己的品牌 logo，并据此生成一段 SVG 动画。这一段还解答了关于求职以及如何选择技术栈的问题。

公开课录像 —— 构建 Slack 应用​

先讲清楚 Slack 应用是什么、用在哪里，然后动手从零构建一个 —— 为下一周的实时 Slack 通知工作流打下基础。

查看完整文字讲义：第 7 周：实时 Slack 通知

浏览已有教学视频​

在视频上线之前，欢迎你浏览以往项目的教学视频 —— 其中很多基础内容仍然非常实用：

其他视频资源​

持续更新​

  • 关注本页，TECHNEST 每周课程模块的视频会随课程推进发布。
  • 订阅我们的 Newsletter 获取课程更新通知。
  • 发现内容缺失或过时？欢迎在 GitHub 上提交 issue 反馈。