当前位置: 首页 > 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.cnnetsun.cn/news/92026.html

相关文章:

  • 鼠标滚轮缩放图片:前端实现高清无损放大技巧(附实战代码)
  • Numpy库实践2_索引和数组的操作
  • 图解 - 红黑树(插入)
  • Memgraph 全新 AI 图工具包:一键构建 GraphRAG 聊天机器人,实现快速上下文感知响应
  • 初始化列表和特殊成员
  • (二)前端基础框架构建
  • vLLM推理引擎教程6-Nsight Systems性能分析
  • 基于MATLAB的燃料电池汽车参数匹配与能量管理策略优化及仿真模型研究资料库
  • AM247L-0000伺服电机
  • DoraemonKit(DoKit)使用教程:从集成到实战
  • 构筑 AI 理论体系:深度学习 100 篇论文解读 第十九篇:序列建模的焦点——注意力机制 Attention Mechanism (2015)
  • 【小白笔记】移除元素与删除有序数组中的重复项与轮转数组(三步反转)
  • 什么是关键字驱动测试?
  • 前沿技术借鉴研讨-2025.12.16(超声心动图综述/妊娠期糖尿病/降低CTG解读主观性)
  • 别让发成绩,耗掉你课后的半小时
  • 企业级 Prompt 管理中心:实验分流 + 曝光埋点 + 可回溯,版本化/AB/DSL/可观测全齐
  • 执行 install.sh 报错 `env: ‘bash\r‘: No such file or directory` 怎么解决?
  • Part 10|我给这套系统划的第一个边界
  • agent-zh.md
  • 为什么过滤 rtmpt 而不是 rtmp?
  • Navicat x 达梦技术指引 | 启用和配置AI助手
  • Transformer的注意力权重的理解
  • 解构 Codigger:从内核到无限生态的“进化阶梯”
  • 基于Python的高考志愿报名推荐系统源码设计与文档
  • 飞桨PaddlePaddle入门与核心实践
  • 使用ZYNQ芯片和LVGL框架实现用户高刷新UI设计系列教程(第四十讲)
  • 热销榜单:2025年高口碑数字人推荐,解决你的选择难题!
  • 应“双碳”考核!安科瑞通信机房能耗监测方案,让PUE管控精准落地
  • 1天净流入10亿!A500ETF南方凭什么成为布局中国核心资产的优选?
  • Android 基础入门教程之RelativeLayout(相对布局)