Web开发介绍详细介绍

news2025/1/18 10:50:43

Web开发介绍

1 什么是web开发

Web:全球广域网,也称为万维网(www World Wide Web),能够通过浏览器访问的网站

所以Web开发说白了,就是开发网站的,例如下图所示的网站:淘宝京东等等

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

2 网站的工作流程

接下来我们先来看看网站的工作流程,这样才能在我们的脑海中构建初步的知识架构体系。

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

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

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

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

整个流程如下:

1.浏览器先向前端服务器请求前端资源,也就是我们所说的网页

2.浏览器再向后台服务器发起请求,获取数据

3.浏览器将得到的后台数据填充到网页上,然后展示给用户去看

3 网站的开发模式

接下来我们来聊聊网站的开发模式,主要有2种:前端台分离和混合开发

前后台分离:(目前企业开发的主流,市场占有率70%以上)这种开发模式的特点如下

  • 前端人员开发前端程序,前端程序单独部署到前端服务器上

  • 后端人员开开发后端程序,后端程序单独部署到后端服务器上

混合开发:(早期的开发技术,目前慢慢退出市场),这种开发模式的特点是:前端人员开发的代码和后端人员开发的代码在同一个项目中,一起打包部署。

4 网站的开发技术

最后我们来看看web阶段需要学习哪些技术呢?如下图我们列举了课程中需要学习的知识点

以下是图表的方式整理了我们web阶段要学习的技术和其对应的作用

前端web开发:

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

后端web开发:

技术描述
Maven一款java中用于管理项目的软件
Mysql最常用的一款数据库软件之一
SpringBootspring家族的产品,当前最为主流的项目开发技术。
Mybatis用于操作数据库的框架

所以只有我们学完上述的技术,我们才能开发出一个麻雀虽小,五脏俱全的网站。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1166075.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

常见接口测试面试题

