搜索引擎优化高级编程(【干货】搜索引擎教程，让你的前端学习更简单)

　　搜索引擎优化高级编程(【干货】搜索引擎教程，让你的前端学习更简单)

　　5、在整个学习过程中，HTML、CSS、JavaScript在很多地方都需要相互结合。在实际工作中也是如此。一个简单的功能模块需要三者结合来实现。

　　6、动手是学习的重要组成部分。书籍侧重于解释知识点，例子可能不够充分。这就需要使用搜索引擎找到一些简单的教程，并根据教程实现功能。这里有一些很好的教程网址

　　7、Native javascript 是一项需要掌握的技能。在掌握原生javascript的基础上，建议精通jQuery，在实际工作中非常有用。有关此主题的书籍包括《学习 jQuery》或访问 jQuery 的官方网站。

　　8、创建一个账号/账号，保存平时学习中的各种代码和项目。

　　9、有了一定的基础后，可以建立个人博客，记录学习过程中遇到的问题和解决方法，方便自己复习，帮助他人。也可以去/或/这样的网站注册账号，方便实用

　　10、经常使用谷歌搜索英文资料，应该经常从/中找到高质量的答案，可以直接在这里搜索问题。如果你有精力，注册一个账号为别人答疑解惑，也可以大大提升你的个人能力。

　　11、熟悉经典书籍后，可以打开上面所需基本技能部分的链接。仔细阅读相应标准，充分掌握知识

　　继续改进

　　有了前面的基础，前端基本算是入门了。这个时候，大家心里可能有一些学习方向，如果没有的话。您可以参考上面必备技能部分中提到的两项，并从中选择一些进行开发性学习。以下是一些不错的方面：

　　一些个人经验

　　LingyuCoder的学习心得

　　上面各位大神总结的差不多，这里就废话了。

　　工具

　　Chrome dev tools：前端开发和调试工具，主要关注几个功能：

　　控制台（废话）

　　elements：元素样式调整，很常用

　　来源：给代码加断点，单步调试，单步调试时查看内存中的对象

　　watch expression：通过表达式查看内存中的当前值

　　call stack：查看调用栈，开启async，可以看到异步调用栈（这个很有用，尤其是用ajax调试的时候）

　　作用域变量：作用域链上的变量，非常有用

　　network：抓包查看每个请求，非常重要，前后端联调必备

　　时间线：渲染、js执行等阶段分析，性能优化工具

　　emulation：模拟移动环境，移动页面开发必备

　　一些插件：

　　liveload：修改页面后自动刷新，无需按F5

　　尺寸：直接在页面上测量的工具

　　livestyle：css样式修改后自动生效，无需刷新，修改后的元素也可以同步到代码中

　　图像工具：测量，取色

　　UC二维码：手机调试扫描必备

　　pagespeed, YSlow：页面性能分析和优化插件

　　马克飞翔：优秀的在线markdown编辑器，快速写周报，做笔记

　　Sublime text2：编码简单，插件多，速度快，性能好

　　emmet：提高html编码速度所必需的

　　Sublimelinter + lint 和各种语言的提示：代码纠错

　　一些片段：自动完成以提高开发效率

　　Intellij IDEA和WebStorm：集成开发环境，集成各种功能，开发比sublime方便，但会吃更多性能

　　Mark Men：测量、选色、打标的工具，拿到视觉稿后第一个打开的软件

　　iHosts：非常好的主机管理软件，主机修改方便，开发调试必备

　　Charles：Mac平台最好的抓包分析工具

　　Rythem：AlloyTeam出品的代理抓包软件，非常轻量级，易于安装，便于移动端（真机）开发调试使用

　　Wunderlist：一个非常不错的Todo List，当有很多任务和需求的时候管理起来很方便

　　技能

　　事实上，除了 JavaScript（包括 NodeJS）、HTML、CSS 之外，还有很多前端技能。其实前端技能树很大。这里只能列举一些我在开发中看到的东西。

　　语言基础

　　JavaScript：

　　CSS：

　　HTML：

　　先进的

　　JavaScript：

　　常用框架及其原理

　　CSS和HTML：主要是CSS3和HTML5的特点，以及浏览器处理的流程和渲染原理

　　常用的 NodeJs 包：

　　一些想法：

　　性能优化：

　　项目

　　未来

　　其他

　　有些事情不能通过打字测试来完成。参加实习的时候感触良多。这些是我遇到的，也是我觉得自己做得不好的。

