🦄 2024 独立开发者训练营,一起创业!查看介绍 / 立即报名(剩余10个优惠名额) →

Web 开发,真希望当初有人能告诉我这些(二)

有了基本的网络常识,了解了 Web 语言(HTML,CSS,JavaScript)以后,下一步就可以去学习 Web 应用的开发了。还不了解的话,可以先看看《Web 开发,真希望当初有人能告诉我这些(一)》。

应用,就是应用程序的简称,就像 App 是 Application 的简称一样。应用指的就是能运行在某些地方的可以提供某些能力的东西。Web 应用,就是在 Web 这个环境里运行的应用程序,再细化一点,还会有前端应用,后端应用,移动端应用 ...  作为开发者,我们要做的就是去开发这种东西。

有时候 “网站”(Website) 与 “Web 应用” 这两个词经常会交替使用,因为它们指的都是差不多的东西。网站指的更像是一个 “地方”,在 Web 上的一个地方,大家都可以来访问。Web 应用指的更像是一种东西,比如:“我做了个 Web 应用,它能帮我们管理自己的摄影作品。”

端,就是 “头儿”,这头儿,那头儿,就是这个端,那个端。在 Web 开发里,前端通常指的是浏览器这头儿,后端指的是服务器那头儿。前端应用就是在浏览器上运行的应用程序,后端应用说的就是在服务器上面运行的应用程序。

后端应用的主要作用是定义应用的接口(地址),为应用提供数据的处理能力。比如你给用户提供了一个表格页面,用户用浏览器打开了这个表格页面,在上面填写了一些数据。提交这个表格以后,表格里的数据会交给应用的后端来处理,后端应用收到数据以后可以决定怎么去处理这些数据,比如可以把数据存储在数据库系统里的某个具体的数据库里的某个数据表里面。

在上面这个例子里,提交表格的时候需要用某种特定的方法请求指定的地址,这个地址是我们的后端应用定义好的一个接口。在这个接口上提供了一些功能,它知道如何处理提交过来的表格里的数据,比如把表格里的某个数据内容存储在数据库的某个数据表里的某个字段上。

一般来说用户请求访问一个地址的时候,后端应用会把页面上需要的所有的 HTML 代码组织好,再让 Web 服务器把这些 HTML 代码交给用户的浏览器。用户浏览器收到网页的代码以后,会继续向我们的 Web 服务器要页面上需要的一些资源,比如 CSS,JS,图像等等,最终它会为用户渲染请求访问的这个页面。

Ajax

用户访问的页面内容如果发生了一些变化,要在浏览器上显示发生变化之后的页面,用户需要刷新一下当前显示的页面。刷新这个动作会重新对应用的后端发出请求,这样请求回来的东西就是变化之后的页面内容。比如用户在一个文章页面的评论区域上提交了一条评论,要在页面上显示新提交的评论内容就需要刷新这个文章页面,请求回来的页面内容里面会包含用户新提交的评论。

Ajax 可以让我们不用刷新整个页面就能显示出页面的变化。Ajax 在 Web 开发中应用的很广泛。如果用 Ajax 的形式重新设计一下文章的评论功能,用户提交了评论以后,不需要刷新整个文章页面就能显示出他新提交的评论内容。

用户在评论框里输入评论内容,按了一下提交评论按钮,这时会用 Ajax 方法向我们的应用的后端发出请求。在请求里面会带着评论的内容,后端处理了评论内容,比如把它存储在应用的数据库里。然后给出一个响应,响应里带着用户提交的新的评论数据。使用 Ajax 的形式设计的评论功能里面会包含一个响应的处理方法,就是收到后端的响应以后要做的一些事情。在这个处理方法里面,可以组织一下新的评论内容,把它追加到评论列表里面显示出来。

在页面上的某个需要展示一组幻灯片。每个幻灯片项目上面需要一张大图,配上一些文字,然后在页面上滚动显示这组幻灯片。一般情况下,用户在请求打开页面的时候,你需要把这组幻灯片上的所有资源一块儿交给浏览器,然后通过一点 JavaScript 让它滚动显示,每次只在页面上显示其中的一个幻灯片项目。如果这组幻灯片里面只有几个项目还好,但如果有几十,几百个项目,一块儿把所有这些幻灯片资源交给浏览器会花掉很长时间,也造成了巨大的浪费。

使用 Ajax 的形式设计一下这个幻灯片功能,可以一开始只载入一个幻灯片项目。然后通过一些行为去加载需求的其它的幻灯片资源。比如幻灯片上有一组前后按钮,用户按下向后翻页按钮,如果要显示的幻灯片资源还没被加载,就会发出请求,加载需要的幻灯片资源。从后端那里得到了响应的资源以后,在浏览器这头组织好这些资源,再把它显示出来。

Ajax 也没啥特别的,就是一些普通的 JavaScript 的代码。你可以把它想成是一套方法,这套方法里面包含了发出的 HTTP 请求,还有异步动作的处理。

同步 / 异步

同步,Synchronous。异步,Asynchronous。同步指的是事情是按规定的顺序发生的,假设做一件事情需要经过一系列的环节,如果是同步的话,完成这件事情就需要完成一个接一个的环节,而且必须要等完成了一个环节以后才能进入到下一个环节。如果使用异步的话就不一定非得这样了。

一个餐厅,顾客叫服务生点菜,服务生把菜单交给后厨。如果是同步,那这个服务生要在后厨等待,等后厨把这位顾客点的菜做好以后,把菜再端给顾客,再继续去服务其他的顾客。如果是异步,服务生把菜单交给后厨以后,不用等菜做好,他可以继续去服务其他的客人。等后厨准备好了顾客的菜,服务生可以再去把菜端给相应的顾客。

