WEB前端、后端的说明

简介: 这个问题,吾其实认为很简单:用户看到的部分,就是前端。主要指页面内容。用户看不到的部分,就是后端。比如数据库、业务逻辑等。这个说法是不是对的呢?吾上网搜索了一些说法,供大家参考:

这个问题,吾其实认为很简单:

用户看到的部分,就是前端。主要指页面内容。

用户看不到的部分,就是后端。比如数据库、业务逻辑等。

这个说法是不是对的呢?吾上网搜索了一些说法,供大家参考:


----------------------------------------------------------------


前端:是网民在上网页时第一眼看到的页面或是分支点信息页面等。或者是页面中的图片、文字、框架分配、视频、语音等整体布局都是web的前端。


后端:是网民第一眼是看不到的,一般只有部分专业人员才能大致看到。像语言编写、创建方式、改写或优化网站的方式这些操作则为web的后端。


----------------------------------------------------------------


1、网站前端

网站前端就是网站的页面设计或者是静态的网页设计,简单的说我们访问一个网站看到的所有页面网页上的内容和版式样式都属于网站前端,网站前端工作就是设计网站的静态页面,所谓的静态页面就是网站前端不包括后端,简单的例子说一下,静态页面就像一张报纸,上面有文字图片和内容,并排好版,之所以称之为静态是因为这些内容不能动态的改变,也就是所有人看到的静态页面都是一模一样的,没有任何区别,这是因为这个页面是静态的,不会改变。总之,网站前端就是指的网站的静态页面设计,网站前端工作使用的是html、css、js等技术设计网站页面的样式和排版布局,这就是网站前端。


2、网站后端

网站后端也叫网站后台技术或者动态网站技术,上面我们也说了静态页面的缺点就是不能动态的改变页面上的内容和实现一些代码逻辑,比如我们要实现用户的注册登录验证、或者购物结算等,这些都是要代码逻辑来实现的,还有我们需要一个后台来往我们的网页添加一些消息新闻通知等,因为不是每一个网站的使用者都懂前端技术来来改变页面内容,而且这样也太不方便了,所以需要网站后台来实现这些功能,这些东西都是需要网站后台技术来实现的。常见的网站后端开发语言有asp、asp.net、jsp、php等。同时网站后台技术还包括数据库如MySQL、sqlserver等,数据库是用来存储后台数据的。


----------------------------------------------------------------


网站前端和后台的工作是完全不同的,前端的工作是设计静态页面,后台是结合数据库实现一些代码的逻辑如验证用户登录等,后台更加偏重与逻辑思维。


使用html、Javascript写的是Web前端,它不用向服务器(比如apache、nginx、tomcat等)交互在浏览器端就执行完了,比如使用Javascript弹出一个警告框的效果。


