从零开始:前端转型AI agent直到就业第十四天-第十七天

前言

接近8.9年老前端了,34岁,双非普本,坐标广州,25年底被裁员,然后这三个月内也有去投简历,也有面试,有一些推进到二面然后就没有下文,不禁感叹现在的大环境实在不怎么样,而且前端在AI的冲击下也是最受影响的,除了音视频,图形化方面还能蹦跶一下,AI已经能完成80-90%的前端工作,在学历以及就业背景都不是特别强的情况下,一般的前端哪怕你技术还不错,你也很缺竞争力;在失业这三个月经历了持续学习、迷茫到看到曙光,决定要转型自学做AI agent;

大纲

  • 前一天心路历程
  • 前一天的时间分配(不限于学习,也会有运动)
  • 前一天的知识总结(前期或许较少)

心路历程

最近完成了langchain跟langgraph的一些相关知识点的学习,准备进入实战阶段,但是最近减少了没有锻炼了,明天还要复建才行,毕竟身体最重要,下次发文章的时候大家应该可以看到我产出的智能体项目,以及我的项目回顾跟总结,我自己也很期待

对了大家有没有什么可以提升专注力的办法,有时候总感觉专注力容易飘散,特别是学习一些概念知识的时候,不知道是不是没有动手写代码的原因,感觉有时候整理知识文档之后需要一些时间去消化跟回味

最近都有多看看伟人留下的话语,让我经常感受到我跨越时空的力量在鼓励着我

时间分配

最近的学习时间不是很标准,早上有时候都要9点多才醒,然后盯一下股票,休息时间还变长了,还没锻炼,批评一下自己

知识总结

这些天基本完成了LangGraph体系的知识图谱的学习,基本理念已经掌握,下面就发一下最基础的概念吧

LangGraph 基础概念

一、一句话理解 LangGraph

LangGraph = LangChain 的"图级编排器"

把线性流水线变成地铁网,支持分支、循环、等人、回退、模块化。

生活比喻:

  • LangChain 像流水线:A→B→C,顺序固定
  • LangGraph 像地铁图:可分支、循环、折返、换乘

二、核心四要素

概念 作用 代码对应
State(状态) 节点间传递的数据 class StateObj(TypedDict)
Nodes(节点) 执行具体任务 graph.add_node("model", modelCb)
Edges(边) 定义执行顺序 graph.add_edge(START, "model")
Graph(图) 整体结构容器 StateGraph(StateObj)

三、基本连接llm代码

python 复制代码
from typing import TypedDict, Annotated, List
from langgraph.graph import StateGraph, START, END
from langgraph.graph.message import add_messages
from langchain.chat_models import init_chat_model
from dotenv import load_dotenv
import os

load_dotenv(encoding='utf-8')

# ========== 1. 定义状态(State)==========
# 关键:Annotated + add_messages 实现消息追加而非覆盖
class StateObj(TypedDict):
    messages: Annotated[List, add_messages]

# ========== 2. 初始化大模型 ==========
llm = init_chat_model(
    model="qwen-plus",
    model_provider="openai",
    api_key=os.getenv("aliQwen-api"),
    base_url="https://dashscope.aliyuncs.com/compatible-mode/v1"
)

# ========== 3. 定义节点函数 ==========
# 关键:每个节点接收当前状态,返回部分更新
def modelCb(state: StateObj) -> StateObj:
    reply = llm.invoke(state["messages"])
    return {"messages": [reply]}  # 只返回变化的部分,LangGraph 自动合并

# ========== 4. 构建图 ==========
graph = StateGraph(StateObj)           # 创建图,绑定状态类型
graph.add_node("model", modelCb)       # 添加节点
graph.add_edge(START, "model")         # 起点 → 模型节点
graph.add_edge("model", END)           # 模型节点 → 终点

# ========== 5. 编译运行 ==========
app = graph.compile()
result = app.invoke({"messages": "请简单说明一下LangGraph的运作流程"})
print(result["messages"][-1].content)

# ========== 6. 可视化图结构 ==========
#1. 打印图的ascii可视化结构
print(app.get_graph().print_ascii())
print("="*50)

#2. 打印图的Mermaid代码可视化结构并通过https://www.processon.com/mermaid编辑器查看
print(app.get_graph().draw_mermaid())

四、代码中的三个关键机制

1. Annotated[List, add_messages]

  • 作用: 告诉 LangGraph 新消息追加到列表末尾,而不是覆盖
  • 不加的话: 每次返回 {"messages": [reply]} 会丢掉之前的对话历史

