前端学习及技术汇总

最新推荐文章于 2025-05-28 17:43:36 发布

六六和May宝

最新推荐文章于 2025-05-28 17:43:36 发布

阅读量308

点赞数

CC 4.0 BY-SA版权

分类专栏：前端

本文链接：https://blog.youkuaiyun.com/weixin_43683536/article/details/89054873

前端专栏收录该内容

1 篇文章

订阅专栏

前端技术学习顺序

当你准备学习前端的时候，你需要先学习 HTML，理解如何浏览和创建网页，基本的语法规范，网页之间的链接与跳转，标签节点层级节点。然后就学习CSS，了解基本语法，盒子模型的高级用法，常用布局模型。然后就要学习javaScript技术入门，学会使用基础语法，数据类型转换，分支循环，函数和数组等内置对象。
当你学完上面的技术时，你已经做好了准备工作，接下来你需要去学习DOM+BOM，学习节对象的操作、时间特性及使用，知道常见的内置DOM对象，常见的BOM功能。

路线图

技术说明

HTML
- 字体预排版标签
  p、br、hr、center、div…
  b、i、u、h1-h6、font…
- 列表与表格标签
  ol-li、ul-li、dl-dt-dd…
  table、tr、td、th…
- 图形与连接标签
  img、a、base…
- 表单元素标签
  form、input、button、textarea、select、option…
CSS层叠样式表
- 文本与字体样式
- 背景与尺寸样式
- 布局与定位
- 盒子模型
JavaScript
- ECMAScript
  - 基础语法、变量、数据类型、运算符、流程控制、函数…
  - Array 、 Date 、 Math、 Boolean 、Number、 String、 RegExp…
- DOM(Document Object Model)
  - Document对象
  - Element对象
  - Attributes对象
  - Events对象
- BOM(Browser Object Model)
  - Window对象
  - Navigator对象
  - Screen对象
  - History对象
  - Location对象
jQuery javaScript函数
- 特性
  - HTML元素选取
  - HTML元素操作
  - CSS操作
  - HTML时间函数
  - javaScript特效和动画
  - HTML DOM遍历和修改
  - AJAX
  - Utilities
Bootstrap
* Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的。Bootstrap 的响应式 CSS 能够自适应于台式机、平板电脑和手机。
* 基本结构：Bootstrap 提供了一个带有网格系统、链接样式、背景的基本结构。
* CSS: Bootstrap 自带以下特性：全局的 CSS 设置、定义基本的 HTML 元素样式、可扩展的 class，以及一个先进的网格系统。
* 组件：bootstrap 包含了十几个可重用的组件，用于创建图像、下拉菜单、导航、警告框、弹出框等等。
* javaScript插件：Bootstrap 包含了十几个自定义的 jQuery 插件。您可以直接包含所有的插件，也可以逐个包含这些插件。
* 定制：您可以定制 Bootstrap 的组件、LESS 变量和 jQuery 插件来得到您自己的版本。
ECharts
- ECharts，一个使用 JavaScript 实现的开源可视化库，可以流畅的运行在 PC 和移动设备上，兼容当前绝大部分浏览器（IE8/9/10/11，Chrome，Firefox，Safari等），底层依赖轻量级的矢量图形库 ZRender，提供直观，交互丰富，可高度个性化定制的数据可视化图表。
- 丰富的可视化类型
  ECharts 提供了常规的折线图、柱状图、散点图、饼图、K线图，用于统计的盒形图，用于地理数据可视化的地图、热力图、线图，用于关系数据可视化的关系图、treemap、旭日图，多维数据可视化的平行坐标，还有用于 BI 的漏斗图，仪表盘，并且支持图与图之间的混搭。除了已经内置的包含了丰富功能的图表，ECharts 还提供了自定义系列，只需要传入一个renderItem函数，就可以从数据映射到任何你想要的图形，更棒的是这些都还能和已有的交互组件结合使用而不需要操心其它事情。你可以在下载界面下载包含所有图表的构建文件，如果只是需要其中一两个图表，又嫌包含所有图表的构建文件太大，也可以在在线构建中选择需要的图表类型后自定义构建。
- 多种数据格式化无需转换直接使用
- 千万数据前端展现
- 移动端优化
- 跨平台使用
- 深度交互式数据探索
- 多维数据的支持以及丰富的视觉编码
- 动态数据
- 绚丽特效
- 通过GL实现三维可视化
- 无障碍访问
Tree.JS
- three.js是JavaScript编写的WebGL第三方库。Three.js 是一款运行在浏览器中的 3D 引擎，你可以用它创建各种三维场景，包括了摄影机、光影、材质等各种对象。
Node.js
- 简单的说 Node.js 就是运行在服务端的 JavaScript。
- 基于Chrome JavaScript 运行时建立的一个平台。
- Node.js是一个事件驱动I/O服务端JavaScript环境，基于Google的V8引擎，V8引擎执行Javascript的速度非常快，性能非常好。
Vue.js
- 一套构建用户界面的渐进式框架。
- 只关注视图层，采用自底向上增量开发的设计。
- 目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。