　　介绍书

　　你可以从看书开始，但是书上的很多东西已经过时了。在看书的同时，一定要不断关注科技的新动向。以下是我认为不错的几本书：

　　一些不错的 网站

　　课程

　　以前做Java SSH，中途做了前端和尚，所以水平比较弱，遇到很多问题。基本上，入口依赖于阅读W3C学校的书籍和教程，以及一些前端博客，比如汤姆叔叔的博客。以前只用jQuery，对原生js的研究不多。后来，我逐渐阅读了很多动物类的书籍，比如古语精髓等等。我从这些书中学到了很多语言层面的知识。但这显然是不够的，所以我经常去社区看看大家都在说什么，然后再去看相关的资料。如果我有兴趣，我会找到更多的信息来阅读，或者写一个演示。学习CSS主要是这样的。之后，开始更加关注各种大牛的博客和一些比较深入的书籍，以及一些新的知识和框架，不断的练习和提交代码到github，学到了很多知识。实习期间，我亲自参与了实际的项目开发，可以学到很多在学校学不到的想法和思想，也很有帮助。不说了，我去搬砖求个offer……

　　MrRaindrop的学习经历

　　应邱大神之邀，分享一下我的前端学习心得。前端知识体系结构这里就不总结了。大神们的总结已经到位。我将贡献几个我认为对大家学习和学习更有用的链接。，然后主要分享一下我在前端学习过程中遇到的问题和经验教训。如果能帮助想要入门的 FE 初学者（我会假设本文的受众类型），让他们少走一些弯路，每走一步，就知道下一步的方向。这是最好的。大神们的总结和分享，请参考邱神组织的FE-learning。

　　让我们先谈谈它。每个人都可以有自己的前端学习方法。本文仅供参考。有点乱。

　　起源

　　我误入了前端。我之前一直在做游戏的方向。玩过游戏网站，玩过游戏引擎，比如unity，虚幻商业引擎，玩过几款游戏。原型，不过自从进了实验室，就被导师直接派来写js了。导师给了我半个月的时间，写了一个基于百度地图api的数据展示页面。虽然这次还是挺大方的，但是之前没写过太多js，也不知道map api怎么用，所以边看“代码”边看《Javascript权威指南》（犀牛书）实验室前辈留下的，终于把所有的函数都写好了。. 那个页面算是我的js入口，也是我前端学习路线的开始。

　　现在想来，虽然我被指派做前端，但还是要靠兴趣继续做，做好。当然，前端是一个有趣的技术领域，社区每天都很热闹。

　　项目，下一个项目

　　我个人认为，在前端学习中，可以完全摆脱书本，一开始就做项目驱动。虽然我个人是从犀牛书开始的，但如果你没有足够的时间，或者你觉得这本书枯燥乏味，请不要像我一样。当然，如果你决定读这本书，最好按照书中的例子进行。在我去研究之前，我从未接触过js。4月份开学前，我被导师直接扔在我脸上一个百度地图api项目，后面跟着各种ERP，地图数据展示，虽然花样不太一样。，但基本上都是前端工作，SSH和android开发也打过酱油，整个实验室只有我写前端能相信吗？富客户端SPA时代的后端是一个restful界面，而且代码量基本在前端。自己一个人怎么能写出这么爽的字……期间，我跟着导师，经历了一次创业，每天从7：00到晚上10：00，是一个快速成长的时期。

　　要掌握一项技术，首先要掌握它的大体框架，想出一个可以实现的想法，做一个可以运行的demo，然后完善它的细节。演示完成后，对技术有一个感性的认识，然后去看看书，收获会大很多。我开始写原生js到jquery，再到extjs，再到angularjs，从导师指定技术，到自己做技术选型，一个个项目练，就像打怪升级一样。当然，如果您没有项目，您可以创建自己的项目。实现自己的想法是一件有趣而充实的事情。

　　采集和知识管理

　　前端学习有一个特点，很多东西都是零散的，需要自己整理、总结、总结。我在微博和知乎上关注了很多大神。你不只是为了听八卦。大神们的寥寥数语，有时会留下无尽的回味。很可能一个不经意提到的词会成为你的下一个学习目标。采集这些信息，用谷歌搜索，提问，思考。就像游戏中的采集元素一样，前端学习也是一个充满采集元素的“游戏”，但需要一个知识管理工具来充当库存和仓库。我认识的大牛都对知识管理工具用户很重视。我之前用的oneNote，当时还没有绑定云存储。现在我基本用evernote，并且笔记已经累积到1200+。书签本来打算用delicious，因为是基于标签管理的，但是一直没用。当然，重点不在这些工具上，而是手头的工具可以提高你的学习效率。关键当然是时刻保持强烈的学习欲望。你的目标是了解前端的一切（当然不是一切，因为毕竟你的精力是有限的，而且现实地说，这不太可能）。

