基于华为开发者空间开发平台-云开发环境（容器）完成商城开发-优快云博客

案例简介：本案例基于华为开发者空间开发平台-云开发环境（容器），完成JavaWeb商城开发。

一、概述

1. 案例介绍

华为开发者空间，是为全球开发者打造的专属开发者空间，致力于为每位开发者提供一台云主机、一套开发工具和云上存储空间，汇聚昇腾、鸿蒙、鲲鹏、GaussDB、欧拉等华为各项根技术的开发工具资源，并提供配套案例指导开发者从开发编码到应用调测，基于华为根技术生态高效便捷的知识学习、技术体验、应用创新。

面对海量用户并发开发、测试对资源弹性与隔离性的高标准要求，华为开发者空间开发平台 - 云开发环境（容器）深度融合了弹性云主机的高性能计算与容器技术的敏捷弹性，通过构建集高效计算、安全隔离、敏捷部署于一体的云原生基础设施，不仅保障了云开发环境的稳定可靠，更实现了资源的秒级伸缩与高效利用，为加速应用创新提供了坚实底座。

本案例基于华为开发者空间开发平台-云开发环境（容器），完成JavaWeb商城开发。

2. 适用对象

企业
个人开发者
高校学生

3. 案例时间

本案例总时长预计90分钟。

4. 案例流程

说明：

浏览器登录华为开发者空间开发平台 - 云开发环境（容器）平台，web端实现容器的创建、开机等操作；
PC本地通过VS Code安装Huawei Developer Space插件，远程连接云开发环境（容器）;
在容器中使用VS Code编写并运行应用代码，使用浏览器体验JavaWeb商城应用。

5. 资源总览

本案例预计花费0元。

资源名称	规格	单价（元）	时长（分钟）
华为开发者空间开发平台 - 云开发环境（容器）	鲲鹏通用计算增强型 kc1 \| 2vCPUs \| 4G \| HCE	免费	90

二、云开发环境（容器）操作及远程连接

1. 创建及连接云开发环境（容器）

参考案例华为开发者空间 - 云开发环境（容器）IDE插件远程连接操作指导中安装插件-登录-创建-开机-连接操作步骤，连接云开发环境。

三、JavaWeb商城应用开发

1. 下载项目代码

下载项目代码，代码仓地址：https://gitcode.com/hahale2021/Mall.git

2. 项目结构

使用容器做一个简单的商城应用，项目结构如下图所示：

src/main/
├──java/com/example/developer/
    ├── DeveloperApplication.java 
    ├── controller/
    │   └── ProductController.java
    ├── model/
    │   └── Product.java
    └── service/
        └── ProductService.java
├──resources/
    ├──templates/product/
        ├──add.html
        ├──edit.html
        ├──list.html
    ├──application.properties
├──pom.xml

后端代码：
DeveloperApplication.java：主启动类，由于我们采用的是Java容器，主启动类已经默认内嵌，因此，不需要再做变更，直接采用原有启动类即可
Product.java：商品模型类，Product类用于定义商品的ID、名称、价格、库存、描述等
ProductService.java：商品服务类，ProductService类用于初始化商品信息、操作商品增删改查等功能
ProductController.java：控制器类，ProductController类用于和前端交互等功能
前端代码：
list.html：商品信息展示页面
add.html：添加商品页面
edit.html：编辑商品页面
application.properties:前端配置文件
Maven依赖：
pom.xml：Maven依赖配置文件

3. 配置文件修改

打开src/main/resources/下的application.properties文件，为防止本地服务端口号冲突，这里修改为8085，如下图所示：

# 应用配置
spring.application.name=developer
# Thymeleaf配置
spring.thymeleaf.prefix=classpath:/templates/
spring.thymeleaf.suffix=.html
spring.thymeleaf.mode=HTML
spring.thymeleaf.encoding=UTF-8
spring.thymeleaf.servlet.content-type=text/html
# 服务器配置
server.port=8085