去银行柜台办业务,同步的方法应该是大家都在柜台前排队,办完一个以后再进行下一个。如果使用异步方法,应该像是领取一个排队号,领完以后你该干嘛干嘛,等叫到你的时候再去柜台办业务。

上面说的 Ajax 就是异步的。一般我们会事先设计好一个响应的处理方法,发出请求以后,后端应用会去处理这个请求,处理的时间可长可短。等处理好了以后,就会做出响应,这时浏览器收到响应以后,会触发执行我们事先设计好的那个响应的处理方法。响应里面通常会包含一些需要的数据,在响应的处理方法里面,你可以随便怎么去使用这些数据。比如把评论项目追加到评论列表上,或者把删除的评论项目从页面上显示的评论列表里面去掉。

前后分离

前后分离指的是把 Web 应用分解成两个部分,前端应用 + 后端应用。前端负责应用的界面,后端只负责数据的处理。也可以说后端负责提供应用的接口,这些接口提供了处理各种请求的能力。

一般的 Web 应用主要就是一个后端应用,用户请求一个页面,后端会把页面上需要的数据用 HTML 组织好,再交给浏览器去显示。如果是前后分离的应用,那后端就只负责把页面上需要的数据准备好,具体怎么使用这些数据,怎么显示它们都是在前端应用那里决定的。

前后分离的 Web 应用通常都可以提供更好的用户体验。用户使用的时候,更像是在使用桌面应用或者移动端应用。还有个好处是,你也可以使用同样的后端去为开发的桌面应用或移动端应用提供数据处理能力。当然你要付出的代价就是需要单独再学习一下前端应用的开发,这就需要去学习前端应用框架,还要学会使用做前端开发时用的一些工具。

后端应用开发语言

你已经做了决定,先要学一下应用的后端的开发。首先你要选择学习一门后端语言,比如 JavaScript(基于 Node.js ),PHP,Python,Ruby,Go。任何一门语言都能创造出伟大的作品。

有些客观因素会影响你到底要选择哪种语言,比如你打算用 Laravel 框架或者 Drupal 系统来开发应用,那你就需要先了解一下 PHP 语言,因为它们都是基于 PHP 语言开发的。要选择使用 Django 框架,你要学习 Python 语言。要用 Rails 框架,你得学一下 Ruby 语言。如果你想基于 Node.js 开发应用,你就需要先了解 JavaScript 语言。

如果你是初学 Web 开发,还没有主意选择学习哪门语言,我推荐先学习 JavaScript 语言,然后基于 Node.js 来创造 Web 应用。因为不管怎么样,JavaScript 语言都是必学的一门语言。这样我们就不用单独再去学一门后端语言,直接用 JavaScript 就可以去创建应用的前端,后端。通过一些技术还可以创建桌面应用还有移动端应用。

后端应用框架与系统

有了后端语言基础,下一步就可以动手去做应用的后端了,不过我们并不需要什么都从头开始自己写。可以选择基于某种框架或者系统去开发,这些框架与系统提供了一些基本的东西,还给我们提供了一套开发的方法。

Laravel,Adonis.js,Rails,Django,这些都属于是 Web 应用框架。WordPress,Drupal,这些属于 Web 应用系统。

在框架里会给我们准备好一些开发应用的时候需要的东西,更重要的是一般框架都会提供了一套开发的方法,大伙可以根据这套方法或者叫规则去开发应用需要的功能。框架的设计者会在框架里加入一些抽象概念,他们会为应用里的不同的东西起个名字。有些名词是常用的,在很多其它的框架上你也会看到,但框架里还会存在一些框架本身特有的一些东西。

学习使用基于框架去开发 Web 应用,你就是要去理解框架里提供的各种东西的作用,还有就是要去学习它提供的那套开发的架构,规则,方法。

系统比框架更进了一步,系统可能是基于某个框架创建的。框架本身并不提供具体的功能,使用框架开发,如果你需要一个用户管理功能,你需要自己去开发一个。但是在系统里面,Web 应用里面需要的一些常用的功能都已经给我们准备好了,比如内容管理,权限管理,用户管理等等。

基于框架或者基于系统开发是两种不同的体验。一开始你会觉得基于系统更简单一些,因为几乎不用写一行代码,把系统安装好以后,你就拥有了一个功能相当强大的 Web 应用了。做的更多的是通过系统提供的界面去创建应用需要的一些东西。随着需求越来越复杂,你需要深入理解系统本身,因为你要开始动手开发,去扩展系统提供的功能。这时你会发现系统的复杂性。

基于框架开发,一开始你就需要先了解框架本身,理解了它提供的工具还有方法以后你才能动手去实现需要的功能。基于框架有更高的灵活性,按需开发,代价就是你要做出更多的决定,要手写更多的代码。

我现在更推荐初学者先从框架开始学习,框架更容易让我们理解 Web 应用的开发,这些知识在使用基于系统开发的时候也是会用到的。

在宁皓网上的《Node.js 应用》(第一季)这个系列里面,就介绍了基于一个 Node.js 框架开发 Web 应用后端的方法。这个系列非常适合初学者学习,不但可以了解如何使用这个 Node.js 框架去开发,你还能理解 Web 开发里面经常用到的一些概念。订阅以后就可以在线学习这个系列课程了。

订阅宁皓网,学习基于 Node.js 开发 Web 应用。

评论

又懂了一些概念

微信好友

用微信扫描二维码,
加我好友。

微信公众号

用微信扫描二维码,
订阅宁皓网公众号。

240746680

用 QQ 扫描二维码,
加入宁皓网 QQ 群。

统计

15260
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点