• 欢迎访问新概念博客,研究javascript,css3,html5,nodejs,Ext js等技术研究,推荐使用最新版火狐浏览器和Chrome浏览器访问本网站,欢迎加入新概念博客

前端最实用书签,web技术提升导航【看完可以提涨薪啦】,面试轻松搞定

欣赏 新概念 来源:火狼 5个月前 (03-12) 308次浏览 0个评论 扫描二维码

前言

前端这几年发展很快,是时候将前端知识形成一个知识图谱,看下有哪些是知道的和不知道的;
通过这篇文章,我们对前端一定会有一个系统化的认识;
书签地址,欢迎 star, 可以直接 git clone 下来,通过 Google 右上角的书签–导入书签,这样看起来就不要太方便。

总体图谱

先来张总的图谱,看哈总体的内容

前端最实用书签,web技术提升导航【看完可以提涨薪啦】,面试轻松搞定

1.JS

1.1 中级

ES6、ES7、ES8、ES9、ES10 新特性 1
ES6、ES7、ES8、ES9、ES10 新特性 2
Promise,Generator,async 和 await

函数继承
对象基本用法
数组操作方法
其他数据类型
正则教程

Ajax 原理和几种工具类

数据结构与算法

Http 缓存
Http 1.x 2.x 区别
Https

浏览器存贮

前端 XSS,CSRF,点击劫持攻击

1.2 高级

JS 执行机制 1
JS 执行机制 2
JS 事件循环

手写 new
手写 call 和 apply
手写 bind
手写 Promise,Generator,async 和 await
手写深度拷贝
手写节流防抖
手写函数柯里化
手写函数反柯里化
手写 Reduce,Instance Of,Flat

JSON.stringify 高级用法

设计模式 23 种
算法

预防 XSS 攻击
预防 CSRF 攻击

2.CSS

CSS 居中 16 个方法
CSS 技巧 1
CSS 技巧 2
CSS 技巧 3
CSS45 个形状
1px 解决方法

2.图像

2.1 中级

Canvas API
Three.js API
15 个动画库

2.2 高级

Canvas 画时钟
Canvas 画文字粒子
Canvas 画饼图
Canvas 画柱状图
Canvas 画折线图
Three 画飞行者

3.Vue

3.1 中级

Vue API
Vue-Router API
Vuex API
Vue 开发的 36 个技巧
Vue 的 watch 和 computed 对比
Vue 的 extend,mixins,extends,components,install
Vue 3.x API

Vue-Echarts vue 的图表插件
Vue-Quill-Editor 富文本插件
Vue2-Editor 富文本插件
WangEditor 富文本插件
Vue-MdEditor markdown 插件

Element Vue 的 PC 端 UI 组件
Iview Vue 的 PC 端 UI 组件
Ant-Design-Vue Vue 的 PC 端 UI 组件

Vant Vue 的 mobile 端 UI 组件
Nut UI Vue 的 mobile 端 UI 组件

Vue 入门项目
Vue TS 项目
Vue-Element-Admin 序列

Vue 服务器渲染
Nuxt 服务器渲染插件

3.3 高级

Vue 万行源码逐行解析
Vue 源码分模块解析 1
Vue 源码分模块解析 2
Vue 3.x 源码
Vue-Router 源码
Vuex 源码

手写一个 Vue
手写一个 Vue-Router
手写一个 Vuex
手写一个富文本

4.React

4.1 中级

Reacr API
React-Router API
React-Redux API
React 开发的 34 个技巧
Hooks 用法
Umi 基于 React 的框架
Dva 基于 React 的框架

React-Lz-Editor 富文本插件
Viser PC 图表插件
F2 mobile 图表插件

Ant-Design PC 的 UI 组件
Ant-Design-Mobile Mobile 的 UI 组件
Zarm Mobile 的 UI 组件库

4.2 高级

TS 结合 React 的组件模式
React 源码
React-Router 源码
React-Redux 源码

手写一个 React
手写一个 React-Router
手写一个 React-Redux

5.webpack 和 babel

5.1 中级

Webpack API
Webpack4 配置最佳实践
Webpack 手动搭建项目 1
Webpack 手动搭建项目 2
Webpack 各版本的区别
Babel 插件

5.2 高级

Webpack 原理
手写 Webpack

Babel 和 AST
Babel 工作过程
Babel7

6.跨端框架

Weex API 基于 Vue 的跨端框架
Weex UI Mobile 的 UI 组件库

React-Native API 基于 React 的跨端框架
React-Native UI

Taro 可跨多端的框架
Wepy 可跨多端的框架
MpVue 可跨多端的框架
Chameleon 可跨多端的框架
Uni App 可跨多端的框架
Flutter API

5.Git、SVN、Npm

Git 常用命令
Git 原理 1
Git 原理 2

SVN 常用命令
SVN 原理
Git 和 SVN 的区别

npm 用法
npm 技巧

6.Node

6.1 中级

Node API
Expree Node 的框架 API
Koa Node 的框架 API
Egg Node 的框架 API
Deno API
一起学 Node

MongoDB API
MySQL API
Oracle API

Node 企业官网项目
Koa Demo 项目

ServerLess

6.2 高级

Node 源码 1
Node 源码 2
Express 源码
Koa 源码
Egg 源码

手写 Koa
手写 Express

7.IOS

IOS 入门
JSBridge 原理
JSBridge 用法

8.Android

Android 入门

9.面试

前端 100 问
面试手写代码
腾讯前端面试 1
腾讯前端面试 2
百度,有赞,阿里面试
头条面试 1
头条面试 2
微信,头条和阿里面试

9.架构

微前端入门
qiankun 的微前端框架
微前端在美团的实践

前端基建 1
前端基建 2
前端构建优化-腾讯

UI 组件封装
飞冰 可视化编程
鲁班 H5 可视化搭建

性能和异常上报
Vue 项目性能优化
CSS 性能优化
React 项目性能优化
Webpack 性能优化
前端性能优化

10.项目管理

凹凸实验室的项目管理
阿里 leader 具备的素质
阿里的团队规划
代码之余培养的能力


新概念博客 , 版权所有丨如未注明 , 均为原创丨本网站采用BY-NC-SA协议进行授权
转载请注明原文链接:前端最实用书签,web技术提升导航【看完可以提涨薪啦】,面试轻松搞定
喜欢 (1)
[新概念]
分享 (0)
发表我的评论
取消评论
表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址