jsp 网站模板-04 《SpringBoot入门教程》使用模板引擎开发Web项目

1. 序言

模板引擎这个词听起来有点高大上。

事实上,模板引擎是一项非常平易近人的技术。 例如,您可能熟悉的JSP就是一个典型的模板引擎。

当浏览器向控制器抛出请求,控制器处理数据后,跳转到JSP等模板引擎页面。 注意jsp 网站模板,跳转的同时,数据会被组装起来,交给模板引擎处理。

模板引擎会根据数据和模板引擎的规则动态生成HTML页面,最后返回给浏览器显示。

2. 模板引擎使用场景

我们使用SpringBoot来开发Web项目,一般有两种方法。

第一种方法是前端服务的方法,这也是目前主流的方法。 后端是一个静态的HTML页面,通过Ajax请求SpringBoot的前端socket。 SpringBoot返回的数据通常是JSON格式,后端收到后会显示数据。

第二种方法是采用模板引擎方法。 后端请求到达SpringBoot控制器后,控制器处理请求,然后将数据返回给模板引擎。 模板引擎负责根据数据生成HTML页面,最后将HTML返回给浏览器。

我个人推荐第一种方法,我来说一下这种方法的几个优点:

这篇文章讲的是模板引擎,也不得不说说模板引擎的优点。 王婆卖瓜不能只夸樱桃。 模板引擎开发的页面对搜索引擎SEO更加友好; 还有简单的页面,如果使用模板引擎可以更快地开发,虽然模板化的方式是为了减少重复,提高效率。

3.SpringBoot中常用的模板引擎

SpringBoot支持的模板引擎有很多种,常见的有FreeMarker、Thymeleaf、JSP等。

由于使用该模板引擎的用户较多,我们将一一介绍其实现过程。

至于哪个更好,请大家自行判断。 俗话说:尺有所短,寸有所长,各取所爱,万物生长!

4、总体流程说明

在本文中,我们开发了一个产品浏览项目的示例。

这里是我个人的经验:在做一个项目或者一个模块的时候,不要一开始就手写代码,最好先做出决定然后再行动。

我们作为程序员,实际上是整个编程世界的总司令。 先总体规划,再局部实施。 这些总分的制定方法可以让我们理顺思路,提升编码效率!

编码就像行军,先了解地形,制定总体作战方案,然后派兵执行任务(图片来源于网络jsp 网站模板,版权归原作者所有)

好吧,我们来思考一下商品浏览项目实例实现的整体流程:

整体流程

可以看出,我们首先构建了控制器方法和页面,然后再实现具体的细节。 这可以让我们的思维保持连贯性和整体性,在做页面和技巧更多的项目时我们会感觉更顺畅。

5.使用FreeMarker

根据整体流程,我们使用FreeMarker模板引擎来实现商品浏览功能。

5.1 创建SpringBoot项目并导出开发环境

使用SpringInitializr创建项目,选择SpringBoot版本2.2.5,Group为com.imooc,Artifact为spring-boot-freemarker,生成项目后导出Eclipse开发环境。

5.2 在pom.xml中引入相关依赖

引入Web项目和FreeMarker模板相关的依赖,代码如下:

例子:

        
        
            org.springframework.boot
            spring-boot-starter-web
        
        
        
            org.springframework.boot
            spring-boot-starter-freemarker
        

5.3 创建指向产品页面的控制器方法

创建一个控制器类,因为是产品相​​关的控制器,所以命名为GoodsController,代码如下:

例子:

/**
 * 商品控制器
 */
@Controller // 标注为控制器
public class GoodsController {
    /**
     * 获取商品列表
     */
    @RequestMapping("/goods") // 请求路径
    public String goods() {
        return "goods";// 跳转到goods.ftl页面
    }
}
代码块12345678910111213

我们详细解释一下这个类的作用。

