1.什么是前端?
所谓前端即web前端,其实存在于我们生活的每个角落,和我们的生活息息相关,手机中的app应用,电脑浏览的网站,我们的微信,QQ等等,其中都有前端的影子,可是前端在其中具体扮演什么角色呢?
其实就是写网页,app的。
2.前端技术一般分为前端设计和前端开发
前端设计一般可以理解为网站的视觉设计,前端开发则是网站的前台代码实现,包括基本的HTML和CSS以及JavaScript/ajax,现在最新的高级版本HTML5、CSS3,以及SVG等。
但是
那那,圈起来,敲黑板,这是重点,要考的。
HTML,CSS,Javascript
这三个是前端开发中最基本也是最必须的三个技能。前端的开发中,在页面的布局时, HTML将元素进行定义,CSS对展示的元素进行定位,再通过JavaScript实现相应的效果和交互。
HTML
指的是超文本标记语言 (Hyper Text Markup Language),这个也是我们网页最常用普通的语言了,经历了多个版本的发展,已经发展到5.0版了,得力于W3C建立的标准和规范,已普遍升级到了XHTML,XHTML 指可扩展超文本标签语言(EXtensible HyperText Markup Language), XHTML 于2000年的1月26日成为 W3C 标准,是更严格更纯净的 HTML 代码,XHTML 的目标是取代 HTML。XHTML 与 HTML 4.01 几乎是相同的,XHTML 是作为一种 XML 应用被重新定义的 HTML,是一个 W3C 标准。W3C 将 XHTML 定义为最新的HTML版本。所有新的浏览器都支持 XHTML
CSS
级联样式表(Cascading Style Sheet)简称“CSS”,通常又称为“风格样式表(Style Sheet)”,它是用来进行网页风格设计的。比如,如果想让链接字未点击时是蓝色的,当鼠标移上去后字变成红色的且有下划线,这就是一种风格。通过设立样式表,可以统一地控制HTML中各标志的显示属性。级联样式表可以使人更能有效地控制网页外观。使用级联样式表,可以扩充精确指定网页元素位置,外观以及创建特殊效果的能力
javascript
是一种由Netscape的LiveScript发展而来的原型化继承的面向对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如Perl,遗留的速度问题,为客户提供更流畅的浏览效果。当时服务端需要对数据进行验证,由于网络速度相当缓慢,只有28.8kbps,验证步骤浪费的时间太多。于是Netscape的浏览器Navigator加入了Javascript,提供了数据验证的基本功能。
看我的笑容你就该懂了,前端不像后端,有多种的语言,像java,c,c++,c#,python等等等等。。只有一个js(javascript)啊喂,是不是说前端只会html,css,js就可以了呢?对!!没错!!
但是
还有一点点小扩展,也就是一些这个库,那个框架。。。此处列举一小小部分
一:js库
1:jQuery
jQuery 是一个 JavaScript 库,极大地简化了 JavaScript 编程,jQuery 很容易学习。
2:Node.js
Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。
Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型,使其轻量又高效。
二:图表库
1:chart.js
为设计人员和开发人员提供简单而灵活的JavaScript图表
2:Highcharts
兼容 IE6+、完美支持移动端、图表类型丰富、方便快捷的 HTML5 交互性图表库
3:Echars
一个使用 JavaScript 实现的开源可视化库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Firefox,Safari等),底层依赖轻量级的矢量图形库 ZRender,提供直观,交互丰富,可高度个性化定制的数据可视化图表。ps:业界大佬百度出品
4:AntV
AntV 是蚂蚁金服全新一代数据可视化解决方案,致力于提供一套简单方便、专业可靠、不限可能的数据可视化最佳实践。ps:业界大佬阿里出品
三:UI库
1:H-UI
轻量级前端框架,简单免费,兼容性好
2:Layui
Layui(谐音:类UI) 是一款采用自身模块规范编写的前端 UI 框架,遵循原生 HTML/CSS/JS 的书写与组织形式,门槛极低,拿来即用
3:bootscript
简洁、直观、强悍的前端开发框架,让web开发更迅速、简单。ps:用的那是相当的多
4:Element
Element,一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的桌面端组件库
ps:还有很多UI库,,我就不一一列举了
四:前端框架
真·重点 ps:此处暂时列举市场主流的三大框架,后续会继续补充
1:Angular
Angular 是一个开发平台。它能帮你更轻松的构建 Web 应用。Angular 集声明式模板、依赖注入、端到端工具和一些最佳实践于一身,为你解决开发方面的各种挑战。Angular 为开发者提升构建 Web、手机或桌面应用的能力。
ps:Angular从2.0版本已经全面使用 Typescript
TypeScript是一种由微软开发的自由和开源的编程语言。
它是JavaScript的一个超集而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程
2:React
React是一个用于构建用户界面的 JAVASCRIPT 库。
React的特点:
1.声明式设计 −React采用声明范式,可以轻松描述应用。
2.高效 −React通过对DOM的模拟,最大限度地减少与DOM的交互。
3.灵活 −React可以与已知的库或框架很好地配合。
4.JSX − JSX 是 JavaScript 语法的扩展。React 开发不一定使用 JSX ,但我们建议使用它。
5.组件 − 通过 React 构建组件,使得代码更加容易得到复用,能够很好的应用在大项目的开发中。
6.单向响应的数据流 − React 实现了单向响应的数据流,从而减少了重复代码。
3:Vue
Vue.js是一个构建数据驱动的 web 界面的渐进式框架。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。核心是一个响应的数据绑定系统。
Vue的特性如下:
1.轻量级的框架
2.双向数据绑定
3.指令
4.插件化
一点也不少啊喂。。
其实,前端就是点,线,面,体
点:html标签、css属性、js语法
线:由HTML+css+js 开发的组件、模块
面:由组件组合起来的页面
体:由多个页面组合起来的网站系统