创建和运行示例应用程序
本文将直接使用平台自带的天气预报示例项目，快速展示全栈应用程序的创建和运行过程。
如您想从零开始创建一个应用程序，请参考 SnapDevelop快速上手。
前提条件
安装组件
SnapDevelop 安装程序将自动安装全栈应用程序设计器项目所需的组件和环境。
配置网络环境
请确保当前机器可以连接互联网，以便可以成功从 NuGet 源站点下载软件包。
如果是通过代理连接互联网的话，请首先确认代理正常工作，而且例外列表中没有排除掉 NPM 源相关的站点。然后通过 NPM 命令设置代理 IP 和端口，例如：npm config set proxy=“http://[ProxyIP]:[Port]/”。
如果网络连接正常，但 SnapDevelop 仍然提示网络连接错误，请重新启动 SnapDevelop IDE 后再尝试一次。
检查 Node.js 版本
在 SnapDevelop 中创建前端项目时要求使用 Node.js v20.11.1。
SnapDevelop 安装程序默认安装的 Node.js 版本为 v20.11.1。
但是如果您在机器上重新安装或升级了 Node.js 版本，您可以在终端窗口中输入命令： node -v 查看 Node.js 当前版本。
创建及运行应用
我们将直接运行一个包含 WeatherForecast 示例的设计器项目。
在此演示中，我们将选择 全栈应用设计 项目类型，选择 PC 默认视图设备及 包含示例案例，然后为其自动生成 Web API 后端及前端应用程序。
示例案例中默认包含一个实体文件、两个逻辑文件、以及七个视图（用于添加/获取/编辑、主页、以及布局）。 您可以直接生成并运行项目，无需做任何修改。
步骤 1：创建一个包含示例的全栈应用程序设计器项目。
从 文件 > 新建 > 新建项目，选择 低代码 选项卡； 然后选择 全栈应用设计 并单击 下一步。
保持默认设置，单击 创建。
项目显示在解决方案资源管理器中。该示例项目包含以下文件：
- 一个实体设计文件 ：WeatherForecast.sde 配置了基本的数据结构。
- 两个逻辑设计文档：City.sdlg 和 WeatherForecast.sdlg 配置了基本的过滤器及方法。
- 七个视图设计文件：City.sdv（概览多个城市天气数据）、CreateOrEdit.sdv（添加或编辑数据）、InfoCard.sdv（显示某个城市天气的详情）、List.sdv（显示所有城市天气列表）、Statistics.sdv（显示数据统计）、Home.sdv（应用的主页）、Layout.sdv（应用的布局）。
- logo.png等图片文件：应用的logo等图片文件。
步骤 2（可选）：双击实体设计文件或逻辑设计文件在设计器中查看或修改相关设置。
WeatherForecast.sde 实体设计文件：
City.sdlg 逻辑设计文件：
WeatherForecast.sdlg 逻辑设计文件：
步骤 3（可选）：双击视图文件在视图设计器中查看或修改视图设置。
步骤 4（可选）：点击 IDE 工具栏的 自定义数据结构 图标（
)查看和修改枚举和模型。
步骤 5：从设计项目生成项目。
单击 IDE 工具栏上的 生成项目 下拉按钮然后选择 Profile；或右键单击项目节点，然后选择 生成项目。
在 Profile 窗口的右上角单击 生成项目 按钮。
将生成以下两类项目：
后端服务类：
- [project].Common：被合约层或认证服务层引用或依赖的开发工具包和扩展功能。
- [project].Contracts：定义服务合约的合约层。
- [project].Controllers：定义服务控制器的控制器层。
- [project].Repository：数据访问层，例如 EF Core，其中包含与数据库相关的配置（存储库、工作单元、DbContext）和数据初始化（值比较器、值转换器）。
- [project].Services：实现合约的服务层。
- [project].WebApi：向用户发送数据的表示层。
前端展示层：
- [project]_H5：H5应用的前端展示。
- [project]_Uniapp：Uniapp应用的前端展示。
- [project]_Web：Web应用的前端展示。
步骤 6：运行项目。
1）首先从 IDE 工具栏运行 [project].WebApi 项目以启动后端 Web API。
当 Web API 成功运行后，您将看到以下界面。
2）从工具栏选择 [project] 项目以启动前端 Web 应用程序。
