JavaWeb 开发

朱雀 2024-03-02 08:15 27阅读 0赞

### 一、JavaWeb开发介绍 ###

#### 1、什么是Web开发 ####

**Web**：全球广域网，也称为**万维网**(www **W**orld **W**ide **W**eb)，能够通过浏览器访问的**网站**。

所以**Web开发，**说白了，就是**开发网站**的，例如下图所示的网站：**淘宝**，**京东**等等。

![987943f6e37a4e4e89d0b8cda238bc0c.png][]

那么现在我们知道了web开发是开发网站的，那具体需要学习哪些知识呢？以及这些知识在我们整个网站开发中占据什么位置呢？对于这些问题，我们就必须知道网站整体的工作流程。

#### 2、网站的工作流程 ####

1. 首先我们需要通过**浏览器**访问发布到**前端服务器**中的**前端程序**，这时候前端程序会将前端代码返回给浏览器。如下图所示：

![e0174fb281ac4f2fa886982c86cca005.png][]

2. 浏览器得到前端代码，此时浏览器会将前端代码进行解析，然后展示到浏览器的窗口中，这时候我们就看到了**网站**的**页面**，如下图所示：

![c8daec83347341ba9c0c8402d6160a03.png][]

3. 但是此时这个页面是没有数据的，因为数据在我们的数据库中，所以我们浏览器需要根据**前端代码中指定的后台服务器的地址** 向 我们的**后台服务器**（内部有java程序）发起**请求**，后台服务器再去从**数据库**中获取数据，然后返回给浏览器。

![a6d35af784134511a2977b82bce3bbdc.png][]

4. 浏览器拿到后台返回的数据后，然后将数据展示在前端资源也就是**网页**上，然后我们就看到了如下图所示的完整的内容。

![d436545e19744911bc5694a4d2ea0bb2.png][]

> **整个流程如下：**
> 
> 1.  浏览器先向前端服务器请求**前端资源**，也就是我们所说的**网页；**
> 2.  浏览器再向**后台服务器**发起请求，获取**数据；**
> 3.  浏览器将得到的后台**数据**填充到**网页**上，然后展示给用户去看。

#### 3、网站的开发模式 ####

网站的开发模式，主要有2种：**前后端分离**和**混合开发。**

**前后端分离**：（**目前企业开发的主流，**市场占有率70%以上）这种开发模式的特点如下：

*  前端人员开发前端程序，前端程序单独部署到前端服务器上。
 *  后端人员开发后端程序，后端程序单独部署到后端服务器上。

![0fb28fc25c6b41a98aa7d568fcfd74e9.png][]

**混合开发：**（早期的开发技术，目前慢慢退出市场），这种开发模式的特点是：

*  前端人员开发的代码和后端人员开发的代码在同一个项目中，一起打包部署。

![d1ddd99232c644dca428442b2d76cc1a.png][]

#### 4、网站的开发技术 ####

前端web开发：

<table> 
 <thead> 
  <tr> 
   <th>技术</th> 
   <th>描述</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>HTML</td> 
   <td>用于构建网站的基础结构的</td> 
  </tr> 
  <tr> 
   <td>css</td> 
   <td>用于美化页面的，作用和化妆或者整容作用一样</td> 
  </tr> 
  <tr> 
   <td>JavaScript</td> 
   <td>实现网页和用户的交互</td> 
  </tr> 
  <tr> 
   <td>Vue</td> 
   <td>主要用于将数据填充到html页面上的</td> 
  </tr> 
  <tr> 
   <td>Element</td> 
   <td>主要提供了一些非常美观的组件</td> 
  </tr> 
  <tr> 
   <td>Nginx</td> 
   <td>一款web服务器软件，可以用于部署我们的前端工程</td> 
  </tr> 
 </tbody> 
</table>

后端web开发：

<table> 
 <thead> 
  <tr> 
   <th>技术</th> 
   <th>描述</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>Maven</td> 
   <td>一款java中用于管理项目的软件</td> 
  </tr> 
  <tr> 
   <td>Mysql</td> 
   <td>最常用的一款数据库软件之一</td> 
  </tr> 
  <tr> 
   <td>SpringBoot</td> 
   <td>spring家族的产品，当前最为主流的项目开发技术。</td> 
  </tr> 
  <tr> 
   <td>Mybatis</td> 
   <td>用于操作数据库的框架</td> 
  </tr> 
 </tbody> 
</table>

[987943f6e37a4e4e89d0b8cda238bc0c.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/02/44327ab01a3745228b8bfcc97411a516.png
[e0174fb281ac4f2fa886982c86cca005.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/02/d98be5ea91fb443fab3c01fc4e85671e.png
[c8daec83347341ba9c0c8402d6160a03.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/02/d18c8ac924fb4cafb072083c181241f1.png
[a6d35af784134511a2977b82bce3bbdc.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/02/8a2d3386c87749cfbad498841365cbd1.png
[d436545e19744911bc5694a4d2ea0bb2.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/02/77a1b1081f8f4f088b0dd5df22066c09.png
[0fb28fc25c6b41a98aa7d568fcfd74e9.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/02/164bc1c7454847d89a80ea2e46c4f9c5.png
[d1ddd99232c644dca428442b2d76cc1a.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/02/baca9ac63b2c42519992e548adfed669.png