笔记 |「产品经理」必懂的技术（一）

写在前面，熟悉一下几组概念：

客户端：客户端也常被叫做用户端，顾名思义，就是用户使用的终端，例如你电脑上的QQ、微信、钉钉等软件，这些都是客户端（Client）。

服务端：服务端是为客户端提供数据的存储、数据的交互处理等的。服务端运行于服务器中，一旦服务器停止运行客户端将会受到严重的影响，甚至不能运行。这种客户端（Client）+服务端（Server）的软件架构模式称为C/S架构。

客户端就是人们视觉能看到的实际软件界面或功能，浏览器也属于客户端。人们浏览一个网站大致是这样的：打开浏览器->输入对应的网址->浏览器发送请求地址->请求后端服务数据->服务端根据请求的内容解析并执行，然后返回对应的数据，最后由浏览器展现给用户浏览，这种浏览器（Browser）+服务端（Server）的架构模式称为B/S架构。现在越来越多的软件架构采用这种模式，例如我们所熟悉的OA（办公系统）、CRM（客户关系管理系统）系统等。B/S的软件架构模式能有效的减少用户的存储空间，信息能够及时得到更新，只需要改动服务端的数据客户端就能实时更新。这也是越来越多的软件采用B/S架构的原因之一。

前台：是指客户端中（网站）所能看到的界面效果，例如一个网站的栏目有：首页、新闻、加盟、关于我们等，这些可被管理的界面内容称为前台。

前端：就是使用浏览器语言来编写相关页面的代码工具。例如html、css、javascript等能够被浏览器所解析执行的语言称为前端。但就目前的“前端市场”中变幻莫测，入局需谨慎。

后台：就是能够动态管理前台内容的管理系统，例如可以动态修改管理员密码、修改前台栏目数据等的操作统称为后台。

后端：就是开发后台管理系统的编程语言。例如我们最熟悉的（PHP、ASP、JSP）等。

web后端和前端是怎么连接的？？？

网站数据处理主要分为三层。

第一层，表示层，这部分可以用HTML代码，CSS/Javascript代码来实现等。通过前端代码可以实现网页的布局和设计。这层又可以称为显示层。也就是你用浏览器打开能看到的网页。

第二层，是业务层，这层是负责处理数据的。常用的代码语言有PHP,JSP，Java等。通过这些后台处理语言的算法来处理前台传回的数据。必要的时候进行操作数据库，然后把结果返回给前端网页。

第三层，是数据层，这个就是数据库，用来存储数据的。通过业务层的操作可以实现增删改数据库的操作。

举个例子就是这样，比方说你在网页上填一个表格然后提交会有以下几种数据传输经过：
①你接触到的是这个网页是属于表示层，这个网页一般由HTML标签结合CSS/JAVASCRIPT来实现的。 这时候你要先填入数据。
②然后你按提交触发后台处理机制，这时候数据会传到后台的代码进行处理。这部分代码根据不同网站可以使PHP,JSP，JAVA等。 代码根据程序员预设的算法将收到的数据进行处理之后会相应的对数据库进行操作，存储数据等。
③成功操作完数据库之后，业务层的代码会再向表示层也就是显示器端传回一个指令通知你表格填写成功。
———————————————————————
产品经理每天需要跟技术人员打交道。有时候我们想知道，我提出的需求技术人员究竟能不能实现？要搞清楚这个问题，我们需要知道技术人员是怎么工作的，他们不同的分工又分别做了什么工作。我们假定团队中只有两类技术人员：前端和后端。虽然测试和运维也同样重要。为了简化思考，我们暂时不考虑他们的工作内容，而只看前后端的工作。

在Web开发中，前端去做界面模板，后端负责数据。这样可以把后端的数据放到前端的模板里。此称为前后端分离。

在前后端分离的开发模式中，前端和后端可以同时进行工作。具体的方式是通过前后端在事先约定好的文档规范。前端人员依据文档写页面模板，后端人员根据文档写API接口。前端可以调用后端的API接口为界面模板填充数据。

如果是纯技术人员，我们大概到这里就介绍完毕了。不过，考虑到这篇文章是为非技术人员写的，所以我有必要更透彻的展开一下。

通过刚才介绍我们发现前后端的依赖关系只在API上。如果API的概念不容易理解，我们可以看看API的定义。

API（Application Programming Interface,应用程序编程接口）是一些预先定义的函数，目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力，而又无需访问源码，或理解内部工作机制的细节。

以上内容来自百度百科

如果觉得难以理解我们可以划下关键词，函数、提供访问程序的能力、无需理解内部工作。API可以简单的理解为一个URL地址。具体来说是前端页面向API发送了一个请求的数据A，后端接收到A，根据业务的需求将A变成处理后的数据B，并把B返回给前端页面上。这个过程中前端不知道也不必知道API内部是如何工作的，前端只需要根据发送的数据获取到需要的数据。后端的工作就是接收前端发来的数据，处理后返回给前端使用。

我们以登陆返回用户数据的一个操作为例进行详细说明。
上述图片是一个前端页面。当我们输入完用户名和密码，就意味着前端的数据已经获取完了。我们点击登陆的按钮后，其实就将数据发送给了后端的API，此处我们假设API地址是 api.com/login 。一般使用JSON这种数据格式，如下图（其实省略了很多数据，以下数据仅供参考）

{
"email":"gaoyakang@outlook.com",
"password":123456789
}

后端拿到上述数据后开始判断并返回

1.该条数据格式对不对？
2.账号密码对不对？
3.如果都对则返回用户信息，如果不对返回错误信息。

假设我们在数据库中有以下的数据：

email 	                password	   RealName  	NickName	  birth	    age
gaoyakang@outlook.com	123456789	   mark	        Rever4433	  1995-04   22

验证成功后，我们开始返回用户信息，根据我们数据库中的数据，我们将要返回RealName、NickName、birth、age等信息给到前端去填充数据。

还是用上述JSON数据格式表示：

{
"RealName":"mark",
"NickName":"Rever4433",
"birth":"1995-04",
"age":"22"
}

前端拿到该数据后把数据渲染到界面上：

这样一条数据从前端发送到后台接收处理，处理完后发送到前端，前端向用户展示这一过程就完成了。

一些说明

为了尽可能简化理解一些难于理解的数据我没有写出来，不过对于非技术人员应该已经足够理解了。另外，实际开发中有的公司可能没有采用接口化的方式，而是前端做界面模板，做完后让后端去填充数据的方式。这种方式虽然前后端结合的实现方式上有区别，但思想上是差不多的。
看完本文，你可能对前后端具体做的事情有了一些理解。也许你还会想知道，前后端开发人员是怎样一起进行工作的呢？前端和后端工作有先后顺序吗？这些疑问我们将会放在下一篇。在下一篇文章中我将描述前后端人员是通过文档来开展工作的。