自学前端,学多久可以入职前端工程师

假如有那么残酷的一天,我不小心喝错了一瓶药,一下子抹掉了我这十多年的编程经验,把我变成了一只小白。我想自学 前端,并且想要找到一份工作,我预计需要 6 个月的时间,前提条件是每天都处于高效率的学习状态当中,并且每天的学习时间至少在 12 个小时以上。

即便是这样,我敢肯定,找到的工作肯定不会太好,勉强能够维持生活吧,毕竟是零基础入门啊。

如果想更进一步,真正成为一名不可或缺的高级前端工程师,时间需要更久,两年、三年、五年,直到秃的那天。

想着想着,我就觉得有必要为那一天做点准备,以备不时之需。

01、第一个阶段,环境和工具准备

  • 准备一台电脑,要能联网
  • 下载、安装 node、npm、webpack、webpack-cli、cnpm,配置前端开发环境
  • 下载、配置MySQL
  • 下载、安装 vscode
  • 准备一个 GitHub 仓库(或者码云),管理前端源代码

前端是一门计算机编程语言,学它的话,连台电脑都没有,学个屁。我有个亲戚家的孩子想学编程,就只看书,家里连台电脑都不配,说什么“先打好理论基础,再实操”,我真的是有点醉。

有了电脑,还得联网,自学的过程中肯定会遇到很多问题,遇到问题的时候先问搜索引擎,推荐谷歌和必应;实在没有答案的话,也可以来找我,申请加入技术交流群,问问群里面的大佬们。

千万不要使用记事本编写源代码了,对于小白来说,时间是宝贵的,记事本只适合大牛们用来装逼,不适合小白用来编程(入门),纯浪费时间。

有了 vscode,后面学习源码的话,就会方便很多。

为什么还需要 GitHub 仓库或者码云仓库呢?它们可以用来在线云同步源代码,防止版本丢失。学到最后,还可以形成一套自己的工具库,轮子就有了,上班的时候工作效率就会高很多,能直接用的代码再也不用重新写了。

02、第二个阶段,前端基础入门

1)HTML

  • 常用标签
  • 锚点
  • 列表标签
  • 表单标签
  • 表格标签
  • 标签分类
  • 标签语义化
  • 注释
  • 字符实体

2)CSS

  • CSS介绍
  • 全局样式
  • 行内样式
  • 内联样式
  • 选择器
  • 字体样式值
  • 文本样式值
  • 颜色样式值
  • 盒模型
  • 控制台使用
  • 清除默认样式
  • 盒模型居中
  • 浮动
  • 定位
  • 外边距塌陷
  • 标准文档流
  • 行内块元素
  • 多种伪类元素
  • 块元素
  • 行内元素

3)javascript初阶

  • 变量和运算符
  • 逻辑控制
  • 数据类型基础
  • Math类
  • 函数
  • 定时器
  • Array类
  • String类
  • Date类
  • Object类

4)JavaScript进阶

  • JavaScript DOM基础
  • this
  • 事件
  • 事件流
  • JavaScript BOM 基础
  • call&apply&bind
  • 自定义属性
  • 面向对象编程

5)ES6/7/8/9

  • ECMAScript6简介
  • let和const
  • ES6+的作用域
  • 对象的扩展
  • 函数的扩展
  • 字符串的扩展
  • Symbol
  • Set&Map
  • Promise对象
  • async&awiat
  • 箭头函数
  • 模板字符串
  • rest参数
  • Class
  • Module模块

6)JavaScript高阶

  • 闭包
  • 立即执行函数
  • 惰性函数
  • 插件开发
  • 多人协作
  • 深复制与浅复制
  • 数组扁平化
  • 递归
  • 正则表达式全解
  • 函数防抖
  • 函数节流

7)HTML5

  • HTML5简介
  • HTML5新语法
  • HTML5新语义化标签
  • HTML5新表单元素属性
  • HTML5手机端新事件处理
  • HTML5新增多媒体实战
  • Canvas
  • HTML5地理组件GeoLocation

8)CSS3

  • CSS3新增属性
  • 圆角制作企业级方案
  • CSS3背景属性
  • 过渡动画 transition
  • 变化属性 transform
  • 特效轮播图实战
  • 企业级flex布局实战
  • grid布局实战

