前端学习:前端基本介绍

第一讲:前端基本介绍

学习前端内容,首先我们要知道什么是前端,或者说前端工程师需要做什么。
前端开发是什么?
首先前端开发是由网页制作发展过来的,如果很早就接触互联网不难发现以前网页的内容基本都是静态的(以图片文字为主,没有后台数据库、不含程序和不可交互的网页称为静态网页,比较突出的特点就是改变网页中内容状态,如删除某些内容后,再刷新页面并不会保留我们的操作内容,通俗点讲就是说他的内容是写“死”的,不去改代码是不会变的),静态网页最大的作用是供用户浏览。而随着互联网的发展,很明显只用来展示的网页满足不了我们的需求,用户需要更佳美观,交互效果显著,功能更多更全的网页,因此才进行了前后端的分离,有了现在的前端开发。
为什么要前后端分离
这里可能有人就在想,好端端的为什么要进行前后端分离,专门搞个前端开发,这不是增加了人力成本?其实不然,我们都知道,早期的程序开发是不分前后端的,程序员们既需要进行后端开发,又需要进行前端开发,造成代码各种耦合,服务器压力很大,而且服务器因为请求过多一旦出现问题,就会使得前后台一起崩,用户体验很差;另一方面,从开发上讲,因为前后端内容都在不断发展,客户的需求不断增加,要让程序员同时进行前端和后端开发,需要同时操作多种语言和标准,不仅容易出错,而且同时兼顾逻辑不同的前后台语言,很容易造成多而不精——页面达不到客户想要的’高大上‘效果,功能也极容易出现bug,性能优化也不好,最重要的,开发效率还极低。而进行前后端分离,举个形象的例子,就像使用了流水线工序,大大提高了效率和品质,就像流水线工序一样不仅不会增加人力成本,反而可以大大提高每个人的工作效益和价值。
为什么要进行前后端分离,总结来讲就是三点:
1、不分离时代码耦合严重,用户体验差;
2、不分离容易造成程序开发“多而不精”,”品质“低;
3、不分离开发周期长,效率很低,维护也极为不便;

前端开发应用了那些技术
前端开发的主要技术是指html、css、js技术和一些开发框架的使用。

前端发展经历阶段
我们前面说到,前端并不是一开始就存在的,最开始的编程开发前后端时不分离的,也没有所谓的前端开发,后来随着开发和应用的需求变化,进行了前后端分离,才有了现在的前端开发。整个前端发展过程,可以分为好几个阶段,因为本人也没有经历过前面几个阶段,最多只是在资料和整个学习过程中体验体会那一过程,所以也不完整详细介绍,毕竟很多都是看资料了解的。前端整个发展过程篇幅很多,个人感觉这篇文章把整个发展过程都叙述了,也不再过多介绍,
总结一下,一共经历了这么几个阶段:
1、静态页面:前后端开发是一体的,前端代码是后端代码的一部分:后端收到浏览器的请求 —> 发送静态页面 —> 发送到浏览器。采用后端 MVC 模式:
Model(模型层):提供/保存数据
Controller(控制层):数据处理,实现业务逻辑
View(视图层):展示数据,提供用户界面
前端只是后端 MVC 的 V;
代表技术:JSP、PHP
2、Web 2.0 时代:Web 2.0 时代:动态网页,富交互;1998 年前后Ajax(Asynchronous Java And XML:异步的 Java 和 XML)出现并逐渐大规模应用,从而促进了 Web 从 1.0 的静态网页,纯内容展示向 Web 2.0 模式迈进:前端不再是后端的模板,而是实现了从“获取数据 —> 处理数据 —>展示数据”的完整业务逻辑;
代表技术:Ajax、jQuery
3、前端 MVC 与SPA:前端 MVC 框架出现。另一些框架提出 MVVM 模式,用 View Model 代替 Controller。MVVM 模式也将前端应用分成三个部分:
Model:读写数据
View:展示数据
View-Model:数据处理
View Model 是简化的 Controller,所有的数据逻辑都放在这个部分。它的唯一作用就是为 View 提供处理好的数据,不含其他逻辑。特点是 View 绑定 View Model。如果 View Model 的数据变了,View(视图层)也跟着变了;反之亦然。
single-page application,单页面应用,指在一张网页(single-page)上,模拟出多页面应用程序(application)。用户的浏览器只需要将网页载入一次,然后所有操作都可以在这张页面上完成,带有迅速的响应和虚拟的页面切换。
代表技术:Angular、React、Vue
以上若有不正确的地方还望指正
关于前端学习
总体来讲,前端相关的技术更新十分迅速,需要不断的学习,之后也会写一写更多相关内容,自己写学习的内容,就像开始说的,是想分享一下自己的学习经历过程,希望能有所借鉴,大家共同成长。

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值