一、前端、后端、前后端分离是什么?
1. 什么是前端?
定义
狭义上讲,前端又称Web前端,是网站的前台部分,你可以理解成做网页的。

广义上讲,前端就是做用户看得见的东西,可以理解成交互、设计。
目前前端可以使用的范围很广,无论是网页、手机软件,甚至是电脑软件(使用Electron等框架),我们都可以使用前端技术,设计出更加美观、易用的用户界面。

在后续的各种比赛中,前端的作用不可估量。它就是门面,就是评委对你的第一印象。

要学什么呢?
请注意!这三样东西是前端的“一”,而后续我们学习的一些前端框架(Vue.js、React等)都是基于这些“一”实现的。
HTML(页面结构)、CSS(页面样式)、JavaScript(页面交互)

HTML 告诉了浏览器这个页面有什么(即内容、结构),例如有文字、表格、按钮。
CSS 告诉浏览器这个页面长什么样,例如字体大小、表格的颜色、按钮形状等。
JavaScript 则是告诉浏览器页面是怎么交互的,例如我点击按钮弹出提示框,或者从后端读取数据。

2. 什么是后端?
定义
后端是指网站的后台部分,就是用户看不见的东西。主要根据前端发送过来的请求,进行各种业务逻辑处理,然后返回数据给前端,让前端来展现。

后端工程师通常处理数据库、服务器端逻辑等,例如登录信息的验证等。

在一个网站中,前端和后端通过网络进行通信。前端向后端发送请求,后端处理请求并返回数据,前端再将数据展示给用户。
要学什么呢?
Java / Node.js / Golang
以上三选一即可,有兴趣自行了解,此处不作赘述。
本教程会提供 Node.js 的后端程序,以及说明文档,你只需要负责前后端的对接即可。
为什么使用 Node.js 呢?虽然它在高并发等场景下的性能并不好,但它采用了 JavaScript 的语法,更贴近于前端开发者的使用习惯,因此学习成本相对更低。
3. 什么是静态页面,什么是动态页面?
很久以前的网页,就是单纯的静态网页,而后续动态页面的出现,使得前端的交互效果更强大。
静态页面
静态页面就像一张定格的照片,内容固定不变。
比如,一份简历页面,上面的信息不会频繁修改,就像一张展示个人信息的照片。
动态页面
动态页面则像是一块白板,内容可以随时改变。
例如,微博里面的帖子和评论会随着用户的互动而不断更新,就像白板上可以随时写上新的内容,而并非是一张一成不变的照片。
4. 前端与后端的联系
以登录页面为例,做一个博客的登录页面,势必会经历「用户输入账号密码、验证账号密码是否正确、告诉用户登陆成功/失败」这三个步骤。
我们用前后端的知识介绍这三个步骤:
前端发送请求给后端,告诉后端用户输入的账号密码是什么。
后端从数据库里查询数据,看看账号密码是否正确。
查到了 → 告诉前端「登录成功」
没查到 → 告诉前端 「不存在该用户或账号密码输入错误」
前端:弹个提示框——「登陆成功/失败」

明白了吗?
很好!接下来,我们进一步细化这个思维导图:

怎么样,是不是已经开始头疼了?我知道你很急,但你先别急,前方干货来袭!

就像刚才一样,我们把所有过程重新过一遍:
- 用户打开浏览器,前端对页面进行呈现。
- 用户输入了账号密码,点击「登录」按钮。
- 此时前端向后端发送请求,告诉后端「用户输入了 admin 123456 的账号密码」。
- 后端查一下数据库,看看有没有「username=admin 并且 password=123456」的这一条记录。
- 结果woc,查到了!那就说明账号密码输入正确,告诉用户登录成功。
- 这时候,后端向前端发送「登录成功」的信号。
- 前端收到这个信号,弹框告诉用户「你登陆成功了」。
很好,接下来我们可以深究上图中一些不懂的小细节了!
1. 请求方式
按照 RESTful
API 接口规范,我们主要采用 GET POST PUT DELETE 四种标准方法
GET 请求:仅用于请求向服务端获取信息(像数据库中的 SELECT 操作一样),例如获取所有用户列表
PUT 请求:请求对服务端的内容进行更新修改(像 UPDATE 一样),例如修改用户信息
POST 请求:请求向服务端插入信息(像 INSERT 操作一样),例如用户注册(相当于插入一条新记录)
DELETE 请求:请求在服务端删除信息(像 DELETE 一样),例如删除某条用户的信息

这样有一点好处,不仅区分了这四种请求,更加规范清晰,
而且我们只需要使用 http://localhost/user 一个地址,就可以完成对用户的所有操作。
而不是使用 POST http://localhost/addUser POST http://localhost/deleteUser 等一系列地址 ...

扯一句题外话,后端开发的本质,大多是围绕对数据库的「增加记录、删除记录、修改记录、查询记录」展开,用英文简称 CRUD ,因此很多写后端的小伙伴也经常自嘲自己是 CRUD boy。

前后端分离是什么?
前后端分离是一种开发架构,将前端和后端的开发分开进行。
前端负责展示界面和用户交互,后端负责处理业务逻辑和数据存储。
它们通过API(应用程序接口)进行通信。
这种分离有助于提高开发效率,允许前后端团队并行开发,同时使得系统更易于维护和扩展。