先介绍下大致情况时间线。

18 年 8 月正式转方向为前端,之前做了一段时间的 iOS,后来因为对前端更感兴趣所以就打算转方向了。19 年 10 月入职当前公司,定级资深前端,分配到业务架构小组,自此在一年零两月的时间内完成从 iOS 转方向到资深前端的过程。

很多读者会问我是如何学习的,今天这篇文章就来完整的梳理一遍整个过程。过程可能不能复制,但是其中很多的方法论我相信一定对你有帮助。

 学习经历

转前端之前

17 年底开始正式学习前端,这时还在做 iOS 开发,所以拿来学习的时间并不会很多。偏向实战论,喜欢边学边补,至今完整读过的前端书籍寥寥几本

  1. 你不知道的 JS 基本读完
  2. 忍者秘籍第二版读完
  3. 其他零零碎碎的读过一些书,但是基本都是随便翻翻就过了

很多人推崇的红宝书笔者就读了四五章节,这本书主要是基础内容,对于基础内容我更喜欢读文档。MDN 翻一翻,网上查一查,基本就能把 JS 基础了解个大概,CSS 及 HTML 的内容基本没花时间学,都是现学现用。

在转前端之前大致的学习路线如下:

  1. JS 基础了解个大概,CSS 和 HTML 花的时间很少,当然在后续的学习过程中逐步在填补基础的漏洞,只是没有一开始就花大量的时间去学习。
  2. 读文档,开始写 Vue。将自己的需求写成一个小项目,主要技术栈为 Vue 及 Node,都只属于会用。
  3. 从同事那里了解到 Webpack 是个难啃的东西,自己买了 相关的课,照样画葫芦最后产出一个教程。
  4. 开始学习 React,同样也买了相关的课,最后产出一个开源项目,至今过 1k stars。

时间节点到这里大概是 18 年 1 月份,总结几个帮助我学习的点:

  • 动手很重要,把自己学到的知识写成一个小项目或者文章,对于自己的帮助是很大的。在这个节点之前,我在掘金产出了六篇前端相关的文章,获得了四千多的点赞。
  • 文档最重要,牛逼的项目的文档几乎没有错误,只有二手资料才会错误百出。
  • 活用搜索引擎,那时候我还是个小透明,没加过任何的前端群,有问题就是谷歌搜答案。遇到报错就把报错丢上去;遇到写的和预期不对就把想要的搜一下;遇到自己没学过的,就搜一下相关知识,就这样逐步累积上来。当然在这一步最为核心的点是得用英文 + 谷歌搜索,缺一效率就低。觉得自己英语不好的不要担心,把自己想问的谷歌翻译一下不就好了。

接下来就是一个面试季了,这时候掘金的面经文章层出不穷,我也尝试去解答了那些面试题。这时发现自己不会的相当多,因此觉得这些面试题会是一个帮助自己填补知识漏洞的好办法。

于是接下来很长一段时间我都是处于这样一个循环中:

  1. 找面试题
  2. 回答面试题,挖掘它背后的知识点,写成内容

在这个循环中我逐步发现如果我能把这个东西做大做好,那么一定会是个爆款,毕竟那时候没有竞品,转方向的念头也是这个期间萌发的。后面的事情应该很多读者都晓得了,我把它做成了开源,最后获得了一万六千多的 stars。

在这个做开源的期间,我觉得最重要的可能是费曼学习法了,也就是以教促学。从我不会到我觉得自己会了到最后把自己会的东西写成内容教给别人,那时候的学习途径如下:

  1. 发现自己不会的点,不管你是从哪里发现的
  2. 搜索资料,尝试搞懂它
  3. 写一下代码,验证一下
  4. 把自己理解的写成文字
  5. 把自己代入读者,看着自己写的内容是否能学会这个知识
  6. 多搜索这个知识相关的文章,看看有没有遗漏的
  7. 在前几个环节你可能还会发现更多自己不会的点,继续循环

整个开源项目我都是这样操作下来的,其中包括了之前我不懂的、懂的、懂的但并不完善的知识,通过以上的学习方法完成了自己的知识梳理及填补漏洞的过程,至今我还一直践行着以上方法论,真的很有效。

项目开源以后,我也顺利了找到了工作,至此完成方向转型。

希望对正在学习,或者转行,大学生的伙伴有所帮助,在学习的路上少走弯路, 从事全栈6年
专门建立的学习q裙851231348 分享学习方法和需要注意的小细节,互相交流学习,不停更新最新的教程和学习技巧(从零基础开始到WEB前端项目实战教程,学习工具,全栈开发学习路线以及规划)

工作中

在工作中学习的这块内容其实之前已经写过,在这里我就直接把精华总结一下:

  1. 用到的所有技术栈务必用精,没到这个阶段之前别想东想西的这个那个都想学点皮毛,没啥用。
  2. 了解下市场的热门技术,过时的就别浪费时间学了,顺便也给自己储备点知识,最好学点公司未来可能要用的技术栈。
  3. 想想看未来怎么在自己的简历上写工作上的亮点,然后尝试着去做。
  4. 别写完代码就完事了,看看还有没有能调优的地方,这都是你未来能写在简历上的东西,多从未来给简历加分上看齐。
  5. 学会偷懒,能用脚本做的就让脚本去实现,在这个过程中你就能成长。
  6. 给自己列点计划在业余中学习。

