本文同步至微信公众号http://mp.weixin.qq.com/s?__biz=MzAxMzgwNDU3Mg==&mid=401950045&idx=1&sn=cec056802bb52f909554691d0427f4f0#rd

对后续文章感兴趣的可以扫码关注哈

对于一个非技术人员比如说pm,网站编辑等通常遇到一些问题,不知道是该找前端解决还是应该找后端。也有一些功能,既可以放到前端来做,也可以放到后端来做。这样看似一个模糊不清的问题,然而考虑到后续的维护成本,页面性能时,结论往往是明确的。

一个web应用在开发模式上通常划分为前端和后端。本文基于此,浅偿辄止的聊聊前后端开发分别都是做什么的,以为它们之间如何分工当然还有自己的工作观。希望对非技术人员或初学web开发的同学有所帮助也希望大牛们不要见笑。。

通俗地说,后端是处理数据的,前端是展示数据的。例如,当我们访问一个已展示性为主的站点时,首先会在浏览器地址栏输入该站点的网址。这是浏览器会通过DNS域名解析器获取到该网址对应的站点的ip地址,然后浏览器向对应的web服务器发送请求(http),web服务器响应该请求,从DB中获取数据,并返回给浏览器。如下图所示:红框圈出来的就是后端做的事情,响应浏览器发送的http请求,操作数据库,处理数据,然后返回。浏览器端也就是前端在拿到数据之后,对数据进行展现。这也是通常的以展示性为主的web应用的工作流程。(http为web开发的基石,不清楚的,google之)。

也就是前端关注的是用户体验。真实的还原设计稿,保证web动画的流畅性,在视觉和交互上给用户一种清爽、简洁舒适的感觉。这也是我对于一个好的设计,好的设计稿的理解。用户界面并不是越炫酷就越好的。要追求极致简洁,返璞归真。要做到简单,有时候,往往更艰难。。而数据操作,并发量,权限控制等都是后端关注的。

在对前端,后端有了一个初步的印象之后,接下来,实际开发中前后端是怎么协作的呢?一种方式是前后端开发之前预先定义好数据格式及变量的命名等,然后前端根据设计稿和预先的约定编写页面模板,将模板开发好之后,发给后端程序员。后端在拿到模板之后,操作数据库,用获取到的数据渲染模板生成html页面返回给浏览器。另一种方式是,前后端预先定义好数据格式,然后把数据以json或jsonp形式的接口暴露给前端,然后前端获取到数据之后,在前端进行模板的渲染。具体该使用哪一种方式,或是两种方式都使用,就需要根据具体的业务场景具体分析了。

按照目前的开发模式,目前还无法完全的做到前后端分离。好的应用也都是在前端后端及设计师通力配合的结果。一方面为了降低工作中的沟通成本另一方面从提升工程师自身的开发素质从整体的全局的角度上认识web开发而不是前端开发或者后端开发而言,我们都不应该只局限于前端或后端。前端工程师也应该去了解些后端的知识,后端也应该去学一些前端的知识。在保证知识广度的前提下去拓展知识的深度。

最后,正如文章开头说言,有一些功能,既可以放到前端来做,也可以放到后端来做。不同的实现方式,它的后期的维护成本以及性能往往不尽相同,有时候差别还很大。有的时候,我建议有些功能放到后端完成,并不是想减轻自己的工作量,而是考虑到这些因素之后得出的一个结论。开发当中,不可避免的会碰到一些问题、困难。我们不能因为难做而绕道采用两一种次一些的实现方案。正是因为有一些问题有困难,才有我们存在的价值。当然,一切的一切都是建立在我们每个程序员自身的基础素质之上的。。