03、第三个阶段,前端核心技术

1)bootstrap

  • 响应式
  • 媒体查询
  • 栅格系统
  • 栅格参数
  • 组合模式
  • 列偏移/列排序/自动列
  • 列对齐/列嵌套
  • 文本与颜色
  • 按钮
  • 导航
  • 图文混排
  • 模态框
  • 轮播图
  • 企业级案例讲解

2)移动端

  • 移动端简介
  • 移动端视口约束
  • 移动端flex移动端实践
  • rem
  • vw

3)Ajax

  • AJAX简介
  • AJAX作用
  • 封装AJAX
  • 创建XMLhttpRquest对象
  • 同步和异步
  • AJAX分页

4)jQuery

  • jQuery介绍
  • jQuery链式语法
  • jQuery选择器
  • jQuery核心
  • jQuery工具
  • jQuery事件
  • jQuery事件对象
  • jQuery特效
  • jQuery回调函数
  • jQuery文档处理
  • jQuery筛选
  • jQuery属性
  • jQueryCSS

5)Echarts

  • Echarts概述
  • Echarts使用
  • 坐标系
  • 雷达图/饼状图/折线图

04、第四个阶段,前端进阶升级

1)Webpack

  • Webpack的安装和使用
  • 项目模块打包
  • 静态打包模块器
  • Webpack入口
  • Webpack输出
  • Webpack插件
  • webpack模块

2)vue

  • Vue使用
  • Vue响应式
  • Vue双向数据绑定
  • Vue相关指令
  • vue-resource
  • axios
  • template选项
  • Vue生命周期
  • Vue组件
  • 自定义指令
  • 过滤器
  • computed属性
  • Vue-cli 2.x和3.x 脚手架配置
  • Vue-router
  • Vuex
  • Element UI

3)微信小程序

  • uni-app
  • mpvue
  • 微信小程序注册
  • APPID申请
  • 生命周期
  • 小程序调试
  • 微信小程序框架组件
  • 微信小程序布局框架
  • 微信小程序条件渲染和列表渲染
  • 媒体组件audio
  • 视图容器
  • 网络api
  • 相机api
  • 地图api

4)数据结构和算法

  • uniapp基础
  • uniapp初始化配置
  • uniapp视图模板使用
  • uniapp生命周期
  • uniapp路由跳转
  • uniapp常用组件
  • uniappScrollView的使用
  • uniapp-ui使用
  • uniapp-Vuex使用

我目前是在职前端开发,如果你现在也想学习前端开发技术,在入门学习前端的过程当中有遇见任何关于学习方法,学习路线,学习效率等方面的问题,你都可以申请加入我所在的前端学习交流裙:前面:42137 后面:4697。里面聚集了一些正在自学前端的初学者,转行者,初阶者,里面也有我整理的一些前端书籍PDF、前端面试题、前端开发源码教程等PDF文档书籍教程,需要的话都可以找裙猪获取。

05、第五个阶段,活着最重要

技术是没有终点的,也是学不完的,最重要的是活着、不秃。

零基础入门的时候看书还是看视频,我觉得成年人,何必做选择题呢,两个都要。喜欢看书就看书,喜欢看视频就看视频。

最重要的是在自学的过程中,一定不要眼高手低,要实战,把学到的技术投入到项目当中,解决问题,之后进一步锤炼自己的技术。

自学最怕的就是缺乏自驱力,一定要自律,杜绝“三天打鱼两天晒网”,到最后白忙活一场。

高度自律的同时,要保持耐心,不抛弃不放弃,切勿自怨自艾,每天给自己一点点鼓励,学习的劲头就会很足,不容易犯困。

技术学到手后,找工作的时候一定要好好准备一份简历,不要无头苍蝇一样去海投简历,容易“竹篮打水一场空”。好好的准备一下简历,毕竟是找工作的敲门砖。

拿到面试邀请后,在面试的过程中一定要大大方方,尽力把自己学到的知识舒适地表达出来,不要因为是自学就不够自信,给面试官一个好的印象,面试成功的几率就会大很多,加油吧,骚年!

你可能感兴趣的:(自学前端,学多久可以入职前端工程师)