这是最近整理的一个进阶高级web工程师的技术栈

同时也是激励自己每天来看一下离真正的王者还有多少距离!

过段时间再来反思一下自己进步了多少?

------------------------20190618------------------------------

首先html和css就不说太多了,直接来说vue

-------VUE-------

1.熟练vue语法,以及各种指令

2.用vue写一个简单的网页

3.深入研究vue的组件化

4.研究element-ui、iView、vant组件库源码

5.写一个自己的表单验证组件

6.熟练掌握vuex的数据管理、数据流设计

7.熟练掌握vue-router:路由跳转、路由守卫、路由鉴权

8.用vue写一个blog管理的小项目,包含登录注册

9.学习typescript,深入研究vue的源码

10.vue性能优化

11.最终能自己写出一个迷你的vue,js

------React.js-----

1.入门:JSX、虚拟dom

2.组件化:context、ant-design、高阶组件

3.写一个自己的表单验证组件

4.熟练掌握:redux、react-router、umi、dva

5.用react写一个小型商城项目,包含登录注册商品列表购物车等

6.服务端渲染ssr、next.js

7.react性能优化

8.深入研究react源码

---------Node.js--------

1.入门:异步、io、fs

2.nodeweb开发:koa2、router、eggjs

3.了解express,写个简单小项目

4.鉴权:cookie、jwt、oauth

5.数据库:mysql、redis、mongodb

6.构建一个自己的mvc框架

7.构建自己的koa、中间件

8.深入学习linux操作命令、pm2、nginx、docker

--------微信公号和小程序-------

1.nodejs对接微信服务器

2.公众号客服机器人

3.jssdk

4.小程序实战

5.小程序常用组件

6.小程序常用jsapi

7.taro开发跨端应用

8.云开发

9.写一个微信小程序

------------前端安全------------

1.安全漏洞

2.xss

3.csrf

4.sql注入

5.安全攻防

6.爬虫对抗

7.持久化攻击

8.加密

-----------react-native和flutter------------

1.掌握RN语法

2.RN第三方组件

3.flutter

4.用这两种框架各写一个小项目

----------工程化---------

1.webpack常见配置

2.webpack性能优化

3.手写webpack

4.gulp常用配置

5.手写gulp

6.深入研究vue-cli源码

6.构建一个自己的脚手架

--------------性能优化-------------

1.性能指标

2.性能化军规

3.文件加载更快:打包、压缩、缓存

4.代码执行更快:防抖、节流、vue性能优化、react性能优化

------------------算法和数据结构-----------------

1.算法基础知识

2.复杂度

3.搜索二分查找

4.排序:快速、冒泡、

5.数据结构:链表、树、图

-------------------设计模式-------------------

1.设计模式基础

2.面向对象

3.单例模式

4.装饰器模式

5.代理模式

6.观察者模式

7.设计模式实践

---------------java------------------

1.巩固java基础知识

2.熟悉spring-boot

3.用springboot配合vue开发一个小项目

-----------------git和svn--------------------

熟练掌握git和svn使用方法

