前端学习_前端学习路线 - CSDN
精华内容
参与话题
  • 2020前端学习路线收集整理

    千次阅读 多人点赞 2020-04-21 17:50:45
    本人18年毕业,刚毕业自学Java,第一份工作因部门解散,时效半年,其实... 为了更好的规划自己的学习路线,我上过中国大学mooc,百度前端学院,github上搜集前端学习路线,报了北大青鸟的培训班,买了慕课网的前端就...

            本人18年毕业,刚毕业自学Java,第一份工作因部门解散,时效半年,其实那时我一直在想往前端发展,恰巧拿到下家offer,第二份工作确实是前端,不过是客户是银行,样式全部统一,与我想象的色彩缤纷的前端完全不符,时效3个半月。

            为了更好的规划自己的学习路线,我上过中国大学mooc,百度前端学院,github上搜集前端学习路线,报了北大青鸟的培训班,买了慕课网的前端就业班课程,也跟着陈皓大佬的程序员练级攻略进行学习,目前已经把基础HTML\CSS\Js学完了,培训机构中项目做的太浅,讲课太快,不专业,这里不多做赘述,下面是2020年最新的前端学习路线,希望大家不要因为英语而发怵,都是纸老虎,多搜索,勤动手。

    先上一个github上拿的前端学习路线图 

    通用技能

         英语好的同学看起来应该没什么问题,不懂的可以使用有道词典查一查。

    下面介绍百度前端学院的学习路线,百度前端学院的路线是从中国大学mooc看的。

    1、入门

    目标1:培养兴趣
    知识:HTML CSS JavaScript
    实践:个人主页 小时钟 计算器 小动画
    多去看看一些酷炫的前端效果,去尝试模仿

    目标2:系统地学习,打好基础
    知识:HTML CSS JavaScript
    实践:针对知识点的大强度练习
    方法:总结 重构 多问为什么

    2、尝试

    目标:能够完成小型复杂度网站
    实践:
    个人任务管理、 日期时间组件、 图片管理、 拖拽、 进度管理工具 、甘特图
    方法:复用 积累问题
    从百度前端学院中寻找合适的练习题目来进行练习

    3、主流

    目标:学习主流方案解决问题的思路
    知识:MVVM、 React、 Vue、 Redux、 SASS、 LESS、 PostCSS、 WebPack、 Rollup
    实践:不断重构
    方法:发展历史 场景问题 设计思想

    4、视野

    目标:广度认知
    知识:Node.js、WebAssembly、Mobile、Hybird、GO、Dust、 Flutter、WebGL、Canvas、SVG、Electron、TypeScript 、PWA
    方法:学会提炼核心思想

    5、进阶

    目标:具备中型复杂度开发经验
    实践:重构+新轮子
    方法:学会提炼核心思想

    6、专攻

    目标:对一个领域进行深度掌握、打磨自己的技术学习方法  

    极客时间-H5技能图谱&前端工程师必备技能

    接下来介绍慕课网的学习路线,个人觉得我的前端知识大都是从慕课网上学的,学习路线大家可以去官网查看,基础的知识总体学下来确实需要一定的耐心,知识点很多,要多加练习,在学到jQuery的时候就已经开始对线性渐变和径向渐变有点记不清了,要多加练习,死记硬背是无法驾驭前端的。

    当然还有比如说网络协议、浏览器工作原理、数据结构与算法也都是比较重要的、如果你对高等数学、线性代数、概率统计比较感兴趣的话也可以去学习学习,谢谢查阅 :)

    20200421添加: 在学到一个知识点的时候如果还是不求甚解一定要去MDN上看看。

    展开全文
  • 前端学习路线

    万次阅读 多人点赞 2015-11-04 10:56:43
    先附上一张网上广为流传的前端知识体系图:前端知识体系从大图中我们总结出: 优秀的Web前端开发工程师 要在知识体系上既要有 广度 和 深度!应该具备快速学习能力。 前端开发工程师 不仅要掌握基本的Web前端开发...

    先附上一张网上广为流传的前端知识体系图:前端知识体系

    从大图中我们总结出:

    优秀的Web前端开发工程师 要在知识体系上既要有 广度 和 深度!应该具备快速学习能力。

    前端开发工程师 不仅要掌握基本的Web前端开发技术,网站性能优化SEO服务器端的基础知识,而且要学会运用各种工具进行辅助开发以及理论层面的知识,包括代码的可维护性、组件的易用性分层语义模板浏览器分级支持等。

    前端工程师至少都要满足四类客户的需求:

      1、产品经理。这些是负责策划应用程序的一群人。他们会想出很多新鲜的、奇怪的、甚至是不可能实现的应用。一般来说,产品经理都追求丰富的功能。
      2、UI设计师。这些人负责应用程序的视觉设计和交互模拟。他们关心的是用户对什么敏感、交互的一贯性以及整体的好用性。一般来说,UI设计师侯倾向于流畅靓丽、但并不容易实现的用户界面,而且他们经常不满前端工程师造成
    1px 的误差。
      3、项目经理。这些人负责实际地运行和维护应用程序。项目管理的主要关注点,无外乎正常运行时间、应用程序始终正常可用的时间、性能和截止日期。项目经理追求的目标往往是尽量保持事情的简单化,以及不在升级更新时引入新问题。
      4、最终用户。指的是应用程序的主要消费者。尽管前端工程师不会经常与最终用户打交道,但他们的反馈意见至关重要。最终用户要求最多的就是对个人有用的功能,以及竞争性产品所具备的功能。

    好了,列举了这么多…… 你真的还想学前端么?不后悔吧? 如果真的做好了准备的话,哈哈,那我们就一起享受学习前端的乐趣吧!

    一、基础

    想成为前端开发者应该先打好基础:

    HTML > CSS > JavaScript > jQuery >。。。> GitHub

    不要担心以后会做什么决策,先好好深入学习。
    在增值的方向上投资自己,才是最明智的。

    学习了HTML、CSS就可以实现一些静态页面,不只是简单的静态页面,应该是稍微复杂一些绚丽一点的页面。

    推荐书籍:《CSS禅意花园》

    二、JS

    JS可以跟着以下几张思维导图学习(听说是一位名为“王子墨”的大师做的图):学习 Javascript 首先要知道这门语言可以做什么,不能做什么,擅长做什么,不擅长做什么!

    1.JS变量
    变量

    2.JS运算符
    运算符

    3.JS数组
    数组

    4.JS流程语句
    流程语句

    5.JS字符串函数
    字符串函数

    6.JS函数基础
    函数基础

    7.JS基础DOM操作
    基础DOM操作

    8.JS正则表达式
    正则表达式

    9.JS数据类型
    数据类型

    深入了解Javascript,需要了解 Javascript 的原理,机制;需要知道他们的本源;需要深刻了解 Javascript 基于对象的本质;还需要深刻了解浏览器宿主下 的 Javascript 的行为、特性。他也有很多缺点,各个宿主环境下的行为不统一、内存溢出问题、执行效率低下等问题,需要深入了解、学会处理这些缺陷。

    推荐书籍:

      初级:
      《JavaScript高级程序设计》
      《JavaScript王者归来》
      
      中级:
      《JavaScript权威指南》
      《JavaScript.The.Good.Parts》Douglas Crockford
      《高性能JavaScript》:Nicholas C. Zakas
      《Eloquent JavaScript》:
      
      高级:
      《JavaScript Patterns 》
      《Pro.JavaScript.Design.Patterns》讲解JavaScript设计模式
      《Developing JavaScript Web Applications》:构建富应用的好书,针对MVC模式有较为深入的讲解,同时也对一些流程的库进行了讲解。

    三、后端语言

    如果单纯只是学习前端编程语言、而不懂后端编程语言(Java、PHP、ASP.NET,JSP、Python),也不能算作是优秀的前端工程师。

    四、学习方法建议

    1.限制一次学习的量,并且不断地实践——实际编写代码。

    举个例子:就像学习数据结构一样,我有个同学A学习数据结构单纯的把书带到图书馆去看,我问A为什么不带电脑,A回答说光是看就已经看不懂了。能发现问题么?有时候我们可能看不懂代码,但是动手敲一遍可能会更认真的跟着代码的思路走一遍,在运行出来结果或者跟着调试的时候
    才会恍然大悟!喔喔!原来是这个样子的!同学A数据结构学了好几遍都没有学好,而另外一个同学B却对数据结构十分熟悉、笔试面试几乎难不倒他,他跟我分享学习经验的时候就告诉我,一定要动手敲!而且不止要敲一遍!

    ——这也是很多人会走弯路,而很多人只会走捷径的关键。

    2.用正确的心态去做练习,当成玩耍或者游戏。

    3.写代码的时间魔法,先告诉自己只写10分钟,然而就会陷进去乃至一下午。

    4.思考得更慢,学得更快。就像你在去理解别人的代码的时候一样,不要漏掉任何一行!

    5.首先用简明的语言来写复杂的代码。这是一种锻炼!

    6.定期定目标,每天都看看,想想,保持敏感、紧迫感、期待感。

    7.记笔记:

    • 学习过程中搜集的资源链接;
    • 遇到的未决的疑问;
    • 那些很宽而我们用的很窄的知识点;
    • 那些能进一步深入而我们浅尝辄止的知识点;
    • 某个功能可能存在的其它实现方案的蛛丝马迹

    还有些好书:

    • 《Developing Large Web Applications》:不仅有JavaScript方面的介绍,还有CSS、HTML方面的介绍,但是介绍的内容却都非常不错,真正考虑到了一个大型的Web程序下,如何进行JavaScript架构设计,值得一读。 
    • 《高性能网站建设指南》
    • 《Yahoo工程师的网站性能优化的建议》
    • 《网站重构》
    • 《Web开发敏捷之道》

      最好的资料就是某项技术的官方SDK,一般技术都有文档,API,Quick Start,Guide,Tutorial,Demo,Example……结合书看效果最好。

    其他:

    • “YSLOW”性能优化建议
    • “ jQuery 库”
    • “前端框架”
    • “HTML5”
    • “CSS3” 深入研究

    这儿还有不知道自己何时收藏的“前端有关的语言”:
    1
    2

    网站:

    前端大神
    A Single Div
    腾讯ISUX
    WEB开发者
    SegmentFault

    有经验的人,新学一门技术,就要努力放空自己,让自己归零,这样会比较容易学进去,坚持下来。坚持最重要!


    参考:
    更快学习JavaScript的6个思维技巧
    怎样新学一门技术
    如何成为优秀的前端工程师

    展开全文
  • 给你一份完整的Web前端学习路线图

    万次阅读 多人点赞 2019-04-12 21:31:57
    随着Web2.0思想的日益普及,...Web前端学习路线图,希望对初学者有帮助。 1.Javascript 语言 全栈开发中,用的编程语言就是 javascript 2.HTML5 标签和 DOM 这是前端最核心技术,为之后学习各种开发框架,打下...

    随着Web2.0思想的日益普及,让企业都慢慢认识到前端的重要性。前端开发人员的地位也日益提高,相应的技术要求要是越来越高,那么现在想成为一名合格的Web前端工程师应该怎样学习呢

    Web前端学习路线图,希望对初学者有帮助。

    1.Javascript 语言

    全栈开发中,用的编程语言就是 javascript

    2.HTML5 标签和 DOM

    这是前端最核心技术,为之后学习各种开发框架,打下坚实基础。

    3.CSS3

    学习通过 css 开发网页和各种可视 UI 组件。

    4.SASS

    利用 sass 语言,开发复杂的页面 css

    5.Node.js

    掌握Node.js 核心 API ,具备后端开发能力。

    6.Express 5.x 框架

    掌握 Express 框架,从而具备快速开发后端程序的能力。

    7.socket.io 库

    让前后端通过 websocket协议通信,是web 开发游戏、聊天等程序必备技术。

    8.Mongoose 框架

    可以让程序具备文档数据储存能力

    9.Git 命令与 github

    可以对项目进行版本管理,从而能团队开发项目。

    10.Gulp 构建工具实战

    通过 gulp 工具,灵活对项目进行构建。

    11.Webpack

    可以用和 Node.js 后端模块化方式,开发前端程序,从而能开发大型系统。

    12.Jasmine & Karma

    可以利用 Jasmine & Karma 轻松实现,多种浏览器同时进行单元测试,而不必切换界面。

    13.前端相关框架

    JQuery / Bootstrap / Vue.js /React / Angular通过框架帮我我们快速开发程序

    14.移动端与桌面程序开发工具

    phonegap / react-native / electron / 微信小程序开发

    这套工具,基本上只是打包工具,和提供了一些特定平台 API ,开发还是使用之前的 Web 技术。

    如果通过这套学习路线图学完,那么就业是毫无压力的,但是做为有志向的码奴,我们还需要展望未来和扩展眼界。

    一提到扩展眼界,有些人就会,疯狂的拿来一本永远不用技术的书,啃起来,比如你是用 html5 写前端界面的,永远用不上 QT 写界面,你买本QT 津津有味的学起来,如果你感觉不错,那就学吧。

    写在最后

    其实,很多想学习技术的同学都一方面是兴趣使然一方面是想找一份满意的工作,如果你学的技术对企业没有实际价值,那么也白瞎,(除非你是理论计算机学家),就目前在“互联网+”趋势的引导下,Web前端工程师的需求只会越来越大。

    展开全文
  • “工欲善其事,必先利其器”,学习WEB前端开发也是一样。 一、前端视频教程-51自学网 我要自学网是由佛山市丰智胜教育咨询服务有限公司倾力打造的在线实用技能学习平台。该平台成立于2007年6月7日,是一家专业...

    “工欲善其事,必先利其器”,学习WEB前端开发也是一样。

    一、前端视频教程-51自学网

    我要自学网是由佛山市丰智胜教育咨询服务有限公司倾力打造的在线实用技能学习平台。该平台成立于2007年6月7日,是一家专业从事软件视频教程开发的教育服务机构。开发团队由奋战在教学第一线的专业培训师组成,网站内的视频均采用职业培训授课资料,教学方法及进度,面向广大的电脑爱好者。

    51自学网-WEB前端开发教程

    二、前端图文教程-W3Cschool

    w3cschool.cn注册并建站于2009年8月,是国内较早以w3c标准为教程材料的的技术在线教程类网站之一,后来经过原站长多年经营,成为广为人知的w3cschool在线教程网站,2016年开始公司化运营。网站主要为初学者提供入门的学习内容和日常技术资料查询服务。提供了大量的在线实例,通过实例,您可以更好地学习如何建站。并且会根据当前互联网的变化实时更新内容。

    w3cschool官网首页截图

    三、前端APP-前端学院

    前端学院致力于前端方向在线教育。从琳琅满目的各类技术知识中为您精选出前端开发者所需的技术知识,包括html、html5、css、javascript、 JQuery、 Bootstrap等webweb前端开发知识。并从教程、文档、题库、微课程、编程实战等多方面引领用户学习。

    前端学院app

    四、前端笔记-QDfuns

    内容涵盖Web前端开发互动笔记、原创教程、资源分享、疑难解答、最新技术、招聘信息等,旨在为Web前端开发工程师及爱好者提供一个信息交流、经验分享、互帮互助的平台

    前端网主页

    五、前端社区-github

    GitHub有170万名软件开发人员的忠实用户,他们平均每天更新8万个并新建7千个软件库。对GitHub网站上托管的总计超过300万个软件库,其联合创始人Chris Wanstrath曾经形象地称其为"程序员的维基百科全书"。

    github

    以上就是小编为前端新手精心挑选的前端学习5大工具,你用过几个?还有更好的推荐欢迎和大家分享哈~

            “自己整理了一份最全面前端学习资料,从最基础的HTML+CSS+JS [炫酷特效,游戏,插件封装,设计模式]到移动端HTML5的项目实战的学习资料都有整理,送给每一位前端小伙伴, 有想学习web前端的,或是转行,或是大学生,还有工作中想提升自己能力的,正在学习的小伙伴欢迎加入学习。”

            加Q 裙:956940552(招募中)

    展开全文
  • 史上最全的前端学习路线

    万次阅读 多人点赞 2019-03-31 07:31:08
    许多同学们可能跟着培训机构的视频就入了前端这行的门,但大多数都只是机械的学习着资料中的内容。俗话说,选择要比努力重要。那么学习开发,首先应该要有一个清晰的学习路线。希望这篇文章,能为大家在选择未来的...
  • 前端学习

    2020-10-19 22:29:15
    前端学习1.安装前端开发工具2.安装插件 1.安装前端开发工具 1 下载vscode 链接 https://code.visualstudio.com/Download. 根据需求安装对应版本,可选择user installer 和system installer. 区别:user版会安装在...
  • 适合前端学习的几个网站

    千次阅读 2018-12-05 16:26:57
    推荐几个实用的前端网站 ** 网站 url 实验楼 https://www.shiyanlou.com/ 基于Vue 2.0 的桌面端组件库 http://element-cn.eleme.io/#/zh-CN/component/installation 菜鸟教程 https://www.runoob.com/ ...
  • web前端学习之路开始

    2019-06-25 21:49:58
    “对于程序员来说,如果哪一天开始他停止了学习,那么他的职业生涯便开始宣告消亡。”这不是什么危言耸听的怪语,而是一位大牛几年前告诉我的,他的信条。 五年过去了,我也从当年的小菜鸡摸爬滚打成了老油条,一直...
  • 前端学习什么

    2019-06-06 14:57:18
    web前端开发教程资源|前端开发者 提示:书籍很多,但很多内容都是重复的,新知识很少,所以你只要挑一本或几本吃透就可以了,其他的可以网上下载电子书看,都买也没必要,而且计算机书籍都很贵的,但是看到好的,...
  • web前端学习笔记(一)

    万次阅读 多人点赞 2018-08-27 10:56:01
    web前端的定义:是面向用户(浏览者)的互联网技术统称。主要包括Web界面的结构、Web界面的外观视觉表现以及Web界面的交互实现。 Web前端的分类:前端设计和前端架构。 HTML结构语言:超文本标记语言。 通过...
  • web前端零基础该怎么学习呢?

    万次阅读 多人点赞 2018-10-28 17:29:16
    由于前端开发的火热和一些IT巨头公司对 web前端开发人员的需求旺盛,让越来越多的人转入前端前端开发领域是IT技术语言领域唯一一个男女老少都可以快速入门并快速提升兴趣的领域,今天就来聊聊前端到底该怎么学~ ...
  • 送给大家一套完整的web前端开发学习路线

    万次阅读 多人点赞 2018-11-21 15:19:58
    web前端在IT行业真正受到重视的时间不超过五年,但是web前端的发展前景却是非常的可观,好前景高薪资吸引了众多的人投入到前端开发的学习当中去,想学好web前端,这份web前端开发学习路线分享给你。     好的...
  • 最近想学习一下Web前端知识,本着理论 + 实践的学习路径,找了一些学习资源和开源项目练一下手。 2、学习资源 菜鸟教程(里面有很多基础的教程和示例,通俗易懂,适合初学者) Web前端入门和进阶学习笔记 React ...
  • 本套课程是非常完整的Web前端学习课程,对与想学习Web前端的同学推荐学习本套课程! 下载地址:百度网盘 下载地址:百度网盘
  • 零基础学习web前端需要多久时间

    万次阅读 2018-09-07 12:14:31
    当下学习WEB前端技术是很不错的选择,不少人也渐渐认识到了WEB前端技术是非常有前景的,一些没基础的朋友,也想学好这门技术,但是又不知道零基础学完WEB前端要多久? 1:要想知道学这门技术的周期是多长, 那么就...
  • 前端学习必备单词词汇集

    万次阅读 2020-10-13 09:23:20
    前端单词词汇集: (收集不易,有帮助点个赞哦) 一、css style 修饰 width 宽度 height 高度 title 想说明的 text-align 水平对齐方式 center 居中 left 居左 right 居右 line-height 垂直对齐方式/...
  • 但是术业有专攻,学习前端的人只要把前端钻研到极致就可以了,为什么还要分散精力去学习后端知识呢?接下来我想以自身的一个项目经历,说明一下前端开发者学习一些后端的必要性。  当时我的情况是,前端学了一些...
  • 2018web前端学习路线与开发路线指导

    万次阅读 多人点赞 2018-03-09 11:16:23
    下面的地图是在互联网上广泛传播的前端学习地图。许多初学者说,当他们看到这些密集的知识点时会感到头晕目眩。事实上,前端是一个宽泛的主题。但你需要学习前端你不必惊慌,虽然内容比较多,但没有跟踪可循,只要...
  • WEB前端开发初学者必看的学习路线(附思维导图)

    万次阅读 多人点赞 2017-03-09 20:24:26
    看完网友高等游民白乌鸦无私分享的原标题为《写给同事的前端学习路线》这篇文章,相信你会有所收获。 前端开发入门学习有:HTML、CSS、JavaScript(简称JS)这三个部分。所以在学习之前我们需要先...
  • 前端招聘方面也在紧跟技术发展的节奏,相比前几年人才市场的繁华热闹,2017年的前端市场回归理性,企业提高了前端的门槛,大量“滥竽充数”的速成开发者开始失去市场,而优秀的前端在市场上的议价能力却越来越强。...
1 2 3 4 5 ... 20
收藏数 329,464
精华内容 131,785
关键字:

前端学习