当前位置: 首页 > news >正文

简单的创建一个Spring Boot网页

刚接触 Spring Boot 时,总觉得做网页很复杂,其实只要选对依赖、写对核心代码,几分钟就能搞定一个基础网页!今天分享极简版 Spring Boot 网页的创建流程。

一、准备工作:创建 Spring Boot 项目

1. 项目配置(IDEA 中操作)

  • 名称:Simple-Web-Page
  • 语言:Java
  • 构建工具:Maven
  • JDK:17(或自己安装的版本)
  • Spring Boot 版本:4.0.0(稳定版)
  • 名称的单词之间不能使用“空格”分隔。

2. 选择核心依赖

只需要 2 个依赖(足够支撑基础网页):

  • WebSpring Web(处理网页请求)
  • Template EnginesThymeleaf(渲染 HTML 页面)

选好后点击 “创建”,等待项目加载完成。

二、编写代码:3 个文件搞定网页

项目加载完成后,结构如下

步骤 1:新建控制器类WebController.java

org.example.simplewebpage包下,新建Java 类,命名为WebController,粘贴代码:

package org.example.simplewebpage; import org.springframework.stereotype.Controller; import org.springframework.ui.Model; import org.springframework.web.bind.annotation.GetMapping; import java.util.Date; @Controller public class WebController { @GetMapping("/") public String showSimpleWebPage(Model model) { model.addAttribute("pageTitle", "Simple Web Page"); model.addAttribute("currentTime", new Date()); model.addAttribute("welcomeMsg", "欢迎来到我的第一个Spring Boot网页!"); return "Simple Web Page"; } }

步骤 2:新建 HTML 页面Simple Web Page.html

resources/templates目录下,新建HTML 文件,命名为Simple Web Page.html(注意空格和控制器 return 的名称一致),粘贴代码:

有两个方式:

1.选择“文件”,需要输入后缀“.html”。

2.选择下方的“HTML文件”,则不需要输入后缀,直接输入名称即可。

<!DOCTYPE html> <html lang="zh-CN" xmlns:th="http://www.thymeleaf.org"> <head> <meta charset="UTF-8"> <title th:text="${pageTitle}"></title> <style> body { /* 让内容水平+垂直居中 */ display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 100vh; margin: 0; } /* 所有文字统一间距,增强可读性 */ p, h1 { margin: 10px 0; } </style> </head> <body> <!-- 仅保留核心文字内容,全部居中 --> <h1 th:text="${pageTitle}"></h1> <p th:text="${welcomeMsg}"></p> <p>这是一个基于Spring Boot + Thymeleaf构建的简易网页</p> </body> </html>

步骤 3:配置文件application.properties

打开resources/application.properties,添加 2 行配置:

spring.application.name=Simple-Web-Page # 服务器端口(默认8080,可自定义) server.port=8080 # 关闭Thymeleaf缓存(开发环境必备) spring.thymeleaf.cache=false

三、启动项目,查看网页

确定右上角的配置文件正确,然后点击绿色三角运行文件,启动成功后:打开浏览器,输入http://localhost:8080,就能看到居中显示的网页啦!

四、总结

整个流程只需要选 2 个依赖 + 写 3 个文件,核心是用Spring Web处理请求、Thymeleaf渲染页面,新手也能快速上手~

如果想扩展功能,比如加按钮、表单,只需要在 HTML 里加标签,控制器里加对应的请求方法即可。

http://www.zskr.cn/news/111703.html

相关文章:

  • 长沙美食小吃攻略|五一广场 和 太平老街:不是来旅游,是来“吃服”的! - 资讯焦点
  • Nano Banana Pro:设计师的威胁,还是创意领域的新伙伴?
  • BioSIM 抗人 IL-1b 抗体SIM0362:多种应用兼容性,适应多样化实验需求
  • AI一周重要会议和活动(12.15-12.22)
  • 【c++】——c++编译的so中函数有额外的字符
  • 从工具到思维:构筑持续测试的文化基石
  • 清理linux大文件
  • Unity场景后处理小记 - 实践
  • 【Android驱动14】Android系统Crash工具使用方法和分析
  • HTR3236 36路LED PWM驱动器全方位介绍
  • 出国点餐看不懂菜单?别慌!用微信“扫一扫”就能搞定
  • PMSM永磁同步电机电控设计高手晋级之路:高清视频,深度解析,技术细节一网打尽
  • Flutter 性能优化实战:从 60fps 到丝滑如原生的 120fps
  • 私有部署+全能定制!开源投票系统分享 小程序投票+H5投票二合一
  • 全能小微企业报告API接口调用代码流程、接入方法以及应用场景
  • 降本增效利器!这款洗车小程序源码助您轻松搭建管理平台
  • 三相锁相环(SRF-PLL)并网逆变器 Matlab Simulink仿真
  • 调研分享 | 面向异构集群环境的分布式训练并行方案调研
  • MSWOA算法,基于多策略混合改进鲸鱼算法 Matlab语言 改进后测试函数结果显示,相较与W...
  • 【青岛理工】25年计网期末A卷回忆版
  • Memgraph 全新 AI 图工具包:一键构建 GraphRAG 聊天机器人,实现快速上下文感知响应
  • [特殊字符]名企研学|走进比亚迪!解锁新能源汽车的未来密码[特殊字符][特殊字符]
  • 51单片机数字电压表
  • 开源替代SaaS:一次部署长期受益,多维表格自建方案全解析
  • STL中容器适配器:stack,queue,priority_queue 的介绍与简单模拟实现
  • 【光学】基于九个光谱波段多光谱成像系统食品质量评估(范围为400nm-1000nm)附Matlab代码
  • 电影解说文案:LobeChat写出爆款短视频脚本
  • 【源码开源】基于STM32的应急救援仓系统 | 救援效率和实时监控
  • 考虑寿命损耗的微网电池储能容量优化配置 关键词:两阶段鲁棒优化 KKT条件 CCG算法 寿命损耗
  • Modbus TCP关键知识点回顾