给你一条学习路线,初学前端的话,需要先学习一下前端的三大基础知识,即HTML、CSS和JavaScript 。
1、HTML
HTML,超文本标记语言(英文:HyperText Markup Language,简称:HTML)是一种用于创建网页的标准标记语言。
你可以使用 HTML 来建立自己的 WEB 站点,HTML 运行在浏览器上,由浏览器来解析。
2、CSS
CSS,层叠样式表(英文:Cascading Style Sheets,简称:CSS)是一种用来表现HTML或XML等文件样式的计算机语言。
CSS样式表定义如何显示 HTML 元素,类似 HTML 中的字体标签和颜色属性所起的作用那样。样式保存在外部的 .css 文件中。我们只需要编辑一个简单的 CSS 文档就可以改变所有页面的布局和外观。
3、JavaScript
JavaScript 是互联网上最流行的脚本语言,这门语言不仅能用于 HTML 和 Web,还广泛用于服务器、PC端、笔记本电脑、平板电脑和智能手机等设备。
它是一种轻量级的编程语言,是可插入 HTML 页面的编程代码。当插入 HTML 页面后,会交由浏览器去执行。
同时,有需要可以了解一下HTML5和CSS3。
HTML5是HTML最新的修订版本,其设计目的是为了在移动设备上支持多媒体。
CSS3 是最新的 CSS 标准。
其次,需要学习Bootstrap和jQuery。
我目前是在职前端开发,如果你现在也想学习前端开发技术,在入门学习前端的过程当中有遇见任何关于学习方法,学习路线,学习效率等方面的问题,你都可以申请加入我的前端学习交流3000人裙:前面:851 中间:231 最后:348。里面聚集了一些正在自学前端的初学者裙文件里面也有我做前端技术这段时间整理的一些前端学习手册,前端面试题,前端开发工具,PDF文档书籍教程,需要的话都可以自行来获取下载。
4、Bootstrap
Bootstrap 是全球最受欢迎的前端组件库,用于开发响应式布局、移动设备优先的 WEB 项目。
Bootstrap4 目前是 Bootstrap 的最新版本,是一套用于 HTML、CSS 和 JS 开发的开源工具集。利用其提供的 Sass 变量和大量 mixin、响应式栅格系统、可扩展的预制组件、基于 jQuery 的强大的插件系统,能够快速为你的想法开发出原型或者构建整个 App 。
5、jQuery
jQuery是一个JavaScript函数库。也是一个轻量级的"写的少,做的多"的JavaScript库。除此之外,它还提供了大量的插件。
它的功能:HTML 元素选取、HTML 元素操作、CSS 操作、HTML 事件函数、JavaScript 特效和动画、HTML DOM 遍历和修改、AJAX等等。
最后,就是学习前端三大主流框架,分别是Vue.js、React和Angular(根据实际需要,选择一个学习即可)。
在学习这三大主流框架之前,需要先了解一下Node.js,因为学习这三个框架都会用到它。
6、Node.js
Node.js 就是运行在服务端的 JavaScript。它是一个基于Chrome JavaScript 运行时建立的一个平台。
它是一个事件驱动I/O服务端JavaScript环境,基于Google的V8引擎,V8引擎执行Javascript的速度非常快,性能非常好。
7、Vue.js
Vue.js是一套构建用户界面的渐进式框架。
它只关注视图层, 采用自底向上增量开发的设计。其目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。
8、React
React 是一个用于构建用户界面的 JavaScript 库。主要用于构建UI,很多人认为 React 是 MVC 中的 V(视图)。
React 拥有较高的性能,代码逻辑非常简单,越来越多的人已开始关注和使用它。
9、Angular
Angular 是一个 JavaScript 框架。
它可通过 <script> 标签添加到 HTML 页面中。通过指令扩展了 HTML,且通过表达式可以绑定数据到 HTML。
所以,综上所述,学前端最主要的、最重点的还是要学JavaScript。
在前端UI页面展示这块,如果你不想自己写页面,那就需要再学一些前端UI框架。
前端的UI框架有很多,我这里就推荐三个:
1、Layui
Layui是一个经典模块化前端框架,由职业前端倾情打造,面向全层次的前后端开发者,低门槛开箱即用的前端UI解决方案。
2、Element UI
Element UI,是一套为开发者、设计师和产品经理准备的桌面前端组件库。
支持基于React、Angular、Vue开发的框架。
3、Ant Design React
Ant Design React,也是一个优秀的组件库,用于研发企业中后台产品。
它的相关资源:Ant Design Pro、Ant Design Charts、Ant Design Vue、Ant Design React等(详见官方文档)
除此之外,前端的UI框架还有很多很多,比如Material UI也很不错。
除了要学习以上这些,我们在开发前端的过程中,还可能会用到图标、可视化图表等等,所以,还需要学一些相关的框架。
比如Feather、ECharts、Axios等等。
Feather 是一个开源的图标库;
ECharts 是一个使用 JavaScript 实现的开源可视化库,涵盖各行业图表,满足各种需求,还可以免费商用;
Axios 是一个易用、简洁且高效的 http 库。
都写到这了,干脆就再推荐一个前端开发工具吧,来自JetBrains公司的WebStorm。
最后,我简单总结一下:
前端技术的迭代更新是非常快的,所以千万不要想着去精通某个框架,除非实际开发需要的话;要学会通过浏览器去调试页面。
网友评论