精华内容
下载资源
问答
  • 前后端常用语言介绍
    万次阅读 多人点赞
    2018-05-10 18:33:18
    前后端及常用语言介绍
    珞闻
    来自: 珞闻(知行。) 2015-04-19 23:25:13
    前后端的划分,可以简单地理解为凡是运行在用户设备上的技术都可以称为前端技术( 比如 HTML / CSS / JS,甚至移动设备的 Obj-C / Swift );而后端的作用就是负责将这些东西封装在 HTTP 的数据包中然后通过网络传送到前端。当然除了这些前端文件,后端还有一个更重要的职能,即保存和提供用户数据,比如移动端常见的 JSON 就是目前最流行的在后端和前端之间传输的一个文件格式。
    喜欢
    回应 推荐 喜欢 只看楼主
    珞闻
    珞闻 (知行。) 2015-04-19 23:25:59


    以 Web 端为例,在浏览器输入一个网址后,浏览器向服务器发送了一个 HTTP 请求;服务器通过一个 HTTP 响应,把显示这个网页所需要的资源传回给了浏览器。而需要在浏览器中执行的技术,HTML / CSS / Javascript 等就叫做前端;需要在服务器端执行的、通常我们看不到技术就叫做后端。 


    回应赞
    珞闻
    珞闻 (知行。) 2015-04-19 23:26:40


    | Web 前端语言 


    HTML 和带样式的 HTML 
    HTML 就是一组标签和文本的组合,是一个最基本的网页。它已经包含了网页常见的元素,实际上在 Web 早期的很长一段时期内,网页都是这个样子。后来随着使用网络的人群越来越广泛,在 HTML3.0 中引入了对网页样式的定义,某种程度上可以说,也是从这个时候开始产生了网页设计师的角色。 


    CSS 
    带样式的 HTML 也拥有一个缺点,它需要为每个标题和文字都设定样式,工作量非常庞大。 CSS 就是在这样的情况下诞生了。CSS ,又称叠层样式表,简言之是一种用来表现 HTML 文件样式的样式设计语言。CSS 能够对网页中的对象的位置排版进行像素级的精确控制,实现基础的静态的交互设计;而CSS 目前的最新版本 CSS3 能够真正做到网页表现与内容分离。 


    Javascript 
    差不多在 CSS 诞生的同一时间,大家开始觉得这样静态的网页似乎略显无聊,能不能给网页加入一些可以动起来的元素?比如点击一个按钮之后变个颜色。当时网景公司的工程师Brendan Eich 就给他们自家的浏览器引入了这种实现动态效果的脚本语言,这就是 Javascript(简称 JS)的诞生。所以通俗来说,Javascript 就是用来给 HTML 网页增加动态功能,实现更炫酷的交互。 


    提到 Javascript ,就得提一下 jQuery 。 jQuery 是一个优秀的 Javascript 库。jQuery 使用户能更方便地处理 HTML ,它能够使用户的 HTML 页面保持代码和 HTML 内容分离,通过 jQuery ,可以不用在 HTML 里面插入一堆 JS 来调用命令,只需要定义 ID 即可。此外,由 Twitter 设计师 Mark Otto 和 Jacob Thornton 合作开发的 Bootstrap 也是一个受欢迎的前端框架。


    回应赞
    珞闻
    珞闻 (知行。) 2015-04-19 23:27:49


    | HTML5 简史和响应式设计 


    HTML 在刚诞生的前 10 年发展是非常迅速的,在 1999 年,我们现在常说的 HTML5 的上一个版本 HTML4.0.1 就已经发布了,那么为什么从 4.0 到 5.0 会拖了 15 年之久? 


    首先,HTML4 的发布时间和门户时代(即 Web 1.0 时代)是基本吻合的,也就是说 HTML4 实际上是为门户型网站设计的。在门户网站经历的 4,5 的年发展之后,大家开始觉得只是单一接受信息的互联网太过无聊枯燥了,差不多 2004、2005 年开始,大家希望在网页中加入更多的互动元素,也就是我们常说的 Web 2.0。 


    但是这个时候大家发现,为 Web 1.0 设计的 HTML4 无法胜任这个工作,但是有另外一个技术却非常适合,那就是 Flash。所以在 Web 2.0 的早期,当时最炫酷的网站有很多是完全用 Flash 开发的,在以后的很长一段时间里,有很多网站都是 HTML 和 Flash 的混合式网站。所以在 2005 - 2010 年这段时间,HTML5 中的新标准主要是为了取代 Flash。 


    刚刚搞定了 Flash,又进入了移动开发时代,所以 HTML5 又花了 5 年时间制定各种针对移动平台的标准。但是到目前为止,虽然 HTML5 已定定稿,但是对移动平台的适应其实还在进行中,所以在未来很长一段时间内,就像当初的 Flash 一样,我们会看到越来越多的混合式应用。 


    在 iPhone 出现之前,大家访问 Web 的主要方式还是通过桌面浏览器,所以设计网页时只要考虑桌面浏览器的显示效果就足够了。但是在 iPhone 和 iPad 出现之后,就需要考虑同一个网页在不同设备上的显示效果,第一个问题的答案就是响应式,响应式的核心就是让同一个网页可以在不同设备上呈现出不同的显示效果,主要是通过CSS来实现的。 


    除了响应式设计,HTML 在移动端遇到的另外两个问题就是如何利用移动设备的各种传感器,比如 GPS,摄像头等等;以及性能问题。为了解决这些问题,HTML5中添加了地理位置,拍照,3D 动画加速等等 API,可以部分的利用手机设备的一些新硬件,并且新的 API 还在不断的加入进来,这也是为什么现在的 HTML5 应用可以越来越炫酷的原因。但是,HTML5 并不是专为移动设备设计的,它是由 HTML5,CSS3 以及大量的 Javascript API 共同组成的一个标准合集,微信中的 HTML5 应用只是 HTML5 应用场景中的很小一部分。


    回应赞
    珞闻
    珞闻 (知行。) 2015-04-19 23:28:10


    | 如何判断一个前端的能力? 


    关于前端,可以简单的把它理解为,凡是在我们的电脑,手机上运行的技术,HTML,CSS,Javascript,这些都属于前端技术,使用这些技术的我们就称为前端工程师。如何判断一个前端的能力呢?下面是一个简单的前端能力链: 


    1/ 只会 HTML/CSS 的,这种我们俗称切图的,基本上就是淘宝几十块切一张图的; 


    2/ 懂一些简单的 Javascript,主要是使用一些现成的框架,比如 jQuery,bootstrap 等等; 


    3/ 知道 jQuery 和 Bootstrap 的局限,必要时能写一些原生的 JS/CSS 代码; 


    4/ 对JS/CSS非常了解,执着于使用浏览器的各种最新特性来实现各种炫酷效果,这种我们成为炫技派; 


    5/ 可以自己写出类似 jQuery / Bootstrap 这样的前端框架供其他人使用。 


    | 前端学习资料 


    http://www.w3schools.com 


    http://onemonth.com 


    http://www.codecademy.com/ 


    https://github.com/alex/what-happens-when 


    https://qdan.me/list/VNBugw7ObupFRdlE 


    回应赞
    珞闻
    珞闻 (知行。) 2015-04-19 23:30:01


    | 后端服务器 


    后端的任务实际上就是向前端提供需要显示网页和 APP 内容的数据,可能是 HTML,也可能是JSON 数据,也可以是音视频或者 PDF 文件。简单的来划分,一个服务器包含3个部分: 


    1/ HTTP 服务器 


    2/ 应用服务器 


    3/ 数据库 


    HTTP 服务器的唯一任务就是把需要返回给客户端的资源文件封装在 HTTP 数据包里,这个资源有可能是它后面的应用服务器动态生成的,也有可能是保存在硬盘上的静态文件。这是所有后端程序都必须有的,也是直接和我们的浏览器通信,返回给我们数据的程序。它的作用就是把它后面的编程语言生成的各种 HTML/CSS/Javascript,打包成一个 HTTP 请求,然后再封装到一个 TCP/IP 的数据包里发回给我们。而最常用的两个 HTTP 服务器叫做 Apach 和 Nginx。 


    应用服务器就是通常意义上所说的码农负责的部分。他们的职责就是生成前端需要的HTML/CSS/JS 交给浏览器。 


    | 后端语言 


    1/ .net/java 
    庞大,复杂。但 Java 的优点就是适合处理特别大的数据量,如果你的项目会很快实现大爆发,需要处理海量的请求,那么 Java 是一个不错的选择。 


    2/ PHP 


    可以快速上手,相比其他语言,可以更快的为应用添加各种新功能。当然,可维护性就另当别论了。 


    3/ Ruby 


    非常接近自然语言,基本上即使不懂编程,也能看明白 70% 或 80%。04 年出现了一个用 Ruby 编写的 Web 开发框架 Ruby on Rails,当时的效果是非常震撼的,以前需要一个团队才能搞定的事情,使用 Ruby on Rails 后 1 个人就可以胜任了,所以 Ruby on Rails 在极短的时间内就成为了 Ruby 的代名词,也成为了新手学习 Web 开发的不二选择,但是 Ruby 语言也并非十全十美,快的同时,他的最大短板就是性能。Twitter 最早就是使用 Ruby on Rails 开发的,但是随着用户数的逐步增长,Twitter 的宕机开始变得非常频繁,后来他们迫不得已将整个系统从 Ruby 迁移到到了一个从 Java 派生出来的语言 Scala。 


    4/ node.js 


    简单来说,可以把 node.js 理解为跑在服务器上的 javascript,再直白一点,就是一个跑在服务器上的浏览器,因为 node.js 最早就是从 chrome 浏览器的Javascript 引擎 V8 中剥离出来的。相比 Ruby,Node.js 程序可以获得更高的并发性能,这在一些高并发的场景下(比如群聊,多人协作等)会很有优势。 
    5/ 其它(python,closure 等) 


    6/ 无后端(leancloud) 


    无后端编程是最近的一个新趋势,但她并非说是真的没有后端,而只是把后端交给一些第三方的云平台,比如 Leancloud,Firebase 等。如果你开发一个手机 App,这样的好处就是你可以在早期没有后端程序员的情况下快速开工,像Leancloud 这样的云平台已经可以胜任大部分的应用场景,如果后期业务逻辑复杂之后再寻找合适的后端工程师迁移也不迟。 


    7/ 最强编程语言 Lisp 


    如果要评选一个最强的编程语言,该是哪个呢?答案就是Lisp。为什么是 Lisp?Lisp 的作者在很早以前就从数学的层面总结了一个完美的编程语言应该具备的 9 种能力,而 Lisp 就是为了配合他的这个理论而产生出来的语言。Hacker News 是由 YC 的创始人 Paul Graham 开发的,而 Paul Graham 本身就是一个 Lisp 程序员,他为了开发 Hacker News,专门发明了一种新语言叫做 Arc,但因为它是基于 Lisp 的,所以也被归为了 Lisp 的方言之一。 


    | 数据库 


    我们平常访问的大部分网站都是需要登录操作的,登录之后我们看到的就是只和自己相关的那部分内容。这些用户信息是保存在什么地方的呢?这就需要用到数据库。关于数据库,代表性的有两个: 


    1/ MySQL 


    2/ MongoDB 


    MySQL 是最常用的结构化数据库,也是大多数创业公司的选择。为什么是结构化的?就是说它的表的结构是固定的,比如我们常见的 User 表在 MySQL 中就是这样的: 
    id name email password 
    1 一元 y@modao.io $2a$10$ZxNhLyDTdagtUc... 
    2 产品集小妹 xiaomei@36kr.com $2a$10$zK7TnBXYYFz... 


    如果我们需要取得一条用户记录来检查他输入的密码是否正确,这时我们就需要使用 SQL,SQL 就是结构化查询语言。 


    简单来说,SQL 数据库保存的是结构化数据,NOSQL 数据库则可以保存非结构化数据。举个例子,还拿上面的用户表来举例,如果我们现在想要给产品集小妹增加一些额外的属性,比如她给某个产品点赞可以效果 x2,那么如果是 SQL 数据库,我们就需要给数据库增加一个新的字段来保存这个属性: 


    id name email x2 
    1 一元 y@modao.io false 
    2 产品集小妹 xiaomei@36kr.com true 


    但是如果是 MongoDB 这样的 NOSQL 数据库,我们就不需要给所有用户都增加一个x2的属性,只需要给产品集小妹单独增加就可以了,NOSQL 中保存到数据是如下这个样子的: 


    {id: ‘1’, name: ‘一元’, email: 'y@modao.io’, password: ‘…’} 
    {id: ‘1’, name: ‘产品集小妹’, email: 'xiaomei@36kr.com’, password: ‘…’, x2: true} 


    | Cookie 和 Session 


    服务器要处理成千上万用户的请求,那么他是如何区分每个用户,并返回给每个用户他所需要的内容的 ?这就要涉及到 Cookie 和 Session。我们可以将 Cookie 理解为是服务器给每个用户分配的唯一 ID,这个 ID 由用户浏览器保存,而 Session 则是服务器为了维护这个会话在服务器端保存的与 cookie 对应的用户数据。 
    | 移动开发 


    移动端和浏览器的区别就在于,大部分 App,我们打开的一瞬间,就已经看到了它的界面,而不用再去向服务器来拿显示界面的 HTML 等文件。所以移动端,开发原生应用所运用到的技术(比如 Objective C,swift)就相当于前端的 HTML,只不过它是直接保存在应用本地的。这样就产生了一个问题:如何来获取应用数据?如果是网页应用,我们可以直接将数据包含在HTML 中一并反馈给浏览器;但是对于移动应用就需要有一个专门的协议来传送应用需要的数据,这就是 JSON。 


    移动应用的前端技术,目前来说主要有以下三种: 


    1/ 原生 


    2/ 混合式 


    3/ HTML5 


    HTML5 必经要经过浏览器这个中间层,所以在性能上多少会有些损失,所以如果你的应用对性能特别敏感,原生就会是比较好的选择;对于普通的性能要求没那么严格的应用来说,HTML5是完全可以满足的。而如果已经有了一个移动端的网站,这种情况下混合式就会是一个比较好的选择,它可以最大程度的利用已有的资源。如果说你是从头开发一个移动应用,并且这个应用对用户体验的要求也不是特别严格,那么 HTML5 就会是一个很好的选择,HTML5 移动应用比较显著的应用就是 Dailycost 。 


    如果说开发一个原生应用需要 4-6 周,那么同样功能的应用如果我们把其中的一部分用 HTML来实现,那么可能就只需要 3-4 周的时间,但是如果我们全部使用 HTML ,可能就只需要1-2 周。
    更多相关内容
  • 值得介绍的是,本课程在技术栈层面涵盖了“用户身份认证”、“接口鉴权”等业务场景常用的大部分技术,包括Spring Boot2.x、Spring MVC、Mybatis、加密解密算法AES、雪花算法Snowflake、统一验参工具ValidatorUtil、...
  • WEB 前端在线编辑器 1、JS RUN (支持手机) 附带图片: 2、CodePen 3、CodeSandBox 4、JS Bin

    WEB 前端在线编辑器

    1、JS RUN (支持手机端)

    附带图片:
    在这里插入图片描述

    2、CodePen

    在这里插入图片描述

    3、CodeSandBox

    在这里插入图片描述

    4、JS Bin

    在这里插入图片描述

    展开全文
  • 全新Go语言前后端分离实战项目(Beego) 张长志技术全才、擅长领域:区块...

    扫码下载「CSDN程序员学院APP」,1000+技术好课免费看

    APP订阅课程,领取优惠,最少立减5元 ↓↓↓

    订阅后:请点击此处观看视频课程

     

    视频教程-全新Go语言前后端分离实战项目(Beego)-Go语言

    学习有效期:永久观看

    学习时长:193分钟

    学习计划:4天

    难度:

     

    口碑讲师带队学习,让你的问题不过夜」

    讲师姓名:张长志

    CTO/CIO/技术副总裁/总工程师

    讲师介绍:张长志技术全才、擅长领域:区块链、大数据、Java等。10余年软件研发及企业培训经验,曾为多家大型企业提供企业内训如中石化,中国联通,中国移动等知名企业。拥有丰富的企业应用软件开发经验、深厚的软件架构设计理论基础及实践能力。项目开发历程:基于大数据技术推荐系统 ,医疗保险大数据分析与统计推断,H5跨平台APP,携程酒店APP,Go语言实现Storm和ZK类似框架。

    ☛点击立即跟老师学习☚

     

    「你将学到什么?」

    本课程是一个Go语言得企业级前后端分离案例,老师会带着你去设计数据库、后台开发、前端开发,完成一个完整得小型案例,通过这个案例让你掌握Go语言的开发流程。

     

    「课程学习目录」

    1.01beego房地产项目简介
    2.02beego房地产项目前端项目搭建过程
    3.03beego房地产项目静态页面重定向
    4.04beego房地产项目介绍公司开发流程
    5.05beego房地产项目数据库的设计和创建
    6.06beego房地产项目的地区页面展示
    7.07beego房地产的首页注册和登录页面
    8.08beego房地产的注册和登录按钮显示
    9.09beego房地产的注册功能实现逻辑
    10.10beego房地产的注册功能数据保存到数据库中
    11.11beego的session返回客户端显示
    12.12beego房地产的注册和session处理
    13.13beego房地产的session删除功能
    14.14beego房地产的错误码处理功能
    15.15beego房地产的登录页面逻辑
    16.16beego房地产的缓存redis的实现

     

    7项超值权益,保障学习质量」

    • 大咖讲解

    技术专家系统讲解传授编程思路与实战。

    • 答疑服务

    专属社群随时沟通与讲师答疑,扫清学习障碍,自学编程不再难。

    • 课程资料+课件

    超实用资料,覆盖核心知识,关键编程技能,方便练习巩固。(部分讲师考虑到版权问题,暂未上传附件,敬请谅解)

    • 常用开发实战

    企业常见开发实战案例,带你掌握Python在工作中的不同运用场景。

    • 大牛技术大会视频

    2019Python开发者大会视频免费观看,送你一个近距离感受互联网大佬的机会。

    • APP+PC随时随地学习

    满足不同场景,开发编程语言系统学习需求,不受空间、地域限制。

     

    「什么样的技术人适合学习?」

    • 想进入互联网技术行业,但是面对多门编程语言不知如何选择,0基础的你
    • 掌握开发、编程技术单一、冷门,迫切希望能够转型的你
    • 想进入大厂,但是编程经验不够丰富,没有竞争力,程序员找工作难。

     

    「悉心打造精品好课,4天学到大牛3年项目经验」

    【完善的技术体系】

    技术成长循序渐进,帮助用户轻松掌握

    掌握Go语言知识,扎实编码能力

    【清晰的课程脉络】

    浓缩大牛多年经验,全方位构建出系统化的技术知识脉络,同时注重实战操作。

    【仿佛在大厂实习般的课程设计】

    课程内容全面提升技术能力,系统学习大厂技术方法论,可复用在日后工作中。

     

    「你可以收获什么?」

    1.掌握Go语言前后端开发得流程

    2.能通过老师的课程自己开发出案例

     

    展开全文
  • 简单讲解前后端分离技术,前后端分离技术的演进过程。

    目录

    一、前言        

    二、前后端分离的演进过程

            2.1 发展的三个阶段

            2.2 前后端不分离阶段(Java的JSP作为前端视图时代)

            2.3 前后端半分离阶段(前后端使用Ajax交互的半分离时代)

            2.4  前后端完全分离阶段(前后端使用代理服务器的完全分离时代(MVVM))

    三、结语


    一、前言        

            各位小伙伴大家好,又跟大家见面了,我就是那个白天晚上都在写代码的IT小白,白天忙于工作,晚上忙于整理公众号,你说小弟我容易吗。谁让我的心里只有学习呢!!!

            为什么聊到这个前后端分离呢,其实在我17年大学毕业(ps:不小心暴露了年纪)的时候,其实就已经用到了前后端分离技术,当时后端的框架使用的是SpringMVC+iBatis,做了基于Maven多模块+Dubbo的SOA架构,前端采用的是基于Vue的element UI,前后端接口使用Swagger作为前后端开发API。开发方式甚爽,虽然我也写前端,但是前后端分离后的开发方式,会大大增加开发效率,今天我就给大家讲讲什么是前后端分离,和前后端分离的演进流程吧。(ps:内容示例用Java应用作为示例。)

    二、前后端分离的演进过程

            2.1 发展的三个阶段

    • 1. 前后端不分离阶段
    • 2. 半分离阶段
    • 3. 分离阶段

            2.2 前后端不分离阶段(Java的JSP作为前端视图时代)

            JSP的概念(百度百科):

            JSP(全称JavaServer Pages)是由Sun Microsystems公司主导创建的一种动态网页技术标准。JSP部署于网络服务器上,可以响应客户端发送的请求,并根据请求内容动态地生成HTML、XML或其他格式文档的Web网页,然后返回给请求者。JSP技术以Java语言作为脚本语言,为用户的HTTP请求提供服务,并能与服务器上的其它Java程序共同处理复杂的业务需求。

    JSP的强大功能:

            简单来讲JSP算是对Java影响巨大的一个技术,奠定了Java走向B/S架构的基础,JSP的出现让Java从只能做C/S客户端扩展到了B/S架构。JSP可以实现与HTML、JavaScript、Java代码结合,完成页面的展示,做数据的处理,与Java服务器结合完成更复杂的业务。

     开发过程中的诟病:

            JSP目前已经淘汰,更加流行的技术:Vue、React迅速占领软件市场,那为什么JSP会被淘汰呢,思考下,你在开发的过程中,有没有遇到过这样的情况,大家请看下面的代码。

    <%@ page language="java" contentType="text/html; charset=UTF-8"
        pageEncoding="UTF-8"%>
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>登录界面</title>
    </head>
    <body>
    <jsp:useBean id="user1" class="cn.crabshell.pojo.user"></jsp:useBean>
    <jsp:setProperty property="username" name="user1"/>
    <jsp:setProperty property="password" name="user1"/>
    
    <%=user1.getUsername() + " : " +user1.getPassword() %>
    <%-- <jsp:getProperty property="username" name="user1"/> --%>
    
    <%
        if(user1.checkLogin()){
            out.println("登录成功");
        }else{
            out.println("登录失败");
        }
    %>
    </body>
    </html>

            从上面的代码可以看到,JSP融合了html标签、JSTL标签、Java代码,在进行开发的时候,前端的同事在进行界面布局之后,后端同事需要在前端的界面上写Java代码才能完成前端界面的完整业务。这样高强度耦合的方式,直接导致开发、联调时间增加,这也就是JSP时代的诟病。

    【优缺点分析】

    优点:

    1. 前端可以编写Java程序,后端人员可直接在页面上写后台逻辑。

    2. 技术单一,容易掌握,代码好排查问题

    3. 一个技术人员即可完成前后端的功能开发,适合小型企业使用

    缺点:

    1. 影响整体开发进度,前后端无法单独分工

    2. 后端编译代码时,需要把前端代码编译(JSP其实也是Java的Servlet编写的,需要后台编译)

    3. 运行时前后端跳转不断(来回转发,界面不能局部刷新),影响用户体验。

            2.3 前后端半分离阶段(前后端使用Ajax交互的半分离时代)

    Ajax概念(百度百科):

            Ajax是什么呢?Ajax 即“Asynchronous Javascript And XML”(异步 JavaScript 和 XML),是指一种创建交互式、快速动态网页应用的网页开发技术,无需重新加载整个网页的情况下,能够更新部分网页的技术。

    Ajax的功能

             Ajax的出现,解决了网站每次提交参数都要转到后台,再跳回前台的方式,可以异步的动态刷新网页局部的数据,Ajax与后台交互只做数据传输,后台只负责后台的工作,前台请求后台接口,将响应的数据在在前端进行渲染即可,下面用登录功能来描述。

    å¾ç

             前端工程要做的事情就是将前端界面布局做好,与后端交互,然后将请求的数据进行渲染或者跳转页面,后端则只需要做好数据交互即可,这样就将前后端的工作进行拆分,每个人做专职的事情。但是为什么称为是半拆分呢?因为此时前端工程需要依赖后端工程的服务器才能启动起来(一般Java程序需要放到webapp下,前端无法单独启动),后端出现问题时,前端无法进行单独开发,需要等待后端接口处理完成问题后才能继续。

    【优缺点】

    优点:

    1. 前后端技术分开,可专人做专事情

    2. 界面可以局部刷新,前后端联调变得方便

    3. 前端可以多种技术选择,更好的完成项目业务建设

    缺点:

    1. 当前端选择复杂的业务时,对前端技术要求较高,后端只能参与简单的业务开发。

    2. 前后端依赖严重,当后端接口出现问题时,前端无法继续调试项目。

    3. 前后端联调需要双方完全开发完毕才能联调功能,联调时间变长。

            2.4  前后端完全分离阶段(前后端使用代理服务器的完全分离时代(MVVM))

    MVVM概念(百度百科):

            MVVM是Model-View-ViewModel的简写。它本质上就是MVC 的改进版。MVVM 就是将其中的View 的状态和行为抽象化,让我们将视图 UI 和业务逻辑分开。当然这些事 ViewModel 已经帮我们做了,它可以取出 Model 的数据同时帮忙处理 View 中由于需要展示内容而涉及的业务逻辑。

    个人理解:

            其实MVVM是在MVC的基础上进行完善,目前使用MVVM的架构的象征代表为Vue,将数据和模型进行双向绑定,当程序改变了数据时,及时将界面的渲染数据进行修改。推翻了之前的jquery渲染dom的方式,开发全新的渲染方式,简便了开发人员的开发方式。

    å¾ç

     名词解释:

    • 模型层 (Model):

      负责从各种数据源中获取数据;

    • 视图层 (View):

      用于展示给用户和处理用户交互,会驱动 ViewModel 从 Model 中获取数据;

    • ViewModel 层:

      用于将 Model 和 View 进行关联,我们可以在 View 中通过 ViewModel 从 Model 中获取数据;

      当获取到了数据之后,会通过自动绑定,比如 DataBinding,来将结果自动刷新到界面上。

    如何前后端分开开发

            可能有的朋友会思考,前后端如何分开开发呢,前端不还是要依赖后端接口才可以正常渲染数据吗,推荐几个常用工具即可解决这个问题。

    技术名称描述及用处
    mock.js一款数据模拟组件,可结合vue,完成数据中英文、数字各种格式的数据,拦截前端的请求,完成数据返回,解决前端依赖后端数据接口的问题。
    Swagger后端接口API文档,Java工程可集成swagger组件,在接口上增加简单的注解,即可生产后端接口文档,包含接口地址、接口请求方式,出入参格式,也可输入模拟数据进行测试,前端只需要访问后端工程的这个界面,即可找到接口地址和出入参接口规范。
    nginx反向代理服务器、文件负载服务器,可将前端使用nginx承载(这也是目前市场上流行的前端部署方式),访问nginx的地址即可访问前端工程,将前端工程的请求代理到后端的请求地址上即可完成。后端记得处理下跨域问题哈。

    开发流程及部署图

    1. 前端开发的过程中使用webpack命令,使用webpack-dev-server配合node.js程序来运行服务,使用模拟数据进行功能开发即可。当需要连接后端接口时,关闭mock,连接后端开发的服务即可,不需要单独启动后端工程。

    2. 后端正常开发restful风格的接口,使用swagger进行接口注释,联调时,将服务暴露给前端调试即可。

    3. 部署时,前后端分开部署,前端使用webpck打包后,将打包后的文件放到nginx服务器下,后端打包成jar/war,使用指定的方式启动即可。

    å¾ç

     优缺点

    优点:

    1. 前后端技术分开,工程分开,互不影响开发。

    2. 前端组件化,有更多的扩展空间。

    3. 前端也可部署集群,且不依赖后端工程,生产环境功能服务主机互不影响。

    缺点:

    1. 对技术要求较高,需要掌握最新的技术

    2. 部署流程复杂,不适合小型企业使用

    3. 前后端分离后,查问题过程更长。

    4. 前后端技术完全隔离,学习成本较高。

    三、结语

            前后端分离技术,是目前主流的大型企业都在使用的技术,前后端分开开发,分开部署的方式,既提高了开发效率(专人专职),又提高了项目的承载能力,是一个值得使用的技术。

    今天就到这里了,有问题请指出,欢迎各位来踩,多多交流技术。

     觉得不错的关注下公众号吧

    å¾ç

    展开全文
  • 前后端分离架构设计(权限模型)

    千次阅读 2019-05-17 11:14:05
    打算写写关于管理系统前后端分离方面的文章,也是做一个知识的总结。 术语描述 用户(Subject):发起操作的主体 对象(Object):指操作所针对的客体对象,比如文章或评论 权限(Permission)...
  • 前后端交互数据格式

    千次阅读 2021-03-10 18:10:05
    前后端交互常用的数据格式有:json、xml、form表格 1. json(主流数据格式) 使用json数据结构,传输效率高,解析简单,是目前最流行的一种数据交互格式。 数据交互格式方式 基本类型 数组类型 对象嵌套 2. XML...
  • 前后端的交互数据格式有:json、xml及from表格; JSON: 使用json数据结构,传输效率高,解析简单;(主流的数据格式) XML: 具有跨平台,跨语言的特点;(基本不怎么用了) YAML: 是一种直观的能够被电脑识别的数据...
  • Vue:前端体系、前后端分离

    千次阅读 2020-07-31 20:21:50
    缺点 前端开发重度依赖开发环境,开发效率低,这种架构下,前后端协作有两种模式: 第一种是前端写 DEMO,写好后,让后端去套模板。好处是 DEMO 可以本地开发,很高效。不足是还需要后端套模板,有可能套错,套完后...
  • 前后端交互

    千次阅读 2022-02-15 09:24:47
    服务器 网络相关知识 网站分类 静态网站 动态网站 静态网站 ...特点:网页内容是固定,...常用语言:Java、Python、PHP(本套课程要了解的知识) 前后端的关系(客户端和服务器端) 服务器端是为客户端服务的,客户端就
  • 前言 这几年一直在it行业里摸爬滚打,一路走来,不少总结了一些python行业里的高频面试,看到大部分初入行的新鲜血液,还在为各样的面试题答案或收录有各种困难问题 于是乎,我自己开发了一款面试...什么是前后端分离
  • 浅谈前后端分离及RESTful API

    万次阅读 2018-11-14 19:56:55
    从最开始不懂得网站上的内容从何而来,到现在经手几个项目后对前后端和互联网有了专业上的粗浅认知,所学越多,需学越多。当专业课上还在讲解着基于C#的ASP.NET开发中,如何拖动Button按钮,如何“快速”构建出一个...
  • 前后端交互(javaweb)

    千次阅读 2021-02-28 08:50:24
    前段后台交互的学习(Java web)标签 : 前后端交互 Javaweb下面介绍了一些关于交互的细节:请求数据前端提供请求数据。在开发中,后台在查询数据库时,需要借助查询条件才能查询到前端需要的数据,而查询条件正是此时...
  • 前后端技术科普

    千次阅读 2019-08-24 20:59:18
    刷新率标识了一个输出设备每秒钟会更新多少次,它的单位是 Hz,例如我们常用的液晶显示器的刷新率 60Hz,显示器其实是每一秒中更新了六十幅图片。 刷新率是由硬件决定的,越高的刷新率就会有越连贯的图像,并且...
  • 摘要:本文是关于前后端分离项目的技术与框架选型通用方案,是一个比较成熟的方案。目前大部分公司也是采用这个体系。 一、系统架构  整个系统会由三部分组成,如下 二、细节 1、前端 ...
  • springboot前后端分离系统

    千次阅读 2020-10-11 09:13:57
    一款 Java 语言基于 SpringBoot2.x、MybatisPlus、Vue、ElementUI、MySQL等框架精心打造的一款前后端分离框架,致力于实现模块化、组件化、可插拔的前后端分离架构敏捷开发框架,可用于快速搭建前后端分离后台管理...
  • java Web 前后端交互

    千次阅读 2020-10-26 21:15:00
    常用的代码语言有PHP,JSP,Java等。通过这些后台处理语言的算法来处理前台传回的数据。必要的时候进行操作数据库,然后把结果返回给前端网页。 第三层,是数据层,这个就是数据库,用来存储数据的。通过业务层的操作...
  • 前后端接口设计规范

    2021-03-24 21:20:07
    一、前后端接口设计规范 建议采用RESTful 方式来实施。 说明1:采用RestFul方式实施接口通用性强,异构性强。 说明2:对于使用如Dubbo这样的框架,限于java一种语言范围内,在Provider与Consumer两侧共享一个...
  • 前后端分离session
  • Docker部署前后端分离项目(超详细)个人总结

    万次阅读 多人点赞 2021-08-26 00:24:00
    包含前后端打包的环境,将项目放进去,包含git可以及时更新项目 # projcet_dockerfile FROM centos:7 MAINTAINER luoqianyi<3228077562@qq.com> RUN yum -y update \ #安装vim编辑器 && yum -y install vim \ #...
  • JavaWeb前后端分离项目搭建教程

    千次阅读 2021-01-21 17:58:30
    一款 Java 语言基于 SpringBoot2.x、MybatisPlus、Vue、ElementUI、MySQL等框架精心打造的一款前后端分离框架,致力于实现模块化、组件化、可插拔的前后端分离架构敏捷开发框架,可用于快速搭建前后端分离后台管理...
  • 基于SpringBoot实现的前后端分离项目

    千次阅读 2021-01-21 18:05:51
    一款 Java 语言基于 SpringBoot2.x、MybatisPlus、Vue、ElementUI、MySQL等框架精心打造的一款前后端分离框架,致力于实现模块化、组件化、可插拔的前后端分离架构敏捷开发框架,可用于快速搭建前后端分离后台管理...
  • 一款 Java 语言基于 SpringBoot2.x、MybatisPlus、Vue、ElementUI、MySQL等框架精心打造的一款前后端分离框架,致力于实现模块化、组件化、可插拔的前后端分离架构敏捷开发框架,可用于快速搭建前后端分离后台管理...
  • 一款 Java 语言基于 SpringBoot2.x、MybatisPlus、Vue、ElementUI、MySQL等框架精心打造的一款前后端分离框架,致力于实现模块化、组件化、可插拔的前后端分离架构敏捷开发框架,可用于快速搭建前后端分离后台管理...
  • 实现前后端数据交互的方法

    千次阅读 2021-07-02 14:53:21
    下文将罗列前端工程师应该必备的同后端打交道的常用技能: 1、服务端渲染  谈起服务端渲染,对于动态服务而言,这个世界上跑的大多数页面都经过服务端的数据渲染,接口->前端赋值->模板渲染。  这些都...
  • 今天这篇文章来分析一下什么是前后端分离的相关知识,很多小伙伴不清楚到底什么是前端,什么是后端,什么是前后端分离。在说前后端分离之前,我们先要弄清楚这几个概念,大家可能经常听到前端,后端或者是大前端的...
  • 一款 Java 语言基于 SpringCloud、Vue、ElementUI、MySQL等框架精心打造的一款前后端分离框架,致力于实现模块化、组件化、可插拔的前后端分离架构敏捷开发框架,可用于快速搭建前后端分离后台管理系统,本着简化...
  • 常用的编程语言介绍以及各语言的特点 编程语言(programming language),是用来定义计算机程序的形式语言。它是一种被标准化的交流技巧,用来向计算机发出指令。一种计算机语言让程序员能够准确地定义计算机所需要...
  • Ajax实现前后端交互

    千次阅读 2020-03-22 21:35:38
    这里的前后端交互主要以,前段ajax技术发送.php文件地址和.php文件建立连接;php接收前端发送的数据放在对应变量中,然后以mysql地址连接mysql做相应操作,接着把mysql改变后的数据返给ajax;ajax接收数据并通过js...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 38,318
精华内容 15,327
关键字:

常用前后端语言