学习路径
简介
以“数据智能助手（data agent）”为例，一个 AI 应用的完整工作流程大致如下：
-
用户在 React + TypeScript + CSS 构建的美观界面上传数据并提出问题。
-
前端 JavaScript 捕获用户的交互行为，并通过 API 向后端发送请求。
-
后端 Python 服务接收到请求后，可能先访问 MySQL 查询用户权限或历史记录。
-
后端根据用户请求，通过提示词工程构造高质量 Prompt，并调用 AI 模型进行推理。
-
AI 模型给出结果后，由 Python 进一步处理，通过 API 返回前端。
-
前端 React 根据返回结果动态渲染界面，以图表或文字的形式展示分析内容。
下面的内容将从 前端、后端与数据层、提示词工程 三大方向介绍学习路径。
学习路径
前端
负责用户交互与界面展示，运行在浏览器端，决定产品的“颜值”和“用户体验”。
React
构建现代 UI 的核心框架，用于创建数据表格、对话框、图表、按钮、输入框等所有展示组件。
学习指引
JSX 语法 → 函数组件与 Hooks → 状态与属性 → 路由 → 状态管理（如 Redux） 核心思想：组件化开发。
- 教程：
- 实践项目
JavaScript
前端的核心编程语言，是 React 的基础；负责逻辑处理、用户事件、API 通信等。
学习指引
基础语法 → DOM 操作 → 异步编程（Promise/async/await） → ES6+ 特性
重点理解：事件循环、闭包、原型链。
- 教程：
- 实践项目
TypeScript
JavaScript 的增强版本，为大型应用提供静态类型、安全性与更好的可维护性。用于构建更复杂的 React 项目。
学习指引
类型基础 → 接口 → 泛型 → 在 React 项目中的综合使用
- 教程：
书籍：《TypeScript从入门到项目实践》
- 实践项目：
使用 React + TS 重构一个原先用 JS 写的小项目
CSS
负责界面样式、美观和布局。
学习指引
盒模型 → 布局（Flexbox + Grid） → 响应式设计
- 教程：
- 实践项目：
后端与数据层
负责业务逻辑、AI 推理服务与数据管理。运行在服务器端，是系统的“大脑”和“记忆”。
Python
后端开发的核心语言，既负责 AI 模型推理，也负责 RESTful API 开发。
用途
-
AI 服务：使用 PyTorch、Transformers 等库加载和运行模型
-
业务逻辑：使用 FastAPI/Django 编写后端接口，处理前端请求
-
数据处理：Pandas/Numpy 清洗与分析数据
学习指引
语法 → 面向对象 → Web 框架 → 数据分析库 → AI 工具链
- 教程：
- 实践项目
MySQL
关系型数据库，负责核心业务数据的持久化，如用户权限、产品配置、操作记录等。
学习指引
SQL 语法 → 索引 → 事务 → 数据库设计范式
- 教程
- 实践项目
暂无
提示词工程
AI 应用工程师特有技能，与前端、后端深度结合。
作用
-
后端：Python 代码构造高质量 Prompt，引导模型生成符合需求的结果
-
前后端协作：前端的输入内容、上下文、历史数据都会影响提示词构造
-
目标：让模型“听懂你的指令”并输出符合需求的高质量结果
学习指引
提示词设计技巧：
-
分步推理
-
示例（Few-shot）
-
明确约束条件
-
控制模型风格
-
教程
- 实践项目
暂无（建议在真实项目中积累经验）
下一步去哪？
-
前后端联调 —— 将前端 React 与后端 FastAPI 连起来
-
部署上线 —— 使用 Docker、Nginx、云服务器上线
-
模型优化 —— 加载大模型、缓存响应、加速推理
-
数据智能应用深化 —— 构建自动清洗、分析、可视化的一体化 data agent
-
探索开源项目 —— GitHub、HuggingFace、LangChain 等社区