1. 前端开发主要学习那些技术以适应工作需求
一、前端是什么?
前端即网站前台部分,也叫前端开发,运行在PC端,移动端等浏览器上展现给用户浏览的网页。随着互联网技术的发展,HTML5,CSS3,前端框架的应用,跨平台响应式网页设计能够适应各种屏幕分辨率,完美的动效设计,给用户带来极高的用户体验。
核心技术是前端开发中最基本也是最必须的三个技能。前端的开发中,在页面的布局时, HTML将元素进行定义,CSS对展示的元素进行定位,再通过javaScript实现相应的效果和交互。虽然表面看起来很简单,但这里面需要掌握的东西绝对不会少。在进行开发前,需要对这些概念弄清楚、弄明白,这样在开发的过程中才会得心应手。
二、前端都需要学什么(可以分为八个阶段)?
1、第一阶段:
▪ HTML+CSS:
HTML进阶、 CSS进阶、p+CSS布局、HTML+CSS整站开发、
▪ JavaScript基础:
js基础教程、js内置对象常用方法、常见DOM树操作大全、ECMAscript、DOM、BOM、定时器和焦点图。
▪ JS基本特效:
常见特效、例如:tab、导航、整页滚动、轮播图、JS制作幻灯片、弹出层、手风琴菜单、瀑布流布局、滚动事件、滚差视图。
▪ JS高级特征:
正则表达式、排序算法、递归算法、闭包、函数节流、作用域链、基于距离运动框架、面向对象基础、
▪ JQuery:基础使用
悬着器、DOM操作、特效和动画、方法链、拖拽、变形、JQueryUI组件基本使用。
2、第二阶段:HTML5和移动Web开发
▪ HTML5:
HTML5新语义标签、HTML5表单、音频和视频、离线和本地存储、SVG、Web Socket、Canvas.
▪ CSS3:
CSS3新选择器、伪元素、脸色表示法、边框、阴影、flex布局、background系列属性改变、Transition、动画、景深和深透、3D效果制作、Velocity.js框架、元素进场、出场策略、炫酷CSS3网页制作。
▪ Bootstrap:
响应式概念、媒体查询、响应式网站制作、删格系统、删格系统原理、Bootstrap常用模板、LESS和SASS。
▪ 移动Web开发:
跨终端WEB和主流设备简介、视口、流式布局、弹性盒子、rem、移动终端JavaScript事件、手机中常见JS效果制作、手机聚划算页面、手机滚屏。
3、第三阶段:HTTP服务和AJAX编程
▪ WEB服务器基础:
服务器基础知识、Apache服务器和其他WEB服务器介绍、Apache服务器搭建、HTTP介绍。
▪ AJAX上篇:
Ajax简介和异步的概念、Ajax框架的封装、XMLHttpRequest对象详细介绍方法、兼容性处理方法、Ajax框架的封装、Ajax中缓存问题、XML介绍和使用、会处理简单的GET或者POST请求、
▪ AJAX下篇:
JSON和JSON解析、数据绑定和模板技术、JSONP、跨域技术、图片预读取和lazy-load技术、JQuery框架中的AjaxAPI、使用Ajax实现爆布流案例额。
4、第四阶段:面向对象进阶
▪ 面向对象终极篇:
从内存角度到理解JS面向对象、基本类型、复杂类型、原型链、ES6中的面向对象、ES6中变量的作用域(let ,const(声明变量只读),块级作用域),ES6中函数新特性。
▪ 面向对象三大特征:
继承性、多态性、封装性。
▪ 面向对象中创建对象的五种方法:
自定义对象 、工厂模式创建对象、构造函数、 混合模式创造对象、JSO格式创建对象。
5、第五阶段:封装一个属于自己的框架
▪ 框架封装基础:
事件流、冒泡、捕获、事件对象、事件框架、选择框架。
▪ 框架封装中级:
运动原理、单物体运动框架、多物体运动框架、运动框架面向对象封装。
▪ 框架封装高级和补充:
JQuery框架雏形、可扩展性、模块化、封装属于传智自己的框架。
6、第六阶段:模块化组件开发
▪ 面向组件编程:
面向组件编程的方式、面向组件编程的实现原理、面向组件编程实战、基于组件化思想开发网站应用程序。
▪ 面向模块编程:
AMD设计规范、CMD设计规范、RequireJS,LoadJS、淘宝的SeaJS。
7、第七阶段:主流的流行框架
▪ Web开发工作流:
GIT/SVN、Vue-cli脚手架、NPM/Bower依赖管理工具、Grunt/Gulp/Webpack。
▪ 前端主流框架:
Vue.js、Angular.js、React.JS、Bootstrap。
▪ 常用库:
React.js、Vue.js、JQuery.js。
8、第八阶段:Node.js全栈开发:
▪ 快速入门:
Node.js发展、生态圈、Io.js、Linux/Windows/OS X环境配置、REPL环境和控制台程序、异步编程,非阻塞I/O、模块概念,模块管理工具、开发流程,调试,测试。
▪ 核心模块和对象:
全局对象global,process,console,util、事件驱动,事件发射器、加密解密,路径操作,序列化和反序列化、文件流操作、HTTP服务端与客户端、Socket.IO。
▪ Web开发基础:
HTTP协议,请求响应处理过程、关系型数据库操作和数据访问、非关系型数据库操作和数据访问、原生的Node.js开发Web应用程序、Web开发工作流、Node.js开发Blog案例。
▪ 快速开发框架:
Express简介+MVC简介、Express常用API、Express路由模块、Jade/Ejs模板引擎、使用Express重构Blog案例、Koa等其他常见MVC框架。
▪ Node.js开发电子商务实战:
需求与设计、账户模块注册登录、会员中心模块、前台展示模块、购物车,订单结算、在线客服即时通讯模块。
2. 网页前端常用的库或框架有哪些
bootstrap是twitter出的一款不错的UI框架,或者与其说是框架不如说是类库(lib),当然这里边牵扯到一个“究竟什么是框架什么是类库?”的问题,我们暂时不谈。毕竟是有大公司背景的代码堆,我觉得没什么“落伍”可言。
angular是前两年之内突然火得一塌糊涂的一个fe框架,这个我觉得可以算的上是真正意义上的框架了,MVVM双向绑定,包括它拥有足够完善的社区、生态,甚至chrome上都有很多好用的相关插件(这一点可以说是占了google出品的光),比较完整的大型项目都是可以考虑引入的。但如果你的网站只是做一些轻量级的东西,杀鸡焉用宰牛刀吧我觉得。
backbone主要针对的MVC中的M层,至少我是这么理解的。对UI层它几乎没什么太多的限制,一方面给出了coder自由度进行发挥,另一方面也等于在这方面框架本身对开发没提供什么太大的帮助。我觉得这更像是一个高手向的框架,另外对于underscore前端模板那一套东西,说实话作为一名php java啥都能写的FE我始终觉得这套东西有那么一种纯JS工程师的一厢情愿的意味。这是个人看法了,不一定准确,况且有人会搬出ajax动态渲染时 前端模板的作用来反驳我,别急着反驳,至少往下看完我说的话。
相比之下,react可以说是一个在MVC中V层做的十分出色和新颖的框架了,独特的jsx编译机制就已经让你的代码变得高大上了,我是觉得这个类库在UI层做的更彻底更专业,或者说让FE的代码更专业了。更何况,react比angular更年轻,而且同样拥有大公司背景,react native一出更是让JS工程师的地位取得了革命性的提升,(不要跟我提phonegap,用过两个东西后你会明白,react打包的app性能甩phonegap几条街没问题)。另外既然楼主提到了之前的网站是bootstrap,不妨可以看一看react-bootstrap这个东西,或许这就是你想要的。
3. 有什么js库可以提供交互绘图时可以自动吸附闭合,时时检测是否垂直是否平行,时时显示角度,长度的
常用的js绘图库有:
D3.js:一个功能强大的数据可视化库,支持吸附闭合等功能。
Raphael.js:一个轻量级的交互绘图库,支持实时显示角度和长度。
Fabric.js:一个强大的交互绘图库,支持实时检测垂直和平行等功能。
p5.js:一个用于创作艺术和交互作品的库,可以实现吸附闭合等功能。
4. jQuery和js类库有什么区别现在比较常用的js类库是什么一般什么系统用
jQuery是js的一个框架,每一种js框架也可以看成是js的类库,每种类库也可以看成一种框架,都是封装一些功能,方便用户使用。
5. 怎样使用微信小程序的第三方js库
方法一:rpn.js:使用rpn.js实现eval函数功能
操作链接:网页链接
方法二:
(1)使用Underscore.js:操作链接:网页链接
(2)使用Immutable.js:操作链接:网页链接
(3)使用UUID、Base64、Chance:操作链接:网页链接
扩展微信小程序框架功能(1)——Promise
ES6 对 Promise 有了原生的支持,但微信开发者工具更新版本(0.11.112200)后, 移除了开发者工具对 ES6 中Promise 特性原生的支持, 需要引入第三方的 Promise 库。
扩展微信小程序框架功能(2)——Generator
Generator函数是ES6提供的一种异步编程解决方案,语法行为与传统函数完全不同。
扩展微信小程序框架功能(3)——函数功能增强
Underscore.js 和 Lodash 是最常用的JavaScript库。
扩展微信小程序框架功能(4)——Immutable.js
Immutable.js 是 Facebook 开发的不可变数据集合。Immutable
Data(不可变数据)一旦创建就不能被修改。通过使用Immutable
Data,可以更容易的处理缓存、回退、数据变化检测等问题,应用开发更简单。
扩展微信小程序框架功能(5)——Rex
Rex 是 JavaScript 状态容器,提供可预测化的状态管理。
扩展微信小程序框架功能(6)—日期时间
Moment.js是一个JavaScript的日期、时间处理工具类,其对于JavaScript的日期时间处理功能非常强悍和全面。可以用在浏览器环境中使用,也可以在Node.js中。
扩展微信小程序框架功能(7)——正则表达式
XRegExp 是一个开源的 JavaScript库,提供一个参数化、可扩展的支持各种浏览器的正则表达式的实现库,支持附加语法、标志以及方法。
扩展微信小程序框架功能(8)——Xml处理
x2js是一个 实现 XML 与 JavaScript 对象之间相互转换的工具库。
扩展微信小程序框架功能(9)——加解密
node-uuid可以快速地生成符合规范 的 UUID。js-base64可以实现Base64编码和解码。crypto-js可以非常方便地在 JavaScript 进行加解密。
扩展微信小程序框架功能(10)——测试辅助
Chance是一个 JavaScript 随机数生成工具。Mock.js可以生成随机数据,拦截 Ajax 请求。
方法三:moment
操作链接:网页链接
6. js除了有JQuery框架以外,还有哪些强大点的框架,或者比较实用的也可以。。 谁能给我介绍一下
目前来看,JS框架以及一些开发包和库类有如下几个,Dojo 、Scriptaculous 、Prototype 、yui-ext 、Jquery 、Mochikit、mootools 、moo.fx
Dojo (JS library and UI component ):
Dojo是目前最为强大的j s框架,它在自己的Wiki上给自己下了一个定义,dojo是一个用JavaScript编写的开源的DHTML工具箱。dojo很想做一个“大一统”的 工具箱,不仅仅是浏览器层面的,野心还是很大的。Dojo包括ajax, browser, event, widget等跨浏览器API,包括了JS本身的语言扩展,以及各个方面的工具类库,和比较完善的UI组件库,也被广泛 应用在很多项目中,他的UI组件的特点是通过给html标签增加tag的方式进行扩展,而不是通过写JS来生成,dojo的API模仿Java类库的组织 方式。 用dojo写Web OS可谓非常方便。dojo现在已经4.0了,dojo强大的地方在于界面和特效的封装,可以让开发者快速构建一些兼容标准的界面。
优点:库相当完善,发展时间也比较长,功能强大,据说利用dojo的io.bind()可以实现comet,看见其功能强大非一般,得到IBM和SUN的支持
缺点:文件体积比较大,200多KB,初次下载相当慢,此外,dojo的类库使用显得不是那么易用,j s语法增强方面不如prototype。
Prototype (JS OO library):
是一个非常优雅的JS库,定义了JS的面向对象扩展,DOM操作API,事件等等,以prototype为核心,形成了一个外围的各种各样 的JS扩展库,是相当有前途的JS底层框架,值得推荐,感觉也是现实中应用最广的库类(RoR集成的AJAX JS库),之上还有 Scriptaculous 实现一些JS组件功能和效果。
优点:基本底层,易学易用,甚至是其他一些js特效开发包的底层,体积算是最小的了。
缺点:如果说缺点,可能就是功能是他的弱项
Scriptaculous (JS UI component based on prototype):
Scriptaculous是基于prototype.js框架的JS效果。包含了6个js文件,不同的文件对应不同的js效果,所以说,如果底层用 prototype的话,做js效果用Scriptaculous那是再合适不过的了,连大名鼎鼎的digg都在用他,可见不一般
优点:基于prototype是最大的优点,由于使用prototype的广泛性,无疑对用户书锦上添花,并且在《ajax in action》中就拿Scriptaculous来讲述js效果
缺点:刚刚兴起,需要时间的磨练
yui-ext (JS UI component):
基于Yahoo UI的扩展包yui-ext是具有CS风格的Web用户界面组件 能实现复杂的Layout布局,界面效果可以和backbase媲美,而且使用纯javascript代码开发。真正的可编辑的表格Edit Grid,支持XML和Json数据类型,直接可以迁入grid。许多组件实现了对数据源的支持,例如动态的布局,可编辑的表格控件,动态加载的Tree 控件、动态拖拽效果等等。1.0 beta版开始同Jquery合作,推出基于jQuery的Ext 1.0,提供了更多有趣的功能。
优点:结构化,类似于java的结构,清晰明了,底层用到了Jquery的一些函数,使整合使用有了选择,最重要的一点是界面太让让人震撼了。
缺点:太过复杂,整个界面的构造过于复杂。
Jquery :
jQuery是一款同prototype一样优秀js开发库类,特别是对css和XPath的支持,使我们写js变得更加方便!如果你不是个js高手又想写出优 秀的js效果,jQuery可以帮你达到目的!并且简介的语法和高的效率一直是jQuery追求的目标,
优点:注重简介和高效,js效果有yui-ext的选择,因为yui-ext 重用了很多jQuery的函数
缺点:据说太嫩,历史不悠久。
Mochikit :
MochiKit自称为一个轻量级的js框架。MochiKit 主要受到 Python 和 Python 标准库提供的很多便利之处的启发,另外还缓解了浏览器版本之间的不一致性。其中的 MochiKit.DOM 尤其方便,能够以比原始 JavaScript 更友好的方式处理 DOM 对象。MochiKit.DOM 大部分都是针对 XHTML 文档定制的,如果与 MochiKit 和 Ajax 结合在一起,使用 XHTML 包装的微格式尤其方便。Mochikit可以直接对字符串或者数字格式化输出,比较实用和方便。它还有自己的 js 代码解释器
优点:MochiKit.DOM这部分很实用,简介也是很突出的
缺点:轻量级的缺点
mootools :
MooTools是一个简洁,模块化,面向对象的JavaScript框架。它能够帮助你更快,更简单地编写可扩展和兼容性强的JavaScript代码。Mootools跟prototypejs相类似,语法几乎一样。但它提供的功能要比prototypejs多,而且更强大。比如增加了动画特效、拖放操作等等。
优点:可以定制自己所需要的功能,可以说是prototypejs的增强版。
缺点:不大不小,具体应用具体分析
moo.fx :
moo.fx是一个超级轻量级的javascript特效库(7k),能够与prototype.js或mootools框架一起使用。它非常快、易于使用、跨浏览器、符合标准,提供控制和修改任何HTML元素的CSS属性,包括颜色。它内置检查器能够防止用户通过多次或疯狂点击来破坏效果。moo.fx整体采用模块化设计,所以可以在它的基础上开发你需要的任何特效。
优点:小块头有大能耐
缺点:这么小了,已经不错了