　　跟随上帝

　　这个可控性好像不大……老板我就不多说了，一定程度上还是靠造化吧。不过话虽如此，与身边的专家多交流才是王道。这个专家不一定要高，但一定对技术有热情。在研究的第一年，我非常热情。我每天七点进实验室门口，然后发现居然有一个家伙比我早到。后来才知道，这家伙早上走，下午又来，家教也习惯了。原来这家伙晚上不睡觉写代码，早上才回去睡觉。后来经常跟这个大神讨论问题，每次都觉得经验值在涨。然后实验室里还有一位神，被之前的通宵神描述为“只在后面，一直在追，从不追赶”，两位神的特点就是略知一二一切，所以他们可以和你讨论一切我明白了，我做了一段时间的阅读计划，从c/c++到vc/mfc到unix网络编程，最后在MSDN上看到了核心java技术和C#编程指南，我也可以和神对话。高的。从c/c++到vc/mfc再到unix网络编程，终于在MSDN上看到了核心java技术和C#编程指南，也可以和大神交流一下。高的。从c/c++到vc/mfc再到unix网络编程，终于在MSDN上看到了核心java技术和C#编程指南，也可以和大神交流一下。高的。

　　总之，这两个神把我拉进坑里，或者从一个坑跳到另一个坑。虽然两位大神都不搞前端，但技术之间总有相似之处。

　　读

　　多读书，多读书，多读好书。我在刘伟鹏的博客里看到过一个公式，你第一个月的工资等于你之前买（读）过的技术书籍的价格之和（这里所说的技术书籍是指那些经典的、公认的好书）。讨论这个公式的正确性似乎毫无意义，但它的合理性是毋庸置疑的，那就是多读一些经典的技术书籍。最极端的例子，谷歌的徐友在我大学说他扫了图书馆的整个TP312书架……前端经典书籍，我采集的前端书籍列表在后面（如果前端经典有什么遗漏，都是好书，请留言告诉我），有条件的可以尝试再刷一遍这些书，我也在寻找一个完整的时间来完成它们。前面说了，前端知识点松散，采集零散的知识点，快速学习博客等等，这些只是前端学习的一个方面。如果你想深入了解一个知识体系，了解它的来龙去脉，建立系统的认识，阅读经典书籍还是必不可少的。

　　从最开始读完Rhinoceros这本书，然后又去看了一些其他与前端关系不大的经典技术书籍，然后通过实验室项目逐渐开始比较前端领域和我做的一些小项目。读完《Javascript Patterns》、《Javascript Design Patterns》、《Writing Maintainable Javascript》之后，我了解了node，开始用node做一些小玩意。我也看了《NodeJS up and run》和《Mongodb权威指南》，但是感觉前者有点坑。那个时候，濮凌那本把简单的事情简单地解释（展示书）的书还没有问世。后来，我去图书馆借了它，读了一遍。看起来不错，但我还是觉得我读的少了，需要继续。刷（见上面的书栏）。

　　前端定位