Tips:注意需要在application.properties文件中设置模板文件的后缀,即:spring.freemarker.suffix=.ftl。 如果不添加此配置,则直接返回“goods.ftl”; 会报错。

5.4 创建产品页面

我们在resource/templates目录下新建一个商品页面goods.ftl,不先实现具体功能,代码如下:

例子:




    
    商品列表


商品列表


此时,我们启动项目,然后访问:8080/goods即可显示对应页面的内容。

5.5 在控制器方法中,调用服务方法获取产品信息,并将信息传递给模板引擎处理

定义产品类GoodsDo来描述产品信息。 请注意,Do 表示数据模型对象(DataObject)。 代码如下:

例子:

/**
 * 商品数据对象
 */
public class GoodsDo {
    /**
     * 商品名称
     */
    private String name;
    /**
     * 商品价格
     */
    private String price;
    /**
     * 商品图片
     */
    private String pic;
  // 省略get set方法
}

然后我们编译服务类GoodsService来提供获取商品列表的方法。 注意,这只是一个演示模板引擎,不需要访问数据库,直接返回指定内容的商品列表。

例子:

/**
 * 商品服务
 */
@Service // 为GoodsService注册一个组件
public class GoodsService {
    public List getGoodsList() {
        List list = new ArrayList();
        GoodsDo goods = new GoodsDo();
        goods.setName("苹果");
        goods.setPic("apple.jpg");
        goods.setPrice("3.5");
        list.add(goods);
        return list;
    }
}

此时,我们的控制器就可以注入一个GoodsService类型的组件,然后调用它的trick了。

例子:

@Controller
public class GoodsController {
    @Autowired
    private GoodsService goodsService;// 自动装配
    @RequestMapping("/goods") // 请求路径
    public String goods(Model model) {
        model.addAttribute("goodsList", goodsService.getGoodsList());// 交给模板引擎处理的数据
        return "goods";// 跳转到goods.ftl页面
    }
}

注意model.addAttribute("goodsList",goodsService.getGoodsList());,我们把商品列表相关的数据交给模板引擎处理。

5.6 通过模板引擎规则在商品页面展示商品信息

至此,我们就可以根据FreeMarker模板引擎按照模板规则展示商品信息了。

例子:




    
    商品列表


商品列表:
${item.name}--${item.price}--${item.pic}

注意,我们通过FreeMarker的模板句型输出了商品列表信息。 关于FreeMarker模板引擎的更多句型规则,感兴趣的朋友可以稍后参考更多资料。

5.7 测试

启动项目,打开浏览器访问:8080/goods,即可查看输出结果。

6. 使用百里香叶

Thymeleaf和FreeMarker都是模板引擎,用法基本相似。 这里我们只是举个例子,没有过多解释。

6.1 创建SpringBoot项目并导出开发环境

使用SpringInitializr创建项目,选择SpringBoot版本2.2.5,Group为com.imooc,Artifact为spring-boot-thymeleaf,生成项目后导出Eclipse开发环境。

6.2 在pom.xml中引入相关依赖

引入与Web项目和Thymeleaf模板相关的依赖项。

例子:

        
        
            org.springframework.boot
            spring-boot-starter-web
        
        
        
            org.springframework.boot
            spring-boot-starter-thymeleaf
        

6.3 创建指向产品页面的控制器方法

创建控制器类GoodsController,Thymeleaf直接使用HTML作为模板页面,所以代码如下:

例子:

/**
 * 商品控制器
 */
@Controller // 标注为控制器
public class GoodsController {
    /**
     * 获取商品列表
     */
    @RequestMapping("/goods") // 请求路径
    public String goods() {
        return "goods.html";// 跳转到goods.html页面
    }
}

6.4 创建产品页面

我们在resource/templates目录下新建一个商品页面goods.html,不先实现具体功能,代码如下:

例子:




    
    商品列表


商品列表


此时,我们启动项目,然后访问:8080/goods即可显示对应页面的内容。

