引言
在上一节《淘东电商项目（22） -Canal数据同步框架》，简单介绍了下Alibab的Canal数据同步框架。
本文代码已提交至Github（版本号：
f5841d3fcfc6d268bf469d946619074f673edcca），有兴趣的同学可以下载来看看：https://github.com/ylw-github/taodong-shop
本文介绍下「淘东项目」的门户界面。
本文目录结构：
1. 门户界面介绍
页面使用的是layui框架来构造的，图标是在http://www.akuziti.com网站里设计的，里面的图片来源于京东生鲜商城（https://fresh.jd.com/）（如有侵权，可以私信我）。下面来看看我的页面设计：
1.1 主页面
1.2 注册页面
1.3 登录页面
2. 门户项目代码
项目使用的是FreeMarker模板引擎渲染Web视图的，如果想知道详细的使用，可以参考之前我写过的一篇博客《微服务技术系列教程（02） - SpringBoot - Web开发》。下面主要讲解下配置的流程：
1.maven添加依赖：
<dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-freemarker</artifactId> </dependency>
2.配置文件配置FreeMarker相关：
server: port: 8080 #### 整合freemarker spring: freemarker: cache: false charset: UTF-8 check-template-location: true content-type: text/html expose-request-attributes: true expose-session-attributes: true request-context-attribute: request suffix: .ftl template-loader-path: - classpath:/templates application: name: app-portal-web ###服务注册到eureka地址 eureka: client: service-url: defaultZone: http://192.168.162.135:8080/eureka
3.添加静态资源以及ftl模板代码（如下图）：
4.Controller层，直接跳转到页面：
/** * description: 首页 * create by: YangLinWei * create time: 2020/3/5 1:48 下午 */ @Controller public class IndexController { /** * 跳转到首页 * * @return */ @RequestMapping("/") public String index() { return "index"; } /** * 跳转到首页 * * @return */ @RequestMapping("/index.html") public String indexHtml() { return index(); } }
总结
本文主要讲解了「淘东电商」项目的门户界面，具体不懂的可以从Github下载代码来详细看（https://github.com/ylw-github/taodong-shop，版本号：f5841d3fcfc6d268bf469d946619074f673edcca）)
