阅读 1844

前端初级新人,如何撕去菜鸟标签

原文地址:github.com/ruizhengyun… 作为前端新人,我们常以菜鸟自居,主要是专业程度不高,还有就是自谦。其实,作为菜鸟的我们也想撕掉这类标签,我们也努力,可还是学不好前端,是真的不适合做这行还是方法不对,没人告诉我们?如果你觉得自己还处在菜鸟阶段的迷茫区,那可以看看本篇文章,希望看完之后你能得到想要的。如果你要阐述你的想法,请在评论区留下你的文字。

前端路上我们都会碰到这类情景:现有技术体系已经很庞大了,还没学个遍,新技术又频繁涌出,发现有太多太多东西要学,隐隐有点学不动的趋势。不知不觉就在这条路上迷茫了,发现自己原来那么渺小。正所谓登高极目,知天地之大;置己苍茫,知寸身之微。

我的逻辑是:现实我们是改变不了了,我们能掌握的是改变自己的学习方法和思维逻辑。我们常说万变不离其宗,对于前端来说,这个宗我的理解就是 html + css + js

  • 建体系。将现有知识做个体系架构,然后将市场上前端技术点填入到这个体系架构中,不管新出现的知识是怎样的,都在这个体系架构内,无非是对架构的补充或完善(新增和修改),我们要做的不就不断完善这个体系架构,体系架构可参考《8年前端知识点沉淀》
  • 深入。在每个分类中择其一,然后深耕;
  • 浅出。用自己的语言将深耕的知识点输出出来,可以文字,可以声音(分享);

不管现在处于初级、中级、高级、资深还是大前端阶段,学习的通用方法大抵如此,当然小异部分我会在各个阶段单独指出。以上纯属个人观点,如有补充和指正可按文章开头方法在评论区评论(即 github 上登录后评论)。

学习方法

代码管理

1.在 github 建个仓库,比如 html-note,只在 master 主分支上开发即可,完成一类知识点打个标签

git tag -a 0.1.0 -m "这一类知识的说明"
git push origin --tags
复制代码

2.利用 gitbook 库来打包成小书,然后利用 github 自带功能生成在线的,然后自己没事的时候,看看自己学的东西,然后再查缺补漏,不断完善; 3.学习文档用 markdown 语法来写,养成写文档的好习惯,对于为什么写文档和项目开发中前端需要写哪些文档,我会在后续的文章中阐述,这里不展开; 4.编码工具可用 Vscode,整个目录可参考

.
├─ package.json      # 依赖包
├─ SUMMARY.md        # 文档大纲
├─ book.json         # 小书配置信息
├─ assets/           # 静态资源,主要是图片
├─ notes/            # 文档中示例存放

复制代码

前端基础

HTML5 + CSS2.1

这部分建议在 w3school 在线教程或MDN 上学习,边学边练,学习过程中请打开 chrome 浏览器调试工具,辅助学习和调试。

ECMAScript

这部分学的内容会很多,如果没有编程语言的基础的话,会吃些力。建议先在 w3school 在线教程或MDN 上学习。

犀牛书《javascript语言精粹》或红宝书《Javascript 高级程序设计》,前期看其中的一本就好,这个时候你可以建仓库 ecmascript-note 了;

数据结构和算法

实践开发中,和后端提供的接口交互以及前端自身的逻辑处理,然后将数据渲染到页面,往往离不开数据结构和算法这块的知识。

前端初级

CSS

有了 CSS 基础知识,还需要继续深入,了解

  • css3 规范;
  • 预编译语言:less 或 sass;

只有经历这个过程,你才会发现 less 的美。看完这块,你的了解选择器、盒模型、弹性布局、媒体查询等概念。

ECMAScript

  • Zepto.js 或 jQuery.js。完成一些简单项目,熟悉 API;
  • 推荐小黄书《你不知道的 JS》上中下三册;
  • ES5 知识点掌握,能区分 ES5 与 ES3 常用的一些知识点;
  • ES6 常用的一些知识点,暂时不推荐阮一峰老师的 ES6 教程,太多了,怕你会迷茫和陷入无聊区,找一些总结小书(一些常用的 ES6 语法总结)看看,一直想写,没时间;
  • 常用概念(面试也会碰到)弄清楚。比如变量作用域、传递方式、执行上下文、闭包、apply/call/bind、this 指向等;
  • 网络编程。Ajax、fetch、websocket、cors、jsonp、formData等知识。

浏览器

  • 常用跨域;
  • 存储机制;

性能

  • 常用性能优化;

安全

  • 了解 XSS 和 CSRF 攻击;

正则表达式

  • 基础知识,视频或一些文档,此刻不建议看官方文档;
  • 常用正则表达式会写;

工程化

  • npm 常用命令和简单应用;
  • git 常用命令和简单应用;
  • webpack 能搭建一个应用;

React.js

对于面前前端三大框架,大家都不陌生了。建议择其一,然后了解入门知识。我安利的是 React.js,个人倾向,无外乎其他。主要学习中英文官网入门知识。结合 create-react-app 脚手架。

Node.js

  • 基础知识;
  • express 或 koa2 简单应用;

说明:上面学习内容不求学完都记得,能掌握 70%-80% 就可以了,主要有个先入为主的概念,以后碰到这类问题,知道怎么去描述问题,培养独立解决问题的能力。

最后,祝你好运。有什么补充,请按文章看头说的方法给出你的想法。前端中级,我会尽快写完,不要离开哦。

关注下面的标签,发现更多相似文章
评论