FastApi python, React TS 快速构建AI agent开发

----------------------------------react ts -------------------------------

npx creat-react-app react-basic
npm run start

JSX:在js中编写HTML,js表达式,列表渲染,list.map(),函数,
组件:首字母大写的函数
useState 状态变量:是一个react hook函数 :setCount(),setForm()
css样式:className="foo"
list.filter(item=>item.userid !==userid)
babeljs.io

ant design:蚂蚁PC组件库
npm install antd --save
import {Button} from antd

router包,页面路由组件
npm -i react-router-dom

@提示符路径:webpack别名 craco
vscode别名jsconfig.json

Form
npm i axios
根域名配置
超时时间
请求拦截器/响应拦截器

redux 管理token

token持久化: redux + localstorage
初始化token:

打包发表
npm run build
本地测试
npm install -g serve
serve -s build

路由懒加载:按需加载:lazy,suspense

包体积分析:source-map-explorer

包优化:CDN 就近访问

https://www.bilibili.com/video/BV1ZB4y1Z7o8?spm_id_from=333.788.player.switch&vd_source=0095e0bfb5fc84322a9666fcd01fc77d&p=84

使用vite创建项目 react + ts 项目:
npm create vite@latest my-react-app -- --template react-ts
npm i
npm run dev

----------------------------fastapi python ---------------
FastApi python web框架

uvicorn main:app reload

source .venv/bin/activate 进入创建好的虚拟环境
deactivate 退出当前虚拟环境
python --version
pip install --upgrade pip 升级pip
pip install fastapi[all]==0.111.0
pip install -r requirements.txt
fastapi --version
运行fastapi:
uvicorn main:app --port 9099 --reload

from pydantic import BaseModel
Field

FASTAPI内置响应类型:
JSONResponse 默认返回json数据 {“key":"value"}
HTMResponse
PlainTextResponse
FileResponse
StreamingResponse
RedirectResponse

from pydantic import BaseModel

class News(BaseMode):
id: int
title: str
content:str

@app.get("/news/{id}",response_model=News)
async def get_news(id: int):
return {
"id": id,
"title”:f"这是第{id}本书”,
"content”:"这是一本好书”
}

@app.get("/html", response_class=HTMLResponse]
async def get_html():
return "

这是标题

"

@app.get("/file")
async def get_file():
file_path = "./files/1.jpeg"
return FileResponse(file_path)

HTTPException:

@app.get("/news/{idl")
async def get_news(id: int):id_list = [1, 2, 3, 4, 5, 6]if id not in id_list:
raise HTTPException(status_code=404,detail="您查找的新闻不存在)
return {"id": id}

orm: sqlalchemy,aiomysql

posted @ 2026-06-06 15:54  大树2  阅读(4)  评论(0)    收藏  举报