6.5 在控制器方法中,调用服务方法获取产品信息,并将信息传递给模板引擎处理

商品类GoodsDo和服务类GoodsService,这两个类和前面的没有什么区别,直接发布代码。

例子:

/**
 * 商品数据对象
 */
public class GoodsDo {
    /**
     * 商品名称
     */
    private String name;
    /**
     * 商品价格
     */
    private String price;
    /**
     * 商品图片
     */
    private String pic;
  // 省略get set方法
}

例子:

/**
 * 商品服务
 */
@Service // 为GoodsService注册一个组件
public class GoodsService {
    public List getGoodsList() {
        List list = new ArrayList();
        GoodsDo goods = new GoodsDo();
        goods.setName("苹果");
        goods.setPic("apple.jpg");
        goods.setPrice("3.5");
        list.add(goods);
        return list;
    }
}

好了,此时我们的控制器就可以注入一个GoodsService类型的组件,然后调用它的trick了。

例子:

@Controller
public class GoodsController {
    @Autowired
    private GoodsService goodsService;// 自动装配
    @RequestMapping("/goods") // 请求路径
    public String goods(Model model) {
        model.addAttribute("goodsList", goodsService.getGoodsList());// 交给模板引擎处理的数据
        return "goods.html";// 跳转到goods.html页面
    }
}

6.6 通过模板引擎规则在商品页面展示商品信息

至此,我们就可以根据Thymeleaf模板引擎按照模板规则展示商品信息了。

例子:





商品列表


    
商品列表:

注意,我们通过Thymeleaf的模板句型输出产品列表信息。 关于Thymeleaf模板引擎的更多句型规则,感兴趣的朋友可以稍后参考更多资料。

6.7 测试

启动项目,打开浏览器访问:8080/goods,即可查看输出结果。

至此,基本上可以发现,这两种形式不仅模板页面文件的内容不同,其他地方也基本相同。

也就是说,模板引擎主要负责将控制器返回的数据通过一些模板标签解析成网页。

7. 使用 JSP

注意SpringBoot官方不推荐使用JSP,操作起来确实比较麻烦。 而且由于JSP的用户数量还是比较多的,这里简单演示一下,开发步骤和FreeMarker/Thymeleaf基本一样。

7.1 创建SpringBoot项目并导出开发环境

使用SpringInitializr创建项目,选择SpringBoot版本2.2.5,Group为com.imooc,Artifact为spring-boot-jsp,生成项目后导出Eclipse开发环境。

7.2 在pom.xml中引入相关依赖

引入与Web项目和JSP模板相关的依赖关系。

例子:

        
        
            org.springframework.boot
            spring-boot-starter-web
        
        
        
            org.apache.tomcat.embed
            tomcat-embed-jasper
            provided
        
        
        
            javax.servlet
            jstl
        

7.3 创建指向产品页面的控制器方法

使用以下代码创建一个控制器类 GoodsController:

例子:

/**
 * 商品控制器
 */
@Controller // 标注为控制器
public class GoodsController {
    /**
     * 获取商品列表
     */
    @RequestMapping("/goods") // 请求路径
    public String goods() {
        return "goods";// 跳转到goods.jsp页面
    }
}

7.4 创建产品页面

手动添加src/main/webapp及子目录如下,并在该目录下放一个goods.jsp进行测试。 注意,这个目录是SourceFolder源代码目录,不是普通的文件夹目录。

spring-boot-jsp 项目结构

例子:






商品列表

商品列表


注意,我们还需要添加一个视图解析器来将JSP页面重定向到指定的目录。

例子:

@SpringBootApplication
public class SpringBootJspApplication {
    public static void main(String[] args) {
        SpringApplication.run(SpringBootJspApplication.class, args);
    }
    @Bean // 注册视图解析器
    public InternalResourceViewResolver setupViewResolver() {
        InternalResourceViewResolver resolver = new InternalResourceViewResolver();
        resolver.setPrefix("/WEB-INF/jsp/");// 自动添加前缀
        resolver.setSuffix(".jsp");// 自动添加后缀
        return resolver;
    }
}

