• 米斯特菠萝
    2019-01-17
    问题一提出来不知道怎么回答,看评论区才反应过来,我的认识中前端就是html负责骨架,css负责外表和js负责行为
    
     123
  • 新哥
    2019-01-17
    前端不是切页面的吗?
     2
     67
  • CC
    2019-01-17
    在阅读这篇文章之前,我对于前端知识结构的划分是基于「语言」:

    前端 = HTML + CSS + JavaScript

    每种语言下,又混杂了基础知识以及相关的工具。

    比如我之前认为的 JavaScript 包括:
    * JavaScript 基础
    * Package Manager (NPM, Yarn)
    * Build tools (NPM Scripts, ESLint, Webpack...)
    * Frameworks (React, Vue.js, Angular)
    * Testing tools (Jest ...)

    现在知道自己的认识有两个误区:

    1. 这个知识架构没有完备性,这样划分,总有在这个结构之外的知识;

    2. 学习的时候会疲于奔命,总想“完整”的学完所有的知识,却走了弯路。

    感谢 winter 老师。
    展开

    作者回复: 我觉得你不妨思考下,如果我要讲Package Manager、Build tools,你猜我会放到哪个部分?

     1
     55
  • 周群华
    2019-01-17
    建议正式开始的时候能够图文并茂 而不只是纯粹的文字 还有音频和看文字区别不大
     1
     53
  • 芳玥
    2019-01-17
    我所认为的前端的话,基础系列html+css+js,进阶一点就css3+js高级应用+前端框架+构建工具。工作快近2年,最近觉得焦虑。是自己太水,看看面试要求,反省自己,一看只会基础的但又不精。现在跟着课程体系,想建立好自己的知识体系,把握19年,不至于荒废时光。
    
     41
  • YUANWOW
    2019-01-17
    大家都觉得HTML容易,非常简单
    就算不会,坐下来花一天时间看看MDN几乎都能写出来了
    我们都知道写HTML要语义化,但是HTML5的语义我感觉非常复杂
    有多少人能保证写出来的网页完完全全遵循了正确的语义?
    能达到屏幕阅读器理解的程度?
    我们想写语义正确的网页,但是也不想被语义复杂性所拖累(本来读的也不是文科,div一分钟能写出来的东西在语义上要纠结好久)
    程老师,我的问题是,作为一名前端工程师,平常工作的时候写HTML究竟要语义化到哪种程度呢?
    展开

    作者回复: 这是个好问题,在语义化部分我有讲这个问题,很快你就能看到了。

     1
     38
  • jviLee
    2019-01-17
    粗鄙认为前端知识架构可以分为渲染层和网络层两方面,不论前端如何发展变化,比如react,vue,ng,还是flutter,小程序等等,本质上脱离不了这两方面,另外前端工程师在接触一个新语言或新框架,最难不是学习语言本身(官方文档可以解决),反而棘手的是如何去工程化(更好组织代码,打包工程)和去优化,这是做前端两年的感受

    作者回复: 渲染层和网络层这个分法听起来是有一定思考了,不过可以再想想,是不是还有别的层?

    另外就是,如何定义渲染层呢?

    
     29
  • nbili
    2019-01-17
    如果让自己描述前端的知识结构,大致会按照下面这个roadmap来。

    https://github.com/kamranahmedse/developer-roadmap/blob/master/readme.md

    winter老师第一种建立知识架构的方式,更像是做了进一步抽象。

    作者回复: 要自己整理才行哦。

    
     22
  • 把那个产品经理祭天
    2019-01-17
    对于科班出身的学技术都是这一套思路吧!
    感觉 winter 叔这篇主要是站在非科班出身或半路出家的前端从业者的角度来看的,确实我刚开始接触前端这一陌生领域来说就是这样,没有知识体系,都是知识点拼接的一张记忆网络,很多点觉得不可思议,难以记忆。实际是上不了解本质,不了解来龙去脉,所以很多知识在脑海中就不够形象。
    期待接下来 winter 的思路!
    
     21
  • reece
    2019-01-17
    1.1,代码打包,如何打包代码发送到服务器。
    1.1.1,资源加载
    1.1.2,webpack打包
    1.1.3,摇树优化

    1.2,网络传输,因为传统上是浏览器发起页面请求,然后服务器端发送html页面。
    1.2.1,资源加载
    1.2.2,首屏页面加载优化

    1.3,浏览器端的页面渲染。
    1.3.1,浏览器如何渲染一张html页面
    1.3.2,渲染性能优化

    1.4代码编写
    1.4.1,html页面架构
    1.4.1.1 .....
    ...
    1.4.2,css页面样式
    1.4.2.1, ......
    .....
    1.4.3,js交互
    1.4.3.1,.....
    .....
    展开

    作者回复: 不错,比较认真了,但是你有没考虑过除了打包、传输还有什么?它们跟代码编写是一个维度的概念吗?

    
     19
  • Jake
    2019-02-14
    首先特别认同大佬现在的图形化学习的重要性,比如谷歌出的flutter,flutter的野心在于他想统一所有端的开发模式,他的核心思想就是抛开一切html, css, js,xml等的束缚(flutter也在计划支持web端了),用户界面即画布,用户想要得到的视觉,画给用户就可以了,而现在无论是web端还是ios,安卓其实都只是图形学的其中一个分支,想要彻底攻克其本质,其实对于底层语言的学习,学习计算机绘图原理可能是大前端的终极的学习目标。
       前端发展到现在,无论是jquery时代,还是现在三大框架,还是说vue in all的时代,归根结底这些工具的产生都是为了解决工作效率等问题。结合现在互联网行业的发展来看,后期的前端生存之道可能更多的是思考如何把前端当成一个应用来做,不仅仅局限于网页。而应用可能要思考的是易用性,可扩展性,可维护性,甚至可移植性,那么这一切都需要夯实的基础来支撑。
     
    
     14
  • Destroy、
    2019-01-17
    说实在,我现在知识体系都是乱的。都是东看一点西看一点拼凑起来的。
    
     13
  • _1024
    2019-02-13
    17年大学毕业之后开始接触前端,刚接触的时候觉得JavaScript特别简单,容易上手,但用了半年之后,发现不行了,就像 winter 老师所说的,经常会有“XX,还有这种用法”的感叹,于是,在 18 年,我自己把 JavaScript 的基础恶补了一遍,于是把一些概念开始聚合起来,有了一些比较清晰的脉络,学习的主要内容也是阮一峰老师的一些教程,在去年一年,也形成了自己的知识体系,有了一些落地的笔记,当然也还需要很多时间去修补
    https://docs.itellboy.wang/es5/
    共勉
    
     12
  • 棚头傀儡
    2019-01-17
    我是黑马出身,emmm我的知识体系是初级前端要会哪些,中级要会哪些,又比如原型链和this之类的是中级必会的
    
     12
  • st
    2019-04-21
    以前认知是html cds js,后来认识一些大佬,和他们同一个项目,日常的点滴,渐渐规范起来,才明白,这只是非常浅显的认知。

    首先,前端项目的搭建要合理清晰,

    其次,组件的复用性,最好的组件方式就是只负责UI层面的渲染,不涉及业务,业务抽离出来做成service等;而且组件最好细小化,只负责一小块,

    然后,页面尽量语义化,scss,sass尽量少,能全局的放在全局,比如Mixin, normalize,当设计变来变去,也要和设计师沟通协商调整,不可能他今天一个样式,明天换一个,

    接着,组件,service什么的写完了,确保自己代码测试覆盖率,记得写unit test,可以向别人下保票,自己写的99%是没问题的,如果别人想来challenage你代码,也会理直气壮有理有据。

    尽量减少自己的代码量,html css js文件,
    业界有很多成熟的框架,结合自己的业务,结合项目要求,能用的就用,时间精力思考广度,远远优于自己去手写一个,不然很容易会出现各种各样的问题和bug,

    用别人的框架,有时间就了解一下原理,看看源码啥的,知其然也要知其所以然,面试也有帮助,加身功能理解,以后业务方面也会更清晰,

    然后呢,肯定任何人写的代码都有值得优化的,要有这个思想存在,想着变得更好,

    还有其他的细节吧,先这样啦,个人体会就是这样啦,也是在每天进步,观察,思考,实践,层层递进,
    展开
     1
     11
  • 岑中归月
    2019-01-17
    工作一年多,我对前端的知识架构的认识就是:顶层目录html+css+javascript,二级目录是把这三个里面的知识点生硬并且毫无关联的列出来,三级目录是继续划分,,,,,,看了老师的讲解,觉得这样划分的知识架构毫无逻辑可言,期待老师后面的课程。
    
     8
  • 大蓝
    2019-01-21
    前端5年,正如文章讲浪费了学习的时间的小公司前端,学前端完全是野路子,前面三年都惧怕前端杂乱和混杂的方向,各种源码解读,各种原型解读,到最后都看不下去~没有清晰的方向,今年发觉并非自己笨,而是前端这条路子自己走的太坎坷了,没有名师,没有团队,凭个人智力 摸索打滚,也只是坐井观天
    
     7
  • 远恒之义
    2019-01-17
    刚看完了老师的直播,学到了很多的东西。
    又重新复习了一遍今天的内容:学习路径和学习方法。

    学习路径就是看书和建设性网站,购买老师的专栏,我觉得看不错的视频教程也是一种路径。

    学习方法就是搭建知识架构和追本溯源。
    老师讲解的学习方法都是三个维度(what、how、why)一步步由浅入深,从概念到方法再到收获,逻辑清晰同时具有完备性。

    我是做 iOS 开发,知识架构是通过印象笔记中 iOS 功能知识点划分的笔记本加标签共同构建的目录和索引。学习了老师的方法之后,后面重新思考再梳理一下有逻辑具有完备性的知识体系吧。
    展开
    
     7
  • 王智
    2019-01-17
    学习后端的我也来蹭点经验.无论是前端还是后端,我感觉学习方法都是相通的,甚至有时候我觉得前端的更新以及新技术的出现会更甚于后端,所以学习方法很有必要.我觉得老师说的两个方法都很好,追本溯源了解技术出现的背景和解决的问题,可以更快地了解这个技术以及进行学习,根据自己的问题来学习技术. 同样,构建知识架构也是很有必要的,我一直想总结一下后端的知识体系,一直没有思路,等下篇文章看看前端的知识体系来总结一下吧. (•̀ᴗ•́)و

    加油加油!!!
    
     7
  • 梁山伯与伏地魔
    2019-01-18
    看了后 我心中浮现的结构大概如下吧:
    1.html 骨架
    2.css css3 外观
    3.js 行为
    4.浏览器(
       1.插件 草料二维码 vue dectools这类
       2.http协议
       3.工具 network console...
       4.window对象等
       5.兼容
       6.渲染模式)
    5.工具(
       1.编辑器 webstorm vscode hbuilder
       2.git/webpack
    6.框架(vue react...
    7.插件库/ui库(axios moment 富文本编辑器 element antd

    大概就是这个样子吧..
    希望可以看到后面的课程取精华去糟粕有所进步
    展开
    
     6
我们在线,来聊聊吧