2. 节点函数只返回部分状态

  • LangGraph 自动将返回值合并到当前状态
  • 不需要返回整个 StateObj,极大简化代码

3. graph.compile() 的作用

  • 验证图结构(无孤立节点、无不可达节点、无非法循环)
  • 生成可执行的 Runnable 对象
  • 为后续扩展(checkpointer、interrupt 等)做准备

五、LangGraph 的重要特性

以下是 LangGraph 区别于普通 Chain 的核心能力:

1. 条件分支(Conditional Edges)

  • 是什么: 根据当前状态选择不同路径
  • 代码示例:
python 复制代码
def route(state):
    if state["need_human"]:
        return "human_node"
    return "model_node"

graph.add_conditional_edges("model", route, {"human_node": "human", "model_node": "model"})
  • 生活比喻: 地铁到站后,根据乘客目的地决定换乘哪条线

2. 循环(Cycles)

  • 是什么: 边可以指回之前的节点,形成循环
  • 典型场景: 信息不足时重复搜索,直到条件满足
  • 生活比喻: 坐错站了,坐回头车回到上一站

3. 持久化与断点续跑(Persistence & Interrupt)

  • 是什么: 使用 checkpointer 保存状态,程序重启后可恢复
  • 代码示例:
python 复制代码
from langgraph.checkpoint import MemorySaver
app = graph.compile(checkpointer=MemorySaver())
# 中断后可从保存点恢复执行
  • 生活比喻: 游戏存档,退出后能接着玩

4. 人机协作(Human-in-the-Loop)

  • 是什么: 图中插入人工节点,interrupt 暂停等待人工输入
  • 典型场景: AI 生成内容后人工审核、敏感操作前人工确认
  • 生活比喻: 自动驾驶遇到复杂路口,让司机接管一下

5. 子图(Subgraphs)

  • 是什么: 一个节点可以是另一个完整的 StateGraph
  • 好处: 模块化、可复用、独立测试
  • 生活比喻: 地铁环线本身是一个完整的图,可以被嵌入全市地铁网

6. 时间旅行(Time Travel)

  • 是什么: 回退到历史某个状态重新执行
  • 生活比喻: 游戏中的"读档"功能

7. 多智能体协作(Multi-Agent)

  • 是什么: 多个 Agent 节点在同一图中分工、协调、竞争
  • 架构模式: 网络式、层级式、监督式等

8. 可观测性(Observability)

  • 是什么: get_graph().print_ascii() 直接打印执行路径
  • 好处: 清晰看到 Agent 的决策路径,快速定位问题
  • 生活比喻: 地铁线路图贴在墙上,永远不会迷路

六、适用场景速查

✅ 适合 ❌ 不适合
多步复杂推理 简单一次性问答
需要循环/分支的逻辑 线性链就够用的场景
长时间运行任务(需持久化) 快速原型验证
需要人工介入
多智能体协作
追求生产级可观测性

七、总结

State 是灵魂,Node 是手脚,Edge 是路线,Graph 是地图。

LangGraph 的核心价值在于:把 AI 工作流从线性锁链 变成可控的网络,让你能自由实现分支、循环、持久化、人机协作、模块化复用等复杂逻辑。


目标

成为AI agent工程师并且就业

帮助

需要大家的关注跟点赞,你们的关注点赞就是对我最大的鼓励,或许以后待以后我技术成熟时,你们中间的大佬还可以捞一捞我,感谢

相关推荐
逍遥归来2 小时前
窥探Claude Code源码:Context上下文管理机制
人工智能
changshuaihua0012 小时前
React 入门
前端·javascript·react.js
workflower2 小时前
机器人应用-楼宇室内巡逻
大数据·人工智能·算法·microsoft·机器人·动态规划·享元模式
电子科技圈2 小时前
从进迭时空K3看RISC-V CPU与Imagination GPU协同:如何构建高性能SoC能力
大数据·图像处理·人工智能·嵌入式硬件·边缘计算·智能硬件·risc-v
ZPC82102 小时前
fanuc 机器人通过PR寄存器实现轨迹控制
人工智能·算法·计算机视觉·机器人
兰为鹏2 小时前
做前端需求总结出的非常好用的skill
前端
阿里云大数据AI技术2 小时前
EMR Serverless Spark 推出 Spark 4.0,加速湖仓架构下的数据处理升级
大数据·人工智能·spark
hERS EOUS2 小时前
Spring Boot + Spring AI快速体验
人工智能·spring boot·spring
笨笨狗吞噬者2 小时前
Opus 4.7 skill 编写和使用实践
前端·ai编程