找到下一步,再动手

把零散的笔记,
串成自己的路线。

刚开始可以从基础读起,已有经验就直接选一个目标。
这些路线组织本站的现有笔记,会随文章一起补充。

先把浏览器基础打牢

理解布局、异步与交互,后面的框架学习会轻松很多。

试着完成做出能适应不同屏幕、键盘也能操作的小页面。

  1. CSS约 4 分钟

    用 CSS Grid,搭一个会呼吸的页面

  2. CSS约 3 分钟

    别让键盘用户迷路:做好焦点样式

  3. JavaScript约 3 分钟

    从一段输出顺序,看懂事件循环

  4. JavaScript约 3 分钟

    搜索请求乱序了?用 AbortController 收尾

用 Vue 把界面组织起来

从响应式状态出发,把可以复用的逻辑放进组合式函数,再用 Vite 跑起项目。

试着完成完成带搜索、加载状态和请求取消的 Vue 页面。

  1. Vue约 4 分钟

    Vue 响应式入门:把 ref、reactive 和 computed 用在合适的位置

  2. Vue约 4 分钟

    Vue 组合式函数:让搜索请求和清理逻辑一起复用

  3. Vite约 4 分钟

    从零启动 Vue + Vite:分清 dev、build 和 preview

从 React 的数据流开始

先分清输入和派生数据,再思考哪些状态需要保存。

试着完成实现不依赖额外 Effect 同步的列表筛选。

  1. React约 3 分钟

    React 状态少一点,组件清楚一点

让项目从开发走到上线

配置、构建和性能都需要验证。把本地能运行,推进到部署后也可靠。

试着完成分清开发代理与生产接口,建立一份性能基线。

  1. Vite约 4 分钟

    从零启动 Vue + Vite:分清 dev、build 和 preview

  2. Vite约 4 分钟

    Vite 环境变量与代理:开发能访问,线上为什么不行?

  3. 工程实践约 3 分钟

    页面为什么慢?先看清,再优化

把 AI 接入开发与产品

让 AI 帮助理解和实现,再用可复现的检查确认结果;产品接入也要有清楚的边界。

试着完成建立代码审查习惯,设计可取消、有错误反馈的 AI 交互。

  1. AI约 4 分钟

    让 AI 帮你写前端,先把验证流程搭好

  2. AI约 4 分钟

    前端接入 AI:接口之外,还要处理这些交互边界

找一篇笔记

输入关键词,或浏览全部文章。

按 Tab 选择文章Esc 关闭