大家好，我是你们的InsCode老师红帽子先生，在之前的课程里我们学习了如何使用InsCode AI IDE 开发小应用，本节我们尝试使用InsCode  AI IDE来开发一些WEB项目。

       下载安装 InsCode AI IDE 

        一般WEB项目中经常要用到数据库，BBS是一个经典的关系数据库页面展示案例，下面我们就以BBS为例来进行本次案例展示。

一、创建工程

        双击“InsCode”图标后进入到欢迎界面，在这里我们可以选择创建Java或Python工程，咱们当前教学案例主要基于Python为主，所以就点击“创建Python工程”进入到“新建工程”的向导界面。

        在“新建工程”页面，我们填写项目名称为“BBS”，然后选择一个位置来创建工程文件夹，然后是Python解释器的环境选择项，可以使用新建一个虚拟环境或使用当前电脑上安装好的Python版本的解释器。点击“创建”后，InsCode AI IDE就按需求创建好工程文件夹，并创建好一个简单的main.py文件作为当前项目的启动文件。

二、代码生成

        下面我们按下CTRL+A全选代码后删除，在空白代码编辑区中按下CTRL+J组合键，呼出AI对话框，在这里输入：“基于streamlit开发一个论坛系统，首页是账号和密码注册与登录，登录完成后显示贴子列表页，可以在列表下方输入标题和内容新建贴子，贴子列表只显示标题和发贴人账号和发贴时间，点击标题后显示详情页，详情页有贴子的标题、发贴人、发贴时间和内容详情，可以继续在下方输入贴子回复。或点击返回链接返回列表页。”

        输入完成后，我们按下回车键，稍作等待后，InsCode AI IDE就会在代码编程区中生成出BBS的代码了。

        Streamlit是一个基于tornado框架的快速搭建Web应用的Python库，封装了大量常用组件方法，支持大量数据表、图表等对象的渲染，支持网格化、响应式布局。简单来说，可以让不了解前端的人搭建网页。

        我们点击“接受”采纳所有的代码，然后在在下方的“终端”里输入“streamlit  run main.py”就可以启动streamlit服务让网页跑起来了。

        命令行运行后，浏览器就会打开，并显示生成的网页结果：

        如果遇到“ModuleNotFoundError”类的错误，一般都是因为当前使用的Python编译器环境没有安装对应的模块，下面我们来安装一下。

        点击下面一排按钮中的“终端”，切换到命令行输入终端，输入“pip install streamlit”进行streamlit的手动安装，pip 是一个通用的 Python 包管理工具，可以帮助我们对 Python 包进行下载、安装、卸载。如果我们感觉下载比较慢，也可以使用清华大学提供的Python包镜像，命令如下：

        pip install -i https://pypi.tuna.tsinghua.edu.cn/simple streamlit

        如果遇到页面上的逻辑错误，我们可以将错误都复制下来，并让AI帮我们修改处理。        

        我们CTRL+J全选代码，然后输入：“修改BUG：”，然后将复制的错误提示黏贴到后面再按下回车键。

        稍等片刻后，AI就会对咱们的代码进行修改，并列出所有的修改行，我们可以回到最上面的对话框点击“接受”以采纳全部修改。再次在终端里运行“streamlit run main.py”，浏览器打这时我们看到网页修复完成：

三、注册与登录

        注册框与登录框一般不放在一个页面上，所以我们可以按下CTRL+J全选代码，然后在对话框里输入：“修改登录页面，让登录页面只显示登录信息输入框和登录按钮，在”登录“按钮右边加一个“注册”的按钮，点击后再显示注册输入页面，在注册输入页面里完成注册，注册成功后跳转回登录页面，同时也会有一个返回链接可以返回登录页面。”在重新对代码进行修改后，我们刷新页面，可以看到登录部分变成了我们要求的样式。

        我们点击“注册”按钮后进入注册页面，输入信息进行注册。

        注册成功后，点击“返回登录”按钮回到登录页面，输入注册信息后，我们点击“登录”，可以看到提示“登录成功”。

五、论坛主题列表与详情

        登录成功后会进入到论坛主题列表页，我们可以输入标题和内容，然后创建贴子。

        创建成功后，会在贴子列表中显示出标题、发贴人、发贴时间。

        在贴子下方会显示出“查看”按钮，点击后进入到详情页，在详情页可以对贴子进行回复。

        回复完成后，就可以在当前详细页看到对应的回复列表了。

六、使用数据库

        现在这个论坛的基本功能我们已经实现了，但是每次刷新页面，数据都会丢失，需要重新注册、登录和发贴子，要想让数据持久化，那我们还需要使用数据库。

        最简单的数据库就是SQLite了，所以我们可以全选代码，然后输入需求：“使用SQLite数据库来存储项目中的输入数据，使得注册账号存在member表中，贴子信息存在post表中，对应的回复信息存在reply表中。”

       在这个数据库里，我们简单指定了一下表名，如果我们熟悉数据库的话，也可以指定具体的表字段，甚至是字段类型，而如果我们不熟悉的话，也可以只通过一句：“修改代码，使用SQLite数据库来存储所有的输入数据！”来完成相应的功能。

        点击“生成”按钮后，AI就开始增加SQLite模块，并创建各个需要的表，根据我们的需求加入相应逻辑了。

        接受修改后，刷新网页，进入论坛，再进行发贴和回复，就可以看到后续即便关了浏览器重开，这些数据就都能够持久显示啦！

七、总结

          今天我们在InsCode AI IDE 的帮助下完成了一个简单的BBS网页小应用，大家是不是觉得特别有成就感呀！

        最后、感兴趣的小伙伴可以加用户群、和红帽子先生一起讨论使用AI来进行网页开发啦！