经过几年前端开发的经验以后,必然会发现每天工作的内容其实大部分都是类似的,而这个时候往往就会出现迷惘,感觉自己的工作知识技能基本上都停留在一个层次。其实前端是很广泛的领域,我们要学的会有很多,而许多东西未必会出现在工作中,但是一旦需要那又必须得去掌握去开发,因此利用业余时间去学习,看api文档,做demo示例这些是非常有必要的,最好做些自己的项目
本文对当前的自己做个知识总结。
如还有其他哪些需要学习的知识补充,可在下面留言!!!
基础知识
- 计算机网络基础知识 链接
- 数据结构与算法 链接
- js设计模式 链接
- js编译原理 链接
- JavaScript 运行原理解析 链接
- HTML渲染过程详解 链接
- html,css在浏览器渲染渲染原理 链接
- 函数式编程入门 链接
- 前端优化 链接
前端知识
- HTML 教程 链接
- CSS 教程 链接
- less 链接 / sass 链接 两者选其一
- ajax 链接
- fetch 新一代的网络请求方式 ,可以替代ajax 链接
- js (es5) 链接
- js (es6 以及后续的版本) 链接
- ts 现在非常火的一个js超集(许多项目会看到) 链接
- Dom/Bom 以及 对浏览器运行前端项目理解
前端框架技术和相关库
- vue2 相关全家桶
- vue3 相关全家桶 链接
- nuxtjs 一个vue的srr框架 链接
- uniapp(小程序,h5,app一套式开发) 链接
- 微信小程序和公众号h5 原生开发 链接
- 地图-可以完成api基本开发 (随便一个国内地图如高德)
- echarts-可以完成api基本开发(echarts社区图集) 链接
- GIS 和 geoJson 进行自定义地图开发
- 深入一点的3d 相关开发如 D3 、 threejs、 thingjs
- 各种工具如 :腾讯IM 、webpack、git、npm、各种图标库(阿里巴巴图标库)、eslint、vscode
- ui框架(element/vant/uview)
- 微前端 (single-spa、乾坤微前端)
- pc桌面开发项目electron (基于js开发pc桌面应用)
- 各种web相关使用的插件 (vue插件库)(富文本编辑器wangEditor)
- 各种工具(在线工具)
- 走react路线的要学习taro、react系相关库,reactNative
- 最新的serverless
nodejs开发后端相关的库和框架
- nodeJS 基础知识 链接 (nodejs中文社区)
- express (链接)、koa/koa2
- 持久层框架(mongoose) 、(TypeORM)
- 数据库 (MongoDB介于关系数据库和非关系数据库)(MySQL (经典的关系数据库)) (Redis (基于内存亦可持久化的数据库))
- mysql数据库使用工具 navicat
- 经典框架 egg(阿里的) 、midway(新一代后端框架)、nestjs(推荐的新一代后端Nodejs框架)
- linux操作系统基本使用(会安装软件如(mysql),会操作文件,会写启动代码)
- nginx的使用(会写配置内容)
- 各种云,如阿里云,会租服务器,会配置服务器和域名、cdn等
- postman,Fiddler
代码管理和博客相关
- CSDN、博客园、简书、掘金、知乎等
- github是项目代码托管和寻找别人优秀项目的最佳选择
项目工程
- axure (产品原型开发)
- 蓝湖 (ui相关的)
- 禅道(测试相关的)
- gitLab (可以本地安装私有git)
- jenkins(项目构建打包部署)
- docker (项目部署、镜像)
综合
上面整理的各种内容在现在五花八门的库、框架面前算是比较少了,但是也基本上囊括了当前前端常用的以及需要掌握的各种内容。
现在的前端要求越来越广泛,真的是什么都能做,什么都要我们做。综合下来也就app、h5公众号、小程序,pc、桌面、后端nodejs等几个方面
1.基础知识是需要了解的,虽然日常不常用,但是就怕面试官冷不丁的来几个这样的问题
2.前端知识想必开发个一两年该熟悉的都会熟悉,多去回顾回顾就能够完成掌握,其中ts可以配合后面的框架使用
3.至于其他各种内容则看需要学习掌握,合理规划
知识整理与认识
走Vue路线的,首先就是免不了学习(vue + vue-router + vuex/pinia + vite/vue-cli)全家桶系列,不过vue3和vue2之间产生了一些不同开发方式。首先是vuex和pinia这两个储存库、vite和vue-cli两个脚手架,两种选其一各有各的搭配方式,但基本上都要认识能够随意自己去改变去纠正配置,毕竟不知道什么时候会遇到vue2项目呢。vue3的组合式api写法和vue2的选项式写法必须要认识清楚,本质上是一样的。写法不同而已,都要掌握。各种相关库也因此而有不同的调整要使用对应版本即可。
学完vue全家桶就已经可以满足PC端和H5页面的各种内容开发,但是spa这种开发模式常用于后台亦或者一些功能性的项目,对seo等是不和谐的,这个时候要学习vueSSR框架nuxtjs,这个框架很有必要学一学,保不准下一个公司就要开发
关于地图和echarts。这两个日常的api会使用就能够满足日常开发需求,但是有时间深入学习一下也是可以的。包括3d方面的几个库,都是非常有挑战性的,有些公司是需要这种人才的
关于动画特效和canvas相关的内容,这种需要多做各种特效,并且熟悉相关的api使用方式,这样才能够完成许多特殊的效果。有时间可以研究研究
关于视频和直播,现在这个是比较流行的内容,视频直播无非就是要掌握api,能够利用api熟练的操作各种视频内容,同时要深入了解底层,视频流、文件流以及Js相关的文件操作视频操作api等
小程序和h5公众号的原生开发是必须掌握的,作为一个前端,现在基本上要满足小程序,h5公众号和 vue PC端的内容开发。
微前端适用于一些比较大内容或者后台项目比较多的公司,统合所有的项目使用,和微服务类似而已,日常看需要用
最新的serverless,其实看起来高大上,用起来也就这样,前端全栈化,无非就是少了各种配置部署,它全帮你搞定了,自己只需要使用提供的api即可。而数据库方面的设计,其实和moongodb很相似,我怀疑就是用的这个,全程看做json就行,实在不懂学一学moongodb。操作数据方面直接使用提供的api即可,就当多学一个持久层框架呗
关于基于js的后端学习,nodejs的学习最重要的是官网的api,要知道这个东西里面有什么,它安装了之后可以调用哪些东西,如:procee.xxx,fs.xxx得知道这个属于什么内容
express框架和koa/koa2框架是基于nodejs的api上进行一层封装的框架,但是封的比较浅显,没那么多规矩,因此需要各种中间件来辅助才能开发后端。
eggjs可以看作是基于koa之上封装的一种框架,多了一些约定,多了一些功能内容
midway和nestjs就可以看作是一个比较成熟的Nodejs框架,更加适应于后端开发。
知识规划
vue路线前端方面要掌握的内容
- vue2、vue3全家桶 vue + vue-router + vuex/pinia + vite/vue-cli ,同时要熟练两者直接的区别,熟练两者之间切换
- vue相关方面的各种库 element,vant,axios,eslint等常用的东西
- vueSSR项目NuxtJS要掌握
- 掌握uniapp框架以及相关生态库的认识和使用
- 掌握原生小程序和公众号开发(以微信为主)
- 熟悉echarts和地图等api常规使用
最基本的能力要求是能够进行vuePC端开发,vue微信公众号h5开发,uniapp小程序,h5,app开发(简单点的app)、原生微信小程序开发
如果在精通react系那就更完美了
额外学习:桌面应用开发Electron
吐槽一下:现在的vue之类的框架开发app好多坑要踩,复杂多样的app还是少用
学习后端nodejs的路线
- 掌握Nodejs的基础知识看nodejs相关api文档,同时要会区分nodejs和前端js的区别,运行环境不同,拥有模块不同等
- express 、koa、koa2三个基础框架选择认识了解其一,这三个是非常基础的框架,推荐express,学习入门后端nodejs的基础
- midway 和 nestjs 这两个高级框架选其一,推荐nestjs,这个类似spring,用起来舒服
Nodejs的基础知识 ------》 express及相关中间件+mongoose+MongoDB ------》nestjs+typeorm+mysql