# 《AI Agent 场景应用 - ai draw.io》第4-1节:初始化工程搭建
作者:小傅哥
博客:https://bugstack.cn (opens new window)
视频:待更新
沉淀、分享、成长,让自己和他人都能有所收获!😄
# 一、本章诉求
初始化搭建 ai draw.io 前端工程,因为 draw.io 的开发插件是 React 语言的,所以我们也要基于 React 语言构建工程。
这部分前端的内容,会使用即可。如果感兴趣,也可以在 TypeScript 官网学习下,它的语言结构也比较清晰,甚至和我们学习的 Java 是有类似的地方的。
本节初始化工程搭建开发后,就可以基于 AI IDE 工具,来完成后续的开发了。这部分对后端程序员是比较友好的。当然找工作,一般后端岗位是不会问前端的,所以你可以仅仅是当做使用即可。
# 二、开发环境
- Node.js v20+ - https://nodejs.org/zh-cn (opens new window) - 下载安装即可。
- WebStorm 2023.1 - 因为自带了开发前端的工具,所以非常好用。星球课程入口,编程环境,软件下载。里面提供了安装包。地址:https://drive.weixin.qq.com/s?k=ACMA4AfQABU0svnJ27 (opens new window)
- 源地址设置;
npm config set registry https://registry.npmmirror.com- 安装好环境后,设置下源地址。否则在后面构建项目会很慢。 - TypeScript01:https://www.runoob.com/typescript/ts-tutorial.html (opens new window) - 课程资料,简单的菜鸟入门教程。学习之后也能看懂 TypeScript 代码。所有的面向对象语言代码,基本是通用的。
- TypeScript02:https://typescript.bootcss.com/namespaces.html (opens new window) - 课程资料,简单的菜鸟入门教程。学习之后也能看懂 TypeScript 代码。所有的面向对象语言代码,基本是通用的。