此时,我们启动项目,然后访问:8080/goods即可显示对应页面的内容。

7.5 在控制器方法中,调用服务方法获取产品信息,并将信息传递给模板引擎处理

商品类GoodsDo和服务类GoodsService,这两个类和前面的没有什么区别,直接发布代码。

例子:

/**
 * 商品数据对象
 */
public class GoodsDo {
    /**
     * 商品名称
     */
    private String name;
    /**
     * 商品价格
     */
    private String price;
    /**
     * 商品图片
     */
    private String pic;
  // 省略get set方法
}

例子:

/**
 * 商品服务
 */
@Service // 为GoodsService注册一个组件
public class GoodsService {
    public List getGoodsList() {
        List list = new ArrayList();
        GoodsDo goods = new GoodsDo();
        goods.setName("苹果");
        goods.setPic("apple.jpg");
        goods.setPrice("3.5");
        list.add(goods);
        return list;
    }
}

好了,此时我们的控制器就可以注入一个GoodsService类型的组件,然后调用它的trick了。

例子:

@Controller
public class GoodsController {
    @Autowired
    private GoodsService goodsService;// 自动装配
    @RequestMapping("/goods") // 请求路径
    public String goods(Model model) {
        model.addAttribute("goodsList", goodsService.getGoodsList());// 交给模板引擎处理的数据
        return "goods";// 跳转到goods.jsp
    }
}

7.6 通过模板引擎规则在商品页面展示商品信息

至此,我们就可以基于JSP模板引擎,按照模板规则展示商品信息了。

例子:







商品列表


    
商品列表:
${item.name}--${item.price}--${item.pic}

注意,我们通过JSP的模板句型输出产品列表信息。 关于JSP模板引擎的更多语句规则,感兴趣的朋友可以参考后面的详细资料。

7.7 测试

启动项目,打开浏览器访问:8080/goods,即可查看输出结果。

八、总结

最后你还应该发现FreeMarker和Thymeleaf的用法几乎是一模一样的,JSP还是需要手动添加一些目录和配置。

三种形式各有优缺点。 FreeMarker模板的句型比较简单,Thymeleaf可以直接使用HTML作为模板文件,JSP拥有广泛的用户群。

然而,这三种形式只是一个模板引擎。 将控制器返回的数据转换成HTML页面显示本质上没有区别。 您只需要了解模板引擎即可。

哪里可以下载免费的网页模板

其实这些下载制作网页模板的方法已经很久没有被很多人使用了,因为制作过程非常麻烦,只能通过自己配置服务器、改代码来实现。 现在自己建一个网站已经很实用了,为什么这么说呢? 看看凡客也是网页模板,而且不用下载就可以直接在模板上使用,拖拽后台就可以手动生成代码了!最后服务器也配置好了,直接就可以使用了

免费模板下载该网站

模板屋免费模板下载。 根据查询相关公开信息:模板之家网站,包含上千个免费网页模板、小程序模板、Word模板、Excel|模板、PPT模板等。

[跪下] 一个视频网站模板。 页面..紧急..

电影网站模板

%u7535%u5F71&classID=059514500192669&page=1

谁能给我一个好看的网页模板,没有网址

jsp 网站模板-04 《SpringBoot入门教程》使用模板引擎开发Web项目

进入这个网址进行下载:

首页底部有日文网页模板和欧美网页模板,我想应该够用了。

该网站的一大优点是下载的模板是psd格式的,可​​以直接修改使用。

需要提醒的是:

有时需要解压,解压的统一密码为:

哪些网站有免费的网页模板下载?

jsp 网站模板-04 《SpringBoot入门教程》使用模板引擎开发Web项目