1年转行资深前端工程师,开源项目过 1k stars,完整学习过程的更多相关文章

  1. 我发起并创立了一个 Javascript 前端库 开源项目 jWebForm

    在线演示地址: ( 在线演示 云平台 由 Kooboo 提供  https://www.kooboo.com/ ) 按钮:      http://iwebform.kgeking.kooboo.si ...

  2. webfunny前端监控开源项目

    前言介绍 如果你是一位前端工程师,那你一定不止一次去解决一些顽固的线上问题,你也曾想方设法复现用户的bug,结果可能都不太理想. 怎样定位前端线上问题,一直以来,都是很头疼的问题,因为它发生于用户的一 ...

  3. 资深前端工程师带你认识网页后缀html、htm、shtml、shtm有什么区别?

    每一个网页或者说是web页都有其固定的后缀名,不同的后缀名对应着不同的文件格式和不同的规则.协议.用法,最常见的web页的后缀名是.html和.htm,但这只是web页最基本的两种文件格式,今天我们来 ...

  4. 淘宝前端工程师:国内WEB前端开发十日谈

    一直想写这篇"十日谈",聊聊我对Web前端开发的体会,顺便解答下周围不少人的困惑和迷惘.我不打算聊太多技术,我想,通过技术的历练,得到的反思应当更重要. 我一直认为自己是" ...

  5. (转)国内外优秀的Web前端工程师

    1. 国内外优秀的Web前端工程师 寻找Github.微博.知乎等技术社区上比较活跃.影响力大的圈内大神,供大家膜拜! 视野所限,未必全面,欢迎大家推荐.自荐. 排名不分先后,序号只为标记方便. 提供 ...

  6. 转发 ----> 2018年阿里巴巴重要开源项目汇总(持续更新中)

    转发自segmentfault  https://segmentfault.com/a/1190000017346799 前端 1.数据驱动的高交互可视化图形语法 AntV - G2 G2 是一套基于 ...

  7. android开源项目学习

    FBReaderJ FBReaderJ用于Android平台的电子书阅读器,它支持多种电子书籍格式包括:oeb.ePub和fb2.此外还支持直接读取zip.tar和gzip等压缩文档. 项目地址:ht ...

  8. 我发起并创立了一个 EPWA 的 开源项目

    EPWA ,  是  Easy PWA  的 意思, PWA 取自于 Google 的 PWA, EPWA   是一个用   C#  Cef  Html  js  css   开发 桌面程序 的 架构 ...

  9. 国内最火的 HTML、CSS、JavaScript 开源项目 Top 榜,你知多少?

    对于开发者而言,想要着手前端开发,HTML.CSS 和 JavaScript 是三项必备的基础技能.而如何事半功倍地掌握好这些知识?通过了解当下火热的开源项目不乏为最佳学习姿势.本文盘点国内评分最高且 ...

随机推荐

  1. Java实现 LeetCode 381 O(1) 时间插入、删除和获取随机元素 - 允许重复

    381. O(1) 时间插入.删除和获取随机元素 - 允许重复 设计一个支持在平均 时间复杂度 O(1) 下, 执行以下操作的数据结构. 注意: 允许出现重复元素. insert(val):向集合中插 ...

  2. Java实现 Leetcode 169 求众数

    public static int majorityElement(int[] nums) { int num = nums[0], count = 1; for(int i=1;i<nums. ...

  3. 「MoreThanJava」机器指令到汇编再到高级编程语言

    「MoreThanJava」 宣扬的是 「学习,不止 CODE」,本系列 Java 基础教程是自己在结合各方面的知识之后,对 Java 基础的一个总回顾,旨在 「帮助新朋友快速高质量的学习」. 当然 ...

  4. Java 多线程基础(一)基本概念

    Java 多线程基础(一)基本概念 一.并发与并行 1.并发:指两个或多个事件在同一个时间段内发生. 2.并行:指两个或多个事件在同一时刻发生(同时发生). 在操作系统中,安装了多个程序,并发指的是在 ...

  5. ES索引操作

    1.创建测试索引 PUT /test_index{ "mappings": { "test_type":{ "properties": { ...

  6. Java规则引擎 Easy Rules

    1.  Easy Rules 概述 Easy Rules是一个Java规则引擎,灵感来自一篇名为<Should I use a Rules Engine?>的文章 规则引擎就是提供一种可选 ...

  7. 内核与驱动文件的version magic匹配问题

    https://blog.csdn.net/yubing_615/article/details/52183185 1.问题:本地编译的一整套底层代码down到设备跑都正常,但是由这套代码上传SVN服 ...

  8. 字符串回文判断 js练习

    / 判断一个字符是否为回文,abcba是回文,. /*function fn2(str){ var str1=''; for(var i=str.length-1;i>=0;i--){ str1 ...

  9. kali系统安装后乱码的解决

    1.先添加kaili的源地址*(这里推荐了几个源,选一个就可以.打开/etc/apt/sources.list 删除里面自带的所有内容,把你复制的内容添加进去保存就ok了) #中科大 deb http ...

  10. DockerFile构建镜像和Docker仓库

    利用commit理解镜像构成 注意: docker commit 命令除了学习之外,还有一些特殊的应用场合,比如被入侵后保存现 场等.但是,不要使用 docker commit 定制镜像,定制镜像应该 ...