Web应用开发实践指南——springboot

最新推荐文章于 2024-01-02 18:26:22 发布

Difcc1

最新推荐文章于 2024-01-02 18:26:22 发布

阅读量1.6k

点赞数 39

文章标签：前端后端 web

本文链接：https://blog.csdn.net/Difcc1/article/details/135071179

版权

随着互联网的普及和技术的不断发展，Web应用已经成为人们日常生活中不可或缺的一部分。Web应用开发作为一项重要的技术，为人们提供了更加便捷、高效的服务。本文将介绍Web应用开发的基本概念、技术栈、实践经验以及性能优化等方面的内容，帮助读者更好地掌握Web应用开发的技术。

一. SpringBootWeb概念

SpringBoot是由Pivotal团队提供的全新框架，其设计目的是用来简化新Spring应用的初始搭建以及开发过程

1.Spring Boot是一个基于Spring框架的快速开发脚手架，它简化了Spring应用的初始化和搭建过程，提供了众多便利的功能和特性，比如自动配置、嵌入式Tomcat等，让开发人员可以更加专注于业务逻辑的实现。
2.Spring Boot还提供了强大的插件体系和广泛的集成，可以轻松地与其他技术栈集成，比如Thymeleaf模板、JPA、MyBatis、Redis、MongoDB等，同时也支持对微服务的开发和管理。
3.总之，Spring Boot简单易用、快速开发，是目前最流行的Java框架之一，得到了广大开发者的青睐。
SpringBoot不是一个全新的框架，也不是Spring解决方案的替代品，而是对Spring框架的一个封装。以前Spring可以做的事情，现在用SpringBoot都可以做。SpringBoot完成了对各种框架的整合，让这些框架集成在一起变得更加简单，简化了我们在集成过程中繁琐的模板化配置1。

二 SpringBootWeb入门

Web应用开发的基本概念

Web应用：Web应用是一种基于Web技术的应用程序，可以通过浏览器访问和使用。它包括前端和后端两部分，前端负责与用户交互，后端负责处理业务逻辑和数据存储。
MVC模式：MVC模式是一种常见的Web应用开发模式，它将应用程序分为Model（模型）、View（视图）和Controller（控制器）三个部分。Model负责处理业务逻辑和数据存储，View负责展示用户界面，Controller负责接收用户的请求并调用Model进行处理。

1.创建springboot工程，并勾选web开发相关的依赖。

2.定义helloController类，添加hello，并添加注解。

3.运行测试。

三、Web应用开发的技术栈

前端技术：前端技术包括HTML、CSS、JavaScript等。其中，HTML用于构建网页结构，CSS用于样式设计，JavaScript用于实现交互效果。

1.web前端三大核心技术——HTML：结构；CSS：样式；JavaScript:与用户的交互行为

示例：

HTML：

<style>
    div{color:red;font-style:italic;}
</style>

<div>缓缓飘落的枫叶像思念，你烛火惺忪点燃岁末的秋天</div>

<script>

let div=document.qierySelector('div');
let time=null;
let flag=ture;
div.onmouseover=function(){
    timer=setInterval(()=>{
        if(flag){
            div.style.color='blue';                
            div.style.fontstyle='normal';
        }
        else{
            div.style.color='red';
            div.style.fontstyle='italic';
        }
        flag=!flag;
    },500);
 };
div.onmouseout=function(){
    clearInterval(timer);
 };

</script>

示例：

css

<style>
        div{width:50%；height:50px; background-color:red}
    </style>
 </head>
 <body>
    <div>这是一首简单的小情歌</div>
 </body>

2.web后端

后端技术包括服务器端语言（如Java、Python、Ruby等）、数据库（如MySQL、MongoDB等）、Web服务器（如Apache、Nginx等）等。

1.后端开发主要做什么:

2.后端程序主要工作就是数据管理。

3.通常包括数据的存储（包括增加、删除、修改）和查询。

首先需要登录，获取“token”

新增基础页面
(1)BaseUrlController

@PostMapping("/add")
public Result<?> addBaseUrl(@RequestBody BaseUrl baseUrl){
baseUrlService.save(baseUrl);
return Result.success("新增基础页面成功");
}