全栈高级web前端工程师的必经之路的更多相关文章

  1. 不得不看的秘诀,如何成为一名合格的web前端工程师

    何为:前端工程师? 前端工程师,也叫Web前端开发工程师.他是随着web发展,细分出来的行业. Web前端开发技术主要包括三个要素:HTML.CSS和JavaScript! 它要求前端开发工程师不仅要 ...

  2. 一个Web前端工程师或程序员的发展方向,未来困境及穷途末路

    如果你刚好是一个Web前端工程师,或者你将要从事web前端工作.你应该和我有同样的感慨,web前端技术到了自己的天花板,前端工作我能做多少年?3年或5年?自己的职业规划应该怎么样?收入为什么没有增长? ...

  3. WEB前端工程师如何做职业规划?

    对于一个WEB前端的职业规划,其实是有各种的答案,没有哪种答案是完全正确的,全凭自己的选择,只要是自己选定了,坚持去认真走,就好.在这里, 我只是 简要说一下自己对于这块儿内容的理解.有一个观点想要分 ...

  4. 能自学成为WEB前端工程师吗?

    自学是大家学习一门it技术的时候,都会首先考虑的一种学习方式,web前端开发学习也是一样,但是自学web前端也是让大家充满疑问的一种学习方 自学是大家学习一门it技术的时候,都会首先考虑的一种学习方式 ...

  5. 想转行做web前端工程师,必学这6大技能

    web前端工程师是近几年才发展出来的新兴职业,也是目前火爆且高薪的职业.大需求的市场环境下,出现了越来越多的人群转行做web前端工程师,如设计师.后台程序员.网虫.大学其他专业.策划.编辑等等. 要学 ...

  6. 小白到web前端工程师需要学习哪些知识?

    随着web3.0时代,那么web前端开发技术人才越来越吃香,而且web前端领域划分越来越细,对技术的需求越来越高,想学习web前端的人也是越来越多.那么,如何学习web前端知识?从哪开始?转型成为we ...

  7. 想转行做web前端工程师,必学这5大技能!知道是那些吗?

    web前端工程师是近几年才发展出来的新兴职业,也是目前火爆且高薪的职业. 大需求的市场环境下,出现了越来越多的人群转行做web前端工程师,如设计师.后台程序员.网虫.大学其他专业.策划.编辑等等. 要 ...

  8. Web前端工程师成长之路——知识汇总

    一.何为Web前端工程师?          前端工程师,也叫Web前端开发工程师.他是随着web发展,细分出来的行业.Web前端开发工程师,主要职责是利用(X)HTML/CSS/JavaScript ...

  9. Web前端工程师成长之路

    一.何为Web前端工程师?        前端工程师,也叫Web前端开发工程师.他是随着web发展,细分出来的行业.Web前端开发工程师,主要职责是利用(X)HTML/CSS/JavaScript/D ...

随机推荐

  1. HTML基础标签图片文本超链接列表表格介绍

    1.HTML基础标签图片常见代码形式<img src="图片路径地址" alt="属性名" title="占位符">常见的图片格 ...

  2. viewpage+RadioButton+Fragment简单导航界面

    https://blog.csdn.net/qibanxuehua/article/details/47333879

  3. 《手把手教你构建自己的 Linux 系统》学习笔记(7)

    目录 tee 命令的缺陷是什么?如何解决这个缺陷? /etc/ld.so.conf 文件的作用是什么? 动态链接和静态链接有什么不同? 动态编译 静态编译 共享库为什么会有版本?共享库的版本升级原理是 ...

  4. 浏览器对象模型“BOM”-- window对象

    global对象 全局对象 所有的全局变量和全局方法,都可以归在window上 <!DOCTYPE html> <html lang="en"> <h ...

  5. css3神奇的圆角边框、阴影框及其图片边框

    css3圆角,建议IE10以上 如果border-radius 单位是百分比,则参考为自身宽高,因此当宽高不一致时,圆角为不规则形状 如果border-radius 为50%,则为椭圆:当宽高一致时, ...

  6. TotalUninstall6破解步骤卸载软件更彻底更专业

    软件包分享,这里使用的是6.24版本 链接:https://pan.baidu.com/s/1aVd6bclk5A6puyWBfAOA2A提取码:mhl9 接下来开始安装 安装步骤: 点击安装.基本上 ...

  7. 安卓自定义View实例-----跟随手指移动的鸟

    今天学习了一些安卓开发中的自定义布局,编写了简单一个实例,“跟随手指移动的鸟”,需要两张图片,背景图片和鸟的图片,鸟的图片可以在屏幕中跟随手指的移动而移动. 1.将两张图片导入到mipmap中: 2. ...

  8. 轻量级RPC设计与实现第一版

    什么是RPC RPC (Remote Procedure Call Protocol), 远程过程调用,通俗的解释就是:客户端在不知道调用细节的情况下,调用存在于远程计算机上的某个对象,就像调用本地应 ...

  9. WebApp开发-Zepto

    zepto.js自己去官网下载哈. DOM操作 $(document).ready(function(){ var $cr = $("<div class='cr'>插入的div ...

  10. typescript-环境搭建

    这个环境比较简单 搭建 TypeScript 开发环境 什么是 compiler? less 编译器:less EcmaScript 6 编译器:babel TypeScript 编译器:typesc ...