1年转行资深前端工程师,开源项目过 1k stars,完整学习过程
先介绍下大致情况时间线。
18 年 8 月正式转方向为前端,之前做了一段时间的 iOS,后来因为对前端更感兴趣所以就打算转方向了。19 年 10 月入职当前公司,定级资深前端,分配到业务架构小组,自此在一年零两月的时间内完成从 iOS 转方向到资深前端的过程。
很多读者会问我是如何学习的,今天这篇文章就来完整的梳理一遍整个过程。过程可能不能复制,但是其中很多的方法论我相信一定对你有帮助。
学习经历
转前端之前
17 年底开始正式学习前端,这时还在做 iOS 开发,所以拿来学习的时间并不会很多。偏向实战论,喜欢边学边补,至今完整读过的前端书籍寥寥几本
- 你不知道的 JS 基本读完
- 忍者秘籍第二版读完
- 其他零零碎碎的读过一些书,但是基本都是随便翻翻就过了
很多人推崇的红宝书笔者就读了四五章节,这本书主要是基础内容,对于基础内容我更喜欢读文档。MDN 翻一翻,网上查一查,基本就能把 JS 基础了解个大概,CSS 及 HTML 的内容基本没花时间学,都是现学现用。
在转前端之前大致的学习路线如下:
- JS 基础了解个大概,CSS 和 HTML 花的时间很少,当然在后续的学习过程中逐步在填补基础的漏洞,只是没有一开始就花大量的时间去学习。
- 读文档,开始写 Vue。将自己的需求写成一个小项目,主要技术栈为 Vue 及 Node,都只属于会用。
- 从同事那里了解到 Webpack 是个难啃的东西,自己买了 相关的课,照样画葫芦最后产出一个教程。
- 开始学习 React,同样也买了相关的课,最后产出一个开源项目,至今过 1k stars。
时间节点到这里大概是 18 年 1 月份,总结几个帮助我学习的点:
- 动手很重要,把自己学到的知识写成一个小项目或者文章,对于自己的帮助是很大的。在这个节点之前,我在掘金产出了六篇前端相关的文章,获得了四千多的点赞。
- 文档最重要,牛逼的项目的文档几乎没有错误,只有二手资料才会错误百出。
- 活用搜索引擎,那时候我还是个小透明,没加过任何的前端群,有问题就是谷歌搜答案。遇到报错就把报错丢上去;遇到写的和预期不对就把想要的搜一下;遇到自己没学过的,就搜一下相关知识,就这样逐步累积上来。当然在这一步最为核心的点是得用英文 + 谷歌搜索,缺一效率就低。觉得自己英语不好的不要担心,把自己想问的谷歌翻译一下不就好了。
接下来就是一个面试季了,这时候掘金的面经文章层出不穷,我也尝试去解答了那些面试题。这时发现自己不会的相当多,因此觉得这些面试题会是一个帮助自己填补知识漏洞的好办法。
于是接下来很长一段时间我都是处于这样一个循环中:
- 找面试题
- 回答面试题,挖掘它背后的知识点,写成内容
在这个循环中我逐步发现如果我能把这个东西做大做好,那么一定会是个爆款,毕竟那时候没有竞品,转方向的念头也是这个期间萌发的。后面的事情应该很多读者都晓得了,我把它做成了开源,最后获得了一万六千多的 stars。
在这个做开源的期间,我觉得最重要的可能是费曼学习法了,也就是以教促学。从我不会到我觉得自己会了到最后把自己会的东西写成内容教给别人,那时候的学习途径如下:
- 发现自己不会的点,不管你是从哪里发现的
- 搜索资料,尝试搞懂它
- 写一下代码,验证一下
- 把自己理解的写成文字
- 把自己代入读者,看着自己写的内容是否能学会这个知识
- 多搜索这个知识相关的文章,看看有没有遗漏的
- 在前几个环节你可能还会发现更多自己不会的点,继续循环
整个开源项目我都是这样操作下来的,其中包括了之前我不懂的、懂的、懂的但并不完善的知识,通过以上的学习方法完成了自己的知识梳理及填补漏洞的过程,至今我还一直践行着以上方法论,真的很有效。
项目开源以后,我也顺利了找到了工作,至此完成方向转型。
希望对正在学习,或者转行,大学生的伙伴有所帮助,在学习的路上少走弯路, 从事全栈6年
专门建立的学习q裙851231348 分享学习方法和需要注意的小细节,互相交流学习,不停更新最新的教程和学习技巧(从零基础开始到WEB前端项目实战教程,学习工具,全栈开发学习路线以及规划)
工作中
在工作中学习的这块内容其实之前已经写过,在这里我就直接把精华总结一下:
- 用到的所有技术栈务必用精,没到这个阶段之前别想东想西的这个那个都想学点皮毛,没啥用。
- 了解下市场的热门技术,过时的就别浪费时间学了,顺便也给自己储备点知识,最好学点公司未来可能要用的技术栈。
- 想想看未来怎么在自己的简历上写工作上的亮点,然后尝试着去做。
- 别写完代码就完事了,看看还有没有能调优的地方,这都是你未来能写在简历上的东西,多从未来给简历加分上看齐。
- 学会偷懒,能用脚本做的就让脚本去实现,在这个过程中你就能成长。
- 给自己列点计划在业余中学习。
1年转行资深前端工程师,开源项目过 1k stars,完整学习过程的更多相关文章
- 我发起并创立了一个 Javascript 前端库 开源项目 jWebForm
在线演示地址: ( 在线演示 云平台 由 Kooboo 提供 https://www.kooboo.com/ ) 按钮: http://iwebform.kgeking.kooboo.si ...
- webfunny前端监控开源项目
前言介绍 如果你是一位前端工程师,那你一定不止一次去解决一些顽固的线上问题,你也曾想方设法复现用户的bug,结果可能都不太理想. 怎样定位前端线上问题,一直以来,都是很头疼的问题,因为它发生于用户的一 ...
- 资深前端工程师带你认识网页后缀html、htm、shtml、shtm有什么区别?
每一个网页或者说是web页都有其固定的后缀名,不同的后缀名对应着不同的文件格式和不同的规则.协议.用法,最常见的web页的后缀名是.html和.htm,但这只是web页最基本的两种文件格式,今天我们来 ...
- 淘宝前端工程师:国内WEB前端开发十日谈
一直想写这篇"十日谈",聊聊我对Web前端开发的体会,顺便解答下周围不少人的困惑和迷惘.我不打算聊太多技术,我想,通过技术的历练,得到的反思应当更重要. 我一直认为自己是" ...
- (转)国内外优秀的Web前端工程师
1. 国内外优秀的Web前端工程师 寻找Github.微博.知乎等技术社区上比较活跃.影响力大的圈内大神,供大家膜拜! 视野所限,未必全面,欢迎大家推荐.自荐. 排名不分先后,序号只为标记方便. 提供 ...
- 转发 ----> 2018年阿里巴巴重要开源项目汇总(持续更新中)
转发自segmentfault https://segmentfault.com/a/1190000017346799 前端 1.数据驱动的高交互可视化图形语法 AntV - G2 G2 是一套基于 ...
- android开源项目学习
FBReaderJ FBReaderJ用于Android平台的电子书阅读器,它支持多种电子书籍格式包括:oeb.ePub和fb2.此外还支持直接读取zip.tar和gzip等压缩文档. 项目地址:ht ...
- 我发起并创立了一个 EPWA 的 开源项目
EPWA , 是 Easy PWA 的 意思, PWA 取自于 Google 的 PWA, EPWA 是一个用 C# Cef Html js css 开发 桌面程序 的 架构 ...
- 国内最火的 HTML、CSS、JavaScript 开源项目 Top 榜,你知多少?
对于开发者而言,想要着手前端开发,HTML.CSS 和 JavaScript 是三项必备的基础技能.而如何事半功倍地掌握好这些知识?通过了解当下火热的开源项目不乏为最佳学习姿势.本文盘点国内评分最高且 ...
随机推荐
- Java实现 LeetCode 234 回文链表
234. 回文链表 请判断一个链表是否为回文链表. 示例 1: 输入: 1->2 输出: false 示例 2: 输入: 1->2->2->1 输出: true 进阶: 你能否 ...
- Java实现 蓝桥杯VIP 算法提高 分分钟的碎碎念
算法提高 分分钟的碎碎念 时间限制:1.0s 内存限制:256.0MB 问题描述 以前有个孩子,他分分钟都在碎碎念.不过,他的念头之间是有因果关系的.他会在本子里记录每一个念头,并用箭头画出这个念头的 ...
- Spring基本介绍
一:Spring是什么 Spring是分层的 Java SE/EE应用 full-stack 轻量级开源框架,它以IOC控制反转和AOP面向切面编程为核心,提供了展现层 Spring MVC 和持久层 ...
- Java Review (一、Java开发环境)
@ 目录 Java程序运行机制 高级语言运行机制 编译型语言 解释型语言 Java运行机制和JVM 编写 编译 运行 Java开发工具包 JDK JRE JDK.JRE与JVM HelloWord 编 ...
- iOS -实现imageView中的button响应点击事件的方法
<pre name="code" class="cpp" style="font-size: 13px;">/** imagev ...
- k8s学习-文档&概念
1.文档大全 kubernetes objects文档(yaml文件编写): https://kubernetes.io/docs/concepts/overview/working-with-obj ...
- 小师妹学JavaIO之:MappedByteBuffer多大的文件我都装得下
目录 简介 虚拟地址空间 详解MappedByteBuffer MapMode MappedByteBuffer的最大值 MappedByteBuffer的使用 MappedByteBuffer要注意 ...
- HTML的简介和历史发展过程
HTML的简介和历史发展过程 前言 这次写一篇对于HTML以及CSS的简介,平常我们大家都知道的编程语言有很多种,比如Java.C++.Python等等,每种编程语言都有其独具的特色,不论是语法格式还 ...
- 2019-02-09 python爬取mooc视频项目初级简单版
今天花了一下午时间来做这东西,之前没有自己写过代码,50几行的代码还是查了很多东西啊,果然学起来和自己动起手来完全是两码事. 方案:requests库+正则表达式提取视频下载链接+urlretriev ...
- Mac 电脑查看 pkg包的安装路径
pkgutil --pkgspkgutil --infopkgutil --files