栈内技术

前端工具

• Git
  • Git 基本操作
  • GitFlow
• VScode
• Chrome Dev Tools
• Npm yarn pnpm
• APIfox

编程知识储备

• 浏览器基础

  • 计算机网络

  • 浏览器渲染原理
    

    

  • 跨域

  • 浏览器存储

• 数据结构

  • 堆栈、队列、数组
  • 链表、树、图

• 算法

  • 排序算法、去重
  • 递归、回溯

• 设计模式
  

  
  • 设计模式基础
    • 单例模式、工厂模式、发布订阅模式
  • 设计原则

• 编程思维

  • 面向对象
  • 切面编程
  • 函数式编程

HTML

HTML介绍

CSS

• CSS
• Sass

Javascirpt基础

• 书籍
  • 《JavaScirpt 高级程序设计 》
• 基础
  • 基本类型、作用域、原型链、继承、This、闭包
  • 异步、事件循环、事件流 、深拷贝、浅拷贝
  • BOM、DOM
  • Ajax、Promise
  • es6 let/const/var
  • 微任务/宏任务
• 安全
  • XSS

Javascirpt 进阶

• 书籍
  • 《JavaScript设计模式》
  • 《你不知道的Javascript 》
• 基础
  • Javascript 核心原理
    • delete 0；删除的是什么

删除的是表达式的结果，如果delete 运算发现它的操作数是“值/非引用类型”就直接返回true

• 可视化

  • Echarts
  • Threejs
  • Openlayer
  • 高德地图

• 工具

  • lodash、dayjs、

• 移动端

  • H5
  • UniAPP
  • 小程序

框架

• Vue
  • Vuex
  • Vue-Router

服务端

• Nginx
  • 跨域
  • 缓存、gizp、
  • 负载均衡
• linux

前端工程化

• 工程化基础
  • AST
• 部署流程
  • 代码检查
  • 压缩合并
  • 文档输出
  • 项目构建工具

    • Webpack

      • webpack -vite 原理的区别

    • Postcss

• 代码组织
  • 组件化
  • 模块化
  • 微前端
    • qiankun
• 代码规范
  • 前端规范
  • Vue2组件编码规范
• 高质量
  • 代码质量
    • 检查清单
  • 监控
  • 性能优化
    • 雅虎军规
    • 代码编写阶段
    • 工程构建阶段
    • 浏览器渲染阶段

软实力

• Markdown
• PPT
• 流程图

栈外技术

产品

• 工具
• 思维模型

UI

• 组件库设计

后端知识体系

测试

运维

项目经理

工程经验

解决方案

• 技术选型

• 架构设计

  • 架构图设计
  • 技术文档编写

• 性能优化

• CI/CD

• 日志监控

• 系统测试

• 国际化

• 中台

• 多页面

软实力

• 学习的方式
• 解决问题的方式
• 沟通的方式
• 做事的风格
  • 高效
  • 明确目标

带人做事

管人

招聘

• 招聘要求

• 面试

• 设置考核点

  • 了解候选人
  • 考核技术
  • 考核管理
  • 团队介绍
  • 需求是否匹配

带新

• 入职
• 熟悉业务
• 自我展示
• 自我成长

考核

• 技术考核
  • 1、接到任务后，记得明确大概时间
  • 2、需要反馈阶段性的成果情况，及时沟通情况，目标无偏差，无发散。
  • 3、明确演示用例，确定演示用例能达到讨论的需求
  • 4、记录过程，可分享

培养

团队

• 管/带
  • 管：我不懂，但你懂，你得把这个事儿做好；
  • 带：你不懂，我懂，但我希望你把这个事儿做好；
• 目标
  • 明确目标
    • 提供模板方案
    • 允许创新和发散
  • 提问
    • 引导思维
    • 经验分享
  • 阶段验收
• 1+1 >2
  • 发挥擅长
  • 团队提升

业界发声

• 开源
• 分享
• 文章
• 团队

做事业

解决方案

数字孪生![城市数字孪生技术架构.png]

物联网

数据中台

技术中台

后台管理系统

Apass