1、按你的理解,软件接口是什么? 答: 就是指程序中具体负责在不同模块之间传输或接受数据的并做处理的类或者函数。 2、HTTP和HTTPS协议区别? 答: https协议需要到CA(Certificate Authority,证书…

犀牛8 for Mac – 强大的三维建模软件,轻松实现创意设计

你是否正在寻找一款功能强大、易于使用的三维建模软件?犀牛8 for Mac是你的不二选择!作为最新版本的犀牛系列软件,它汇集了众多令人惊叹的特性,让你能够轻松实现自己的创意设计。 犀牛8 for Mac拥有丰富而强大的三维建模工具&…

【Python基础】变量基本使用

变量 1.变量定义02. 变量的类型2.1 变量类型的演练 —— 个人信息2.2 变量的类型2.3转义字符 3.变量输入输出3.1变量格式化输出 4.变量命名 1.变量定义 变量定义 • 在 Python 中,每个变量 在使用前都必须赋值 在使用前都必须赋值,变量 赋值以后 该变量…

R语言使用HTTP爬虫IP写一个程序

R语言爬虫是指使用R语言编写程序,自动从互联网上获取数据的过程。在R语言中,可以使用三个主要的包(XML、RCurl、rvest)来实现爬虫功能。了解HTML等网页语言对于编写爬虫程序也非常重要,因为这些语言是从网页中提取数据…

解决方案中排版的灵魂的---样式的设置

word样式是一系列字符格式和段落格式的集合,可以在编排重复格式的时候套用样式,减少重复化的操作。 一、word样式 二、样式基准 样式基准是最基本或原始的文字段落格式,文档中的其他样式以此为基础创建。 我新建样式,如果选择样…

Go的Defer简介

什么是延期? Defer 语句用于在存在 defer 语句的周围函数返回之前执行函数调用。该定义可能看起来很复杂,但通过示例就很容易理解。 例子 package mainimport ( "fmt" )func finished() { fmt.Println("Finished finding largest&qu…

XR Interaction ToolKit

一、简介 XR Interaction Toolkit是unity官方的XR交互工具包。 官方XRI示例地址:https://github.com/Unity-Technologies/XR-Interaction-Toolkit-Examples 2023.3.14官方博客,XRIT v2.3 https://blog.unity.com/engine-platform/whats-new-in-xr-int…

ERR operation not permitted

ERR operation not permitted E:\Document_Redis_Windows\redis-2.4.5-win32-win64\64bit redis.conf auth 123456 redis requirepass_requirepass redis-CSDN博客

PP-Matting:trimap free的高精度自然图像抠图

论文:https://arxiv.org/abs/2204.09433 代码:https://github.com/PaddlePaddle/PaddleSeg 1、动机 在自然图像抠图领域,大多数方法都是基于Trimap来做抠图,这种trimap-based的方式在抠图时还需要用户绘制一个trimap作为模型输入&…

Vue项目运行时报错:‘vue-cli-service‘ 不是内部或外部命令,也不是可运行的程序 或批处理文件

报错原因及解决 1.package.json 文件中未定义依赖项vue/cli-service,因此在 npm install 之后并没有安装vue/cli-service 依赖; 解决:项目目录下执行命令,npm i -D vue/cli-service。2.第1步排查后,还是报同样的错&a…

Django-vue-admin 滚动监听,锚点定位目录

就是实现滑动内容,目录也跟着滚动,同时点击目录,内容会滑动到指定位置 试过很多,反正都不适用Django-vue-admin框架,唯有这个功能可以,只是样式按照自己想要的改改就行, https://blog.csdn.ne…

【深度学习】快速制作图像标签数据集以及训练

快速制作图像标签数据集以及训练 制作DataSet 先从网络收集十张图片 每种十张 定义dataSet和dataloader import glob import torch from torch.utils import data from PIL import Image import numpy as np from torchvision import transforms import matplotlib.pyplot…

这才是当今生成式人工智能的根本性问题!

原创 | 文 BFT机器人 01 引言 近年来,生成式人工智能产品层出不穷,ChatGPT火爆出圈后,百度、谷歌等科技大佬争相研究生成式人工智能产品,将该技术的普及程度提升到了一个新的水平。然而,生成式人工智能的运营需要高昂…

谷歌浏览器解决跨域问题配置记录

在访问时出现has been blocked by CORS policy: Responspreflight request doesn’t pass access control checlAccess-Control-A1low-Origin" header is present onrequested resource. 出现跨域问题 1.先关闭浏览器 2.创建一个目录,文件夹记住路径 3.点击谷…

高德地图撒点组件

一、引入amap地图库 - public/index.html <script type"text/javascript">window._AMapSecurityConfig {securityJsCode: 地图密钥 }</script><scripttype"text/javascript"src"https://webapi.amap.com/maps?v1.4.8&key111111…

rpm 软件包管理工具

RPM&#xff08;RedHat Package Manager&#xff09;&#xff0c;RedHat软件包管理工具。 rpm 查询 rpm -qa #查询所有包(query all)rpm -qa |grep firefox #firefox-102.15.0-1.el7.centos.x86_64rpm -qi | grep firefox #(query information) #Name : firefox #…

Flink日志采集-ELK可视化实现

一、各组件版本 组件版本Flink1.16.1kafka2.0.0Logstash6.5.4Elasticseach6.3.1Kibana6.3.1 针对按照⽇志⽂件⼤⼩滚动⽣成⽂件的⽅式&#xff0c;可能因为某个错误的问题&#xff0c;需要看好多个⽇志⽂件&#xff0c;还有Flink on Yarn模式提交Flink任务&#xff0c;在任务执…

嵌入式学习的两大误区

误区一、全身投入学习桌面或服务器版本Linux系统很多想学嵌入式Linux 的同学经常问我&#xff0c;我不会Linux系统&#xff0c;怎么学习嵌入式Linux开发&#xff0c;于是他们就花费了大量的精力和时间去研究学习桌面版本Linux系统的使用&#xff0c;什么redhat 、federo&#x…

IDEA启动报端口占用

方法一 netstat -ano | findstr :1099 这将列出正在使用1099端口的进程的相关信息&#xff0c;包括进程ID&#xff08;PID&#xff09;。查找使用1099端口的进程ID&#xff0c;并记下该进程的ID号。输入以下命令并按Enter键执行&#xff0c;其中PID是你在上一步中找到的进程ID…

Openssl生成证书-nginx使用ssl

Openssl生成证书并用nginx使用 安装openssl yum install openssl -y创库目录存放证书 mkdir /etc/nginx/cert cd /etc/nginx/cert配置本地解析 cat >>/etc/hosts << EOF 10.10.10.21 kubernetes-master.com EOF10.10.10.21 主机ip、 kubernetes-master.com 本…