选择网页模板下载首先要选择适合自己使用的,其次是HTML5标准电影网站模板下载,然后是外观美观大方,所以想要找到一个好的免费网页模板还是很难的,但并不代表没有这样的东西。这里推荐几个

Amcharts – 工具网络模型

Dribbble – 设计网页设计模型

Shopify – 电子商务网页设计模板

edX – 教育网页设计模板

Pexels – 图像素材网页设计模板

如何下载网页模板

网页模板按结构分类分为自适应模板、PC+WAP模板、代码自适应模板。

按行业分类:

企业、新闻、博客、社区峰会、医疗保健、电子产品、电子商务、婚纱摄影、餐饮小吃、域名托管、旅游交通、体育赛事、娱乐休闲、艺术潮流、风景、动植物、食品、教育培训、党政机关、团体等行业。

下载可以到专门的网页模板素材网站下载。 如果有一些功能模块是网页模板中没有的,需要下载后自行添加,主要分为基础、排版、产品、交互、中级五个部分。 但需要注意的是,页面上不宜出现过多的内容,以免影响阅读体验。

免费网站模板下载网站怎么样

jsp 网站模板-04 《SpringBoot入门教程》使用模板引擎开发Web项目

网站模板是已经准备好的网页框架。 使用网页软件将模板原来的图片和文字替换为自己的内容,然后发布到自己的网站上。

提供了常用的网站模板程序,包括织梦cms、帝国cms、wordpress、Thinkphp等。前瞻素材有很多相关的模板程序下载。

网站模板最大的特点就是省时、省力、操作简单。 是现代网站建设的主流形式电影网站模板下载,有很多免费网站可供下载。

介绍几个不错的网站模板下载网站,谢谢~

建立网站,我们能想到的就是用模板来建立网站,因为都是现成的,所以价格肯定比其他的实惠。 您可以通过前站素材选择并下载适合的网页模板。 网页模板均为php、html、图片格式,也有操作后台。

对于用户来说,只要选择自己喜欢的网站风格,更改LOGO和网站名称,就可以拥有一个属于自己的好网站,而且网站的所有内容都是在后台更改的,无需更改代码,因此对于没有代码的人来说也可以轻松上手。

jsp 网站模板-04 《SpringBoot入门教程》使用模板引擎开发Web项目

哪里可以免费下载网站模板,带背景,谢谢!

我爱设计网(),致力于传播设计文化、研究设计艺术、交流设计手法、提高大众审美意识的优秀设计专题网站; 拥有各类设计信息及相关设计资源,网站收录了众多国内外优秀设计。

经过一段时间的运营,本站首次推出的资源网站群获得了众多用户的一致好评。 在此,向仍然支持和关心本站的各位同仁表示感谢; 将网站推荐给更多同事。

我们愿与您一起在设计路上同行!

1.图片素材库:超精美海量图片素材集合,分类详细,精美;

2、酷站营:本栏目是国外收藏最多、最全、质量最高、更新最快的专业酷站。 酷站收藏已达3000多个。 是其他国外收藏酷站的资源源站!

3.模板资源库:收集了大量美式模板、欧美模板、flash模板、图标、矢量场景、flash动画、各种矢量人物等。

4、设计网站百科全书:国内收集设计网站的网站有很多。 这个网站是非常规的。 它以地区为主要分类,以网站属性为子类别。 收藏价值极强。

恐怕你的硬盘不够大! ! ! !

收藏 (0) 打赏

感谢您的支持,我会继续努力的!

打开微信/支付宝扫一扫,即可进行扫码打赏哦,分享从这里开始,精彩与您同在
点赞 (0)

悟空资源网 模板插件 jsp 网站模板-04 《SpringBoot入门教程》使用模板引擎开发Web项目 https://www.wkzy.net/game/138111.html

常见问题

相关文章

官方客服团队

为您解决烦忧 - 24小时在线 专业服务