更新基础页面
（1）BaseUrlController
@PostMapping("/update")
public Result<?> updateBaseUrl(@RequestBody BaseUrl baseUrl){
baseUrlService.updateBaseUrl(baseUrl);
return Result.success("更新基础页面成功");
}
（2）IBaseUrlService

public void updateBaseUrl(BaseUrl baseUrl);
（3）BaseUrlServiceImpl

@Override
public void updateBaseUrl(BaseUrl baseUrl){
baseUrlMapper.updateBaseUrl(baseUrl);
}
（4）BaseUrlMapper

public void updateBaseUrl(BaseUrl baseUrl);
（5）BaseUrlMapper.xml

<update id="updateBaseUrl" parameterType="BaseUrl">
update base_Url set description=#{description} where mainPage=#{mainPage}
</update>

根据主页查询基础页面信息
（1）BaseUrlController

@GetMapping("/all")
public Result<List<BaseUrl>> getBaseUrl(){
List<BaseUrl> baseUrlList = baseUrlService.list();
return Result.success(baseUrlList,"查询成功！");
}
（2）IBaseUrlService

List<BaseUrl> selectByMainPage(String mainPage);
（3）BaseUrlServiceImpl

@Override
public List<BaseUrl> selectByMainPage(String mainPage) {
return baseUrlMapper.selectByMainPage(mainPage);
}
（4）BaseUrlMapper

List<BaseUrl> selectByMainPage(String mainPage);
（5）BaseUrlMapper.xml

<select id="selectByMainPage" resultType="BaseUrl">
select * from base_url where mainPage=#{mainPage}
</select>

四.性能优化

1-减少HTTP请求次数：

通过合并CSS和JavaScript文件、使用CSS Sprite等方式减少 HTTP请求次数，提高页面加载速度。

减少重定向请求次数；
合并请求；
延迟发送请求；
2- 压缩和缓存：对前端资源进行压缩和缓存，减少网络传输量和加载时间。
3-异步加载：通过异步加载的方式加载非关键资源，避免阻塞主线程，提高页面响应速度。

五'软件链接
软件的链接以及截图

1.Visual链接：Visual studio编程与开发软件下载 (weizhen01.cn)

2.IDEA链接：https://www.jetbrains.com/idea/

请注意，在使用IDEA之前，需要先安装JDK1.8版本以上的Java开发工具包。

3.SQL链接：https://sqlyog.en.softonic.com/

4.postman链接：https://www.postman.com/downloads/

运行项目时的注意事项

1.运行代码时需要打开"Redis-x64-5.0.14.1\redis-server.exe"

2.只需要点开“redis-server.exe”，就可以登录成功

六'’总结

本文介绍了Web应用开发的基本概念、技术栈、实践经验以及性能优化等方面的内容。通过掌握这些技术，我们可以更好地进行Web应用开发，提高应用程序的性能和用户体验。同时，随着技术的不断发展，我们也需要不断学习和跟进新的技术和趋势，以适应不断变化的市场需求。

七'关于后端开发的一些网站：(望有所帮助)

微博‍‍   【超级架构师】   智能时刻‍
哔哩哔哩   【超级架构师】
抖音   【cea_cio】超级架构师
快手   【cea_cio_cto】超级架构师
小红书   【cea_csa_cto】超级架构师

网站   CIO(首席信息官)   https://cio.ceo
网站   CIO,CTO和CDO   https://cioctocdo.com
网站   架构师实战分享   https://architect.pub
网站   程序员云开发分享   https://pgmr.cloud
网站   首席架构师社区   https://jiagoushi.pro
网站   应用开发和开发平台   https://apaas.dev
网站   开发信息网   https://xinxi.dev
网站   超级架构师   https://jiagou.dev
网站   企业技术培训   https://peixun.dev
网站   程序员宝典   https://pgmr.pub
网站   开发者闲谈   https://blog.developer.chat
网站   CPO宝典   https://cpo.work
网站   首席安全官   https://cso.pub ‍
网站   CIO酷   https://cio.cool
网站   CDO信息   https://cdo.fyi
网站   CXO信息   https://cxo.pub