web开发漫谈的更多相关文章

  1. web开发微信文章目录

    Web开发微信文章目录 2015-12-13 Web开发 本文是Web开发微信的文章目录.通过目录查看文章编号,回复文章编号就能查看文章全文. 回复编号查看全文,搜索分类名可以获得该分类下的文章.   ...

  2. 为什么做java的web开发我们会使用struts2,springMVC和spring这样的框架?

    今年我一直在思考web开发里的前后端分离的问题,到了现在也颇有点心得了,随着这个问题的深入,再加以现在公司很多web项目的控制层的技术框架由struts2迁移到springMVC,我突然有了一个新的疑 ...

  3. Go web开发初探

    2017年的第一篇博客,也是第一次写博客,写的不好,请各位见谅. 本人之前一直学习java.java web,最近开始学习Go语言,所以也想了解一下Go语言中web的开发方式以及运行机制. 在< ...

  4. 【初码干货】使用阿里云对Web开发中的资源文件进行CDN加速的深入研究和实践

    提示:阅读本文需提前了解的相关知识 1.阿里云(https://www.aliyun.com) 2.阿里云CDN(https://www.aliyun.com/product/cdn) 3.阿里云OS ...

  5. .NET Web开发技术简单整理

    在最初学习一些编程语言.一些编程技术的时候,做的更多的是如何使用该技术,如何更好的使用该技术解决问题,而没有去关注它的相关性.关注它的理论支持,这种学习技术的方式是短平快.其实工作中有时候也是这样,公 ...

  6. web 开发自动化grunt

    现在web开发自动化已很流行,如何进行压缩文件,如何进行测试js是否正确,如何进行 检测html文件是否规范等等都可以通过web自动化技术进行实现,只要打一个命令即可. 本文主要是通过grunt进行实 ...

  7. eclipse SE增加Web开发插件

    最近接触了些java项目,之前安装了eclipse SE版本.没有Web开发插件,调试不了Web代码.点击“Window”--“Preference” 左边菜单栏是找不到“Server”项来配置服务器 ...

  8. Web 开发中很实用的10个效果【附源码下载】

    在工作中,我们可能会用到各种交互效果.而这些效果在平常翻看文章的时候碰到很多,但是一时半会又想不起来在哪,所以养成知识整理的习惯是很有必要的.这篇文章给大家推荐10个在 Web 开发中很有用的效果,记 ...

  9. 12款简化 Web 开发的 JavaScript 开发框架

    前端框架简化了开发过程中,像 Bootstrap 和 Foundation 就是前端框架的佼佼者.在这篇文章了,我们编制了一组新鲜的,实用的,可以帮助您建立高质量的 Web 应用程序的 JavaScr ...

随机推荐

  1. vim常用操作

    vim filename 编辑一个文件 在一般模式里按yy是复制的意思(复制当前行),按yy之前先按相应的数字键就是复制光标所在行到指定的行,然后按p粘贴在一般模式里按dd是删除的意思(也叫做剪切), ...

  2. source 源码下载

    http://blog.csdn.net/zlgydx/article/details/50781258 经常需要查看某些第三方的源码,一直在用的一个网站,功能比较简介.好用. http://grep ...

  3. deep learning 练习1 线性回归练习

    线性回归练习 跟着Andrew Ng做做练习:http://openclassroom.stanford.edu/MainFolder/DocumentPage.php?course=DeepLear ...

  4. eclipse 断点使用深入技能

    原文:http://blog.jobbole.com/26435/ 摘要:调试不仅可以查找到应用程序缺陷所在,还可以解决缺陷.对于Java程序员来说,他们不仅要学会如何在Eclipse里面开发像样的程 ...

  5. APP开发和web开发的区别

    1.web开发: 1.浏览器直接访问,协议是http,基本都是PC访问,也就是在家和办公场合,网络比较好. 2.web如果多个服务集成的话使用的是ESB来统一集成 2.APP开发 1.手机app客户端 ...

  6. 增强VPS SSH账号安全:改端口,禁用Root,密钥登录,Denyhosts防暴力攻击

    VPS SSH账号是我们日常管理VPS的主要登入方式,尤其是Root账号,对Linux系统安全至关重要.以前好多站长喜欢用Putty中文版,这实际是别人修改官方Putty汉化而来,这些软件被植入了后门 ...

  7. iPad 控件UIPopoverController使用

    UIPopoverController 是iPad特有控件,(iOS7-9),在iOS9之后别废弃 使用步骤 设置内容控制器 UIPopoverController直接继承NSObject,不具备可视 ...

  8. 【多线程 5】线程池的类型以及submit()和execute()的区别

    就跟题目说的一样,本篇博客,本宝宝主要介绍两个方面的内容,其一:线程池的类型及其应用场景:其二:submit和execute的区别.那么需要再次重申的是,对于概念性的东西,我一般都是从网上挑选截取,再 ...

  9. Visual C++2012中CMFCPropertySheet的用法

    看到了一个例子(NewControls),该例子中使用了按钮图片等特效(哈哈,个人觉得挺高端),但是仔细看它的工程,没有xxxDlg.cpp就觉得奇诡了,难道不是基于对话框完成的?最终查阅居然是这样的 ...

  10. PIC32MZ tutorial -- OC Interrupt

    In my previous blog "PIC32MZ tutorial -- Output Compare", I shows how to apply Output Comp ...