　　前端的定位关系到你需要吸收什么样的知识和技能，决定了你在技术世界中需要对什么格*敏*感*词*越来越广，标准越来越丰富。似乎任何触手都可以伸到很远的地方。如何给前端一个合适的定位？考官给我分析了半天，然后总结成一句话，就是用户和网站之间的链接器，用户体验的创造者（原话不是这样的，但大体上是这个意思）。也就是说，前端的终极目标是创造用户体验，提升用户体验，以用户体验为中心。无论是从交互设计入手，还是从性能优化入手，还是改进工作流提高工作流效率，归根结底都是为了创造和提升用户体验，最终还要体现在用户体验上。我觉得这个总结很合理（当然，“用户体验”这个词太宽泛了，不只是前端工程师的范围。比如开发后台的时候，优化一个数据处理流程，整体提升性能，这也有利于用户体验的提升）。但通常是这个意思）。也就是说，前端的终极目标是创造用户体验，提升用户体验，以用户体验为中心。无论是从交互设计入手，还是从性能优化入手，还是改进工作流提高工作流效率，归根结底都是为了创造和提升用户体验，最终还要体现在用户体验上。我觉得这个总结很合理（当然，“用户体验”这个词太宽泛了，不只是前端工程师的范围。比如开发后台的时候，优化一个数据处理流程，整体提升性能，这也有利于用户体验的提升）。但通常是这个意思）。也就是说，前端的终极目标是创造用户体验，提升用户体验，以用户体验为中心。无论是从交互设计入手，还是从性能优化入手，还是改进工作流提高工作流效率，归根结底都是为了创造和提升用户体验，最终还要体现在用户体验上。我觉得这个总结很合理（当然，“用户体验”这个词太宽泛了，不只是前端工程师的范围。比如开发后台的时候，优化一个数据处理流程，整体提升性能，这也有利于用户体验的提升）。前端的终极目标是创造用户体验，提升用户体验，以用户体验为中心。无论是从交互设计入手，还是从性能优化入手，还是改进工作流提高工作流效率，归根结底都是为了创造和提升用户体验，最终还要体现在用户体验上。我觉得这个总结很合理（当然，“用户体验”这个词太宽泛了，不只是前端工程师的范围。比如开发后台的时候，优化一个数据处理流程，整体提升性能，这也有利于用户体验的提升）。前端的终极目标是创造用户体验，提升用户体验，以用户体验为中心。无论是从交互设计入手，还是从性能优化入手，还是改进工作流提高工作流效率，归根结底都是为了创造和提升用户体验，最终还要体现在用户体验上。我觉得这个总结很合理（当然，“用户体验”这个词太宽泛了，不只是前端工程师的范围。比如开发后台的时候，优化一个数据处理流程，整体提升性能，这也有利于用户体验的提升）。或者改进工作流来提高工作流效率，归根结底是创造和改善用户体验，最终要体现在用户体验上。我觉得这个总结很合理（当然，“用户体验”这个词太宽泛了，不只是前端工程师的范围。比如开发后台的时候，优化一个数据处理流程，整体提升性能，这也有利于用户体验的提升）。或者改进工作流来提高工作流效率，归根结底是创造和改善用户体验，最终要体现在用户体验上。我觉得这个总结很合理（当然，“用户体验”这个词太宽泛了，不只是前端工程师的范围。比如开发后台的时候，优化一个数据处理流程，整体提升性能，这也有利于用户体验的提升）。在开发后台的时候，优化一个数据处理过程可以提高整体性能，这对用户也是有好处的。体验的提升）。在开发后台的时候，优化一个数据处理过程可以提高整体性能，这对用户也是有好处的。体验的提升）。

　　现在的前端工程师难免会遇到比切页、实现视觉需求、实现交互更深入的问题，比如前端自动化、图像编程、性能优化等JSP/ASP/nodeJs。过去，后端模板一般都属于后端的范畴。现在随着前端架构的演进，可能会要求你写后端模板的代码，这需要后端语言（PHP/Java/C#等），也就是所谓的大前端（不过这并没有偏离前端的定位，大前端还是处理和用户接触的部分，还是用户体验的优化）。可能最常见或谈论最多的是节点。事实上，这些类型的技术都是可以选择的。

　　Yubo在他的博客中提到，所谓全端是水平的，全栈是垂直的。全端是指所有的终端都是前端，因为它们都与用户体验相关，直接接触用户。适应多终端开发需要你在web前端的基础上扩展你的android开发和ios开发知识。幸运的是，由于混合开发的流行，用母语开发所需的技能不会那么深入。.

　　全栈可以说是最适合创业公司的开发类型。广义上认为是从前端到后端，从开发到运维。这个不用说了。大多数人不应该想朝这个方向发展。开发，如果你想成为这个意义上的全栈开发者，你可能不需要看我的文章文章；而狭义的全栈是指使用js语言从前端编写到构建在nodeJs上的后端，前后端统一语言，统一编程模型，甚至共享同一套的代码。要了解有关全栈开发的更多信息，请参阅 Yubo 关于全栈工程师的文章。

　　以上是我对前端的粗浅理解以及衍生的技术路线。学习一个领域，掌握它的整体趋势和趋势是非常重要的。另外，如果你想对前端的学习方向和职业成长路径有一个整体的了解。

　　过去的建议：

　　自学了 9 个月的代码后，我是如何找到工作的

　　零基础学习前端技术及相关教程