而php、Python等是后台语言,当通过浏览器向服务器发送访问php文件的请求时(比如:http://localhost:63342/php_basic/helloworld.php),由web服务器收到请求,发现是php代码则交给php解析器完成解析,然后发回给web服务器,最后返回给浏览器。


----------------------------------------------------------------


一个追求任何场景下都美丽动人,

一个追求巨大压力下举重若轻。

但两者又必须密切分工合作,才能使得项目顺利进行。分工的核心在于在哪里渲染页面。不同的渲染位置决定了不同分工模式。


在服务器端渲染

这个模式有一个问题——不能实现部分更新。即使用户点了一个按钮,产生了很细微的数据变动,也需要后端重新渲染整个页面再将页面发往浏览器端。如果页面存在大量的静态的部分,这种方式无疑不是高效的。

同时,前端工程师们需要用模板定义展现形式,后端工程师们需要用模板输出数据。久而久之,模板就会越来越复杂,越来越不可维护。


在浏览器端渲染

浏览器端发送请求后从服务器端接受到了模板和 J S代码。浏览器执行接受到的 JS 代码,JS 代码会从服务器请求数据,并将数据填充到模板中。


利用运行在浏览器端的Javascript语言,前端工程师能够从后端服务器获取数据,进而按照业务逻辑渲染页面。这时候后端工程师只需要开发稳定的 API 提供数据就可以了。这种模式虽然依然是B/S模式,但开发的场景却和C/S模式比较相近。在浏览器端渲染的好处在于前端完全控制了模板,后端只需要开发相应的 API, 分工比较明确。并且支持部分页面更新。同时同一套后端服务可以同时支持不同的展示模式,比如同一套后端服务还可以支持移动开发。

当然啦,浏览器渲染也存在一些问题。其中最大的问题是对 SEO 不友好。搜索引擎的爬虫程序必须像浏览器一样执行 JS 代码才能获得页面的内容,从而提高了爬虫爬取页面的难度。


大前端模式

借助神器Node.js,前端工程师终于把磨爪伸进服务器了。Node.js是一个来自老毛子的高性能异步服务器。如果只是一个服务器,Node.js并不出奇。一般服务器需要提供一种编程语言的runtime,方便开发者进行开发。Node.js因为异步的关系选择了异步性能很好的Javascript,就是前端工程师经常在页面上写的那个Javascript。这时前端工程师们一看,呀,这玩意我会呀。因此利用Node.js,前端工程师不再局限在浏览器,可以在服务器写Javascript代码了。这时前端工程师可以按需要,选择在浏览器端或者服务器端完成渲染。这个模式我们可以称之为大前端模式。


大前端模式下,前端工程师有更大的灵活性进行开发,从而可以避免前面两种模式的弊端,发挥他们的长处。但是,世间无十全十美之事,大前端模式也有自己的弊端。前端工程师们被赋予了服务器写代码的能力,也就需要承担服务器编程的责任。能力越大责任也就越大嘛。在服务器写代码,前端工程师必须承担日志、安全和负载均衡等后端工程师才需要承担的责任。大前端攻城狮相当于把前端攻城狮和后端攻城狮两种物种的基因杂揉在一起创造出来的混元体,其稀有程度可想而知。这也就是现在精通Node.js程序员少的原因。


----------------------------------------------------------------


Tomcat是Application Server,Apache和Nginx则是Web Server,这两者有区别。


Web Server一般是完整实现了HTTP协议的服务器,负责接收用户的HTTP请求,然后响应请求,至于这么处理这个请求,就要交给Application Server去处理了,Application Server里面跑着像PHP,Python的脚本。Web Server和Application Server之间需要通过协议沟通,比如CGI、WSGI这类东西。虽然一些Application Server也能充当Web Server,但是它们对HTTP协议的实现并不完整,因此生产环境下不会这么用。


像node这种本身自带Web Server的,就不需要额外弄一个Web Server了。SSR的情况下,直接服务端渲染返回,这个理解起来应该不难。如果非SSR,后端返回一个页面,前端要加去载。至于前端资源要放哪,可以有很多选择,直接放在项目静态资源目录下,或者上传到CDN,或者在nginx下开一个静态目录存放都可以。


----------------------------------------------------------------


前端技术

nodejs.

webpack.

后端技术

mysql.

springMVC.

1、前端请求数据URL由谁来写

在开发中,URL主要是由后台来写好给前端。

若后台在查询数据,需要借助查询条件才能查询到前端需要的数据时,这时后台会要求前端提供相关的查询参数(即URL请求的参数)。


2、接口文档主要由谁来写

接口文档主要由后台设计和修改。

后台直接跟数据打交道,最清楚数据库里有什么数据,能返回什么数据。

前端只是数据的被动接受者,只是接口文档的使用者。

使用过程中,发现返回的数据部队,则跟后台商量,由后台修改。

切记:前端不能随意更改接口文档,除非取得后台同意。


3、前端与后台交互的数据格式

主要是JSON,XML现在用的不多

JSON 通常用于与服务端交换数据。

在接收服务器数据时一般是字符串。

我们可以使用 JSON.parse() 方法将数据转换为 JavaScript 对象。


4、前端与后台的交互原理

关注点:接口地址、前端请求的参数、后端返回的参数。

调一下接口,看一下返回的数据。


5、前端请求参数的形式

GET和POST两种方式

GET从指定的服务器中获取数据,POST提交数据给指定的服务器处理


6、前端应该告知后台那些有效信息,后台才能返回前端想要的数据

先将要展示的页面内容进行模块划分,将模块的内容提取出来,以及方便前端的一些标志值等,将所有想要的内容和逻辑告知后端

后端从数据库里面去查询相应的数据表以获得相应的内容或者图片地址信息

URL中的参数主要是根据后台需要,若后台需要一个参数作为查询的辅助条件,前端在URL数据请求时就传递参数


7、前端如何把页面信息有效传达给后台,以及后台如何获取到这些数据

所有前端请求的URL后面的参数都是辅助后台数据查询的

若不需要参数,那后台就会直接给个URL给前端


8、前端应该如何回拒一些本不属于自己做的一些功能需求或任务

前端负责把数据展示在页面上

清晰的认识自己需要做的需求和任务


9、当前端在调用数据接口时,发现有些数据不是我们想要的,那么前端应该怎么办

把请求的URL和返回的数据以及在页面的展示的情况给后台看【后台查询数据、取数据、封装数据方面等蛮难处理的】


10、为什么需要在请求的时候传入参数

后台在查询数据库的时候需要条件查询

目录
相关文章
|
2月前
|
前端开发 JavaScript 安全
前端性能调优:HTTP/2与HTTPS在Web加速中的应用
【10月更文挑战第27天】本文介绍了HTTP/2和HTTPS在前端性能调优中的应用。通过多路复用、服务器推送和头部压缩等特性,HTTP/2显著提升了Web性能。同时,HTTPS确保了数据传输的安全性。文章提供了示例代码,展示了如何使用Node.js创建一个HTTP/2服务器。
82 3
|
2月前
|
前端开发 JavaScript
探索现代Web应用的微前端架构
【10月更文挑战第40天】在数字时代的浪潮中,Web应用的发展日益复杂多变。微前端架构作为一种新兴的设计理念,正逐步改变着传统的单一前端开发模式。本文将深入探讨微前端的核心概念、实现原理及其在实际项目中的应用,同时通过一个简单的代码示例,揭示如何将一个庞大的前端工程拆分成小而美的模块,进而提升项目的可维护性、可扩展性和开发效率。
|
1天前
|
前端开发 NoSQL Java
【Java若依框架】RuoYi-Vue的前端和后端配置步骤和启动步骤
本文介绍了如何配置和启动基于Java的若依(RuoYi)项目,涵盖后端和前端的详细步骤。首先,准备Redis、MySQL以及IDE(如Idea和VS)。接着,通过GitHub获取代码并导入到IDE中,执行必要的SQL文件和配置数据库密码。然后,启动Redis并进行相关配置。最后,按照前端配置步骤克隆前端代码库,打开终端执行命令完成前端配置。整个过程详细记录了每一步的操作,帮助开发者顺利部署若依项目。 如果你觉得有帮助,请点赞、关注和收藏,这将是我持续分享的动力!
17 1
|
21天前
|
开发框架 小程序 前端开发
圈子社交app前端+后端源码,uniapp社交兴趣圈子开发,框架php圈子小程序安装搭建
本文介绍了圈子社交APP的源码获取、分析与定制,PHP实现的圈子框架设计及代码编写,以及圈子小程序的安装搭建。涵盖环境配置、数据库设计、前后端开发与接口对接等内容,确保平台的安全性、性能和功能完整性。通过详细指导,帮助开发者快速搭建稳定可靠的圈子社交平台。
167 18
|
1月前
|
机器学习/深度学习 前端开发 算法
婚恋交友系统平台 相亲交友平台系统 婚恋交友系统APP 婚恋系统源码 婚恋交友平台开发流程 婚恋交友系统架构设计 婚恋交友系统前端/后端开发 婚恋交友系统匹配推荐算法优化
婚恋交友系统平台通过线上互动帮助单身男女找到合适伴侣,提供用户注册、个人资料填写、匹配推荐、实时聊天、社区互动等功能。开发流程包括需求分析、技术选型、系统架构设计、功能实现、测试优化和上线运维。匹配推荐算法优化是核心,通过用户行为数据分析和机器学习提高匹配准确性。
99 3
|
2月前
|
前端开发 JavaScript 搜索推荐
HTML与CSS在Web组件化中的核心作用及前端技术趋势
本文探讨了HTML与CSS在Web组件化中的核心作用及前端技术趋势。从结构定义、语义化到样式封装与布局控制,两者不仅提升了代码复用率和可维护性,还通过响应式设计、动态样式等技术增强了用户体验。面对兼容性、代码复杂度等挑战,文章提出了相应的解决策略,强调了持续创新的重要性,旨在构建高效、灵活的Web应用。
55 6
|
2月前
|
消息中间件 前端开发 JavaScript
探索微前端架构:构建现代Web应用的新策略
本文探讨了微前端架构的概念、优势及实施策略,旨在解决传统单体应用难以快速迭代和团队协作的问题。微前端允许不同团队独立开发、部署应用的各部分,提升灵活性与可维护性。文中还讨论了技术栈灵活性、独立部署、团队自治等优势,并提出了定义清晰接口、使用Web组件、状态管理和样式隔离等实施策略。
|
2月前
|
监控 前端开发 JavaScript
探索微前端架构:构建可扩展的现代Web应用
【10月更文挑战第29天】本文探讨了微前端架构的核心概念、优势及实施策略,通过将大型前端应用拆分为多个独立的微应用,提高开发效率、增强可维护性,并支持灵活的技术选型。实际案例包括Spotify和Zalando的成功应用。
|
2月前
|
前端开发 安全 应用服务中间件
前端性能调优:HTTP/2与HTTPS在Web加速中的应用
【10月更文挑战第26天】随着互联网的快速发展,前端性能调优成为开发者的重要任务。本文探讨了HTTP/2与HTTPS在前端性能优化中的应用,介绍了二进制分帧、多路复用和服务器推送等特性,并通过Nginx配置示例展示了如何启用HTTP/2和HTTPS,以提升Web应用的性能和安全性。
49 3
|
3月前
|
存储 人工智能 前端开发
前端大模型应用笔记(三):Vue3+Antdv+transformers+本地模型实现浏览器端侧增强搜索
本文介绍了一个纯前端实现的增强列表搜索应用,通过使用Transformer模型,实现了更智能的搜索功能,如使用“番茄”可以搜索到“西红柿”。项目基于Vue3和Ant Design Vue,使用了Xenova的bge-base-zh-v1.5模型。文章详细介绍了从环境搭建、数据准备到具体实现的全过程,并展示了实际效果和待改进点。
261 14