前端技术学习路线：

　　1.html+css

　　2.移动端布局

　　3.js+jq

　　4.ajax+git

　　5.vue+react

　　6.微信小程序

　　7.选学node.js

　　总结一下就是：

　　1.       前端页面重构，写一些页面，电脑、手机、平板都能用。

　　2.       前后端网页交互。

　　3.       Node.js+前端框架，成熟的技术能够大幅度提高工作的效率。

　　主要的前端技术：

　　1.css布局基础知识(rem、viewport(vw vh)、less / sass、清除浮动、BFC、自适应/响应式布局、如何实现纵横比布局、flex理解和用法等...)

　　2.JS语言基础知识(继承都有哪些方法、什么叫闭包及应用场景、函数防抖&函数节流、异步promise、async/await、xmlHttpRequest / ajax / fetch / axio请求数据、文件及二进制数据操作、TypeArray、websocket详细知识、canvas一些api知识、正则表达式等...)

　　3.常用框架(vue、vue-router、vuex、react、react-router、redux、mobx、mobx-state-tree、elementUI、iVeiw、materialUI、Ant Design等...)

　　4.测试框架(jest、mocha等...)

　　5.构建与部署(webpack、gulp等...)

　　6.Git版本控制使用(git基础命令，GitHub Actions工具等...)

　　7.动画相关知识(css animator 、requstAnimationFrame、动画库等...)

　　8.算法知识相关内容(冒泡排序、快速排序、各种排序、字符串模糊查询等...)

　　进阶的前端技术：

　　1.多端小程序(微信小程序基础开发、公众号jssdk、Wepy、Taro、mp-vue、等...)

　　2.数据可视化(Echart、D3等...)

　　3.Native App原生开发(react navtive、flutter等...)

　　4.eletron(桌面开发)

　　5.微前端知识(多项目共同组件、多项目通信、多项目集合等...)

　　6.视频直播相关(WebRTC、ffmpeg、rtsp、Rmmv直播等...)

　　7.3D开发(webGL、three.js等...)

　　8.设计模式(工厂模式、单例模式、观察者模式、订阅模式等...)

　　9.SEO搜索相关知识(sitmap、roobot、关键词密度工具、模拟蜘蛛工具、预渲染/无头浏览器/Puppeteer、Nuxt、Next服务端渲染等...)

　　10.pwa相关知识(次要，目前没有太大的需求)

　　11.数据结构知识(队列、栈、链表、集合、hash表、树、图等...)，不过这个是次要的，不用花费太多精力，但是脑中要理解和实战中能够运用。

　　以上就是一个简单的梳理，如果自学费力可以考虑报前端培训班。拿不定主意可以移步我们官网看看，上面有很多免费在线课程资源。