前端项目负责人最基础的需要会哪些
共 2599字,需浏览 6分钟
·
2021-07-14 17:57
1. 写在开头
之前给团队分享一下前端技术体系,顺便说一下基础能力范畴指哪些东西,分为技术能力和软能力。下面列的东西也有许多我自己不擅长的地方,但是还是会列一下,也是目前自己能想到的技术体系结构。
技术能力图
![](https://filescdn.proginn.com/54f66ef6d59d7d23676451059013c5f8/fc4b58acc70b423a864cfe13436741d3.webp)
软能力图
具体可查看文章:前端项目负责人需要具有的能力
![](https://filescdn.proginn.com/450d51e9c9c89a10c1401b8a2f318bf9/79011443dbd4c593da36ff7d55e133b1.webp)
2. 为什么强调基础能力?
基础能力是技术能力发展的基础。举几个例子可能会比较清楚。
基础知识和react的关系
![](https://filescdn.proginn.com/7bef5c4319a2e1fc828437f67e4b8f4a/c45f9ae228f60b67ccfc396bb1b10c03.webp)
基础知识和算法的关系
![](https://filescdn.proginn.com/10dab63ebd51be4ca50ae2f985f0f417/cf3d8523d000dfa49175b2b8c02592e9.webp)
性能优化和基础知识的关系
![](https://filescdn.proginn.com/b4cab2e8c11602f654d2fa2a648f38f7/e245c7362bc65839bc7dc438d166fc67.webp)
3. 基础技术能力
这里学习这些知识是为了后面更好的发展,打好基础是关键。
![](https://filescdn.proginn.com/05f889da4a14cccf911fb599da7a1cc3/ac1e33cadd95a63f4762eea0d02f2bd2.webp)
3.1 基础知识
![](https://filescdn.proginn.com/ff2bdb31ff3730330b6ffc4c08320f5f/0b47d425f329dcf37ef45a50519c1a22.webp)
3.1.1 html
语义化 html元素 文档元数据
3.1.2 DOM
节点 html属性和dom属性的不同 属性 访问 事件
3.1.3 javascript
js数据类型 &包装对象 内置对象 字符串方法 数组方法 对象方法 运算符操作 原型 继承 作用域链 执行上下文 闭包 this 立即执行函数表达式 call / apply / bind new 深浅拷贝 event loop 正则 事件 ajax 文件同步异步加载 ES6+ 事件 ajax 文件同步异步加载 ES6+
3.1.4 css
css引入 选择器 选择器优先级 继承 值和单位 文本属性 盒子模型 视觉格式化模型 VFM BFC & IFC position float flex 布局 层叠上下文 less / scss
3.1.5 http
http请求过程及http状态码 session / cookie / localStorage / sessionStorage get / post / restful 规范 http协议 / OSI七层模型 / TCP-IP五层模型 DNS 分析 TCP分析 / 三次握手 / 四次挥手 Header
3.2 应用层
![](https://filescdn.proginn.com/e0c21ab5c53342c5580f7538012ef667/589e340f0d830655b538109cc5cffdd9.webp)
3.2.1 node
这里不多赘述了,这个不太熟悉
3.2.2 webpack
入门了解 &核心概念 配置 实战方面 优化 原理
3.2.3 微信公众号
公众号开发流程 / 部署流程 授权 支付扫码 推送场景
3.2.4 微信小程序
开发环境搭建 文件组成 / 声明周期 / 全局变量 / 公共设置 / 导航栏处理 组件使用 小程序在android和iphone上的不同 部署发布
3.2.5 Typescript
TypeScript是什么 TypeScript和javascript的区别是什么 TypeScript 功能拆分 如何开始使用TypeScript TypeScript和webpack的关系 TypeScript和react的关系 TypeScript和Eslint的关系
3.2.6 环境部署
nginx docker部署 nginx环境 客户端渲染打包部署 服务端渲染打包部署 docker + nginx + cicd 环境部署
3.3 框架
框架具体还是看用的是什么,这里主要说react。
![](https://filescdn.proginn.com/cbc91fd330487cc0e2e59f832913442e/ea98832a63e28cf71841590f2709cae8.webp)
react
初步了解 &上手开发demo 核心概念 高级指引 API 使用 react hooks redux react-router 场景应用 源码学习 & 了解
3.4 高级应用
![](https://filescdn.proginn.com/23e089b7db0862f9948724e3f5ee5ca0/2abb29e4a8dff17e491e1e3d4f0279f8.webp)
3.4.1 数据结构
数组 栈 队列 链表 图 树 堆 散列表
3.4.2 设计模式
设计原则 常见设计模式 设计模式运用
4. 为什么强调软能力提升?
软能力我认为是一个人能达到多高的顶点的很重要的一个因素。举个简单的例子,学习能力就是软能力,是我们获得知识的方式。
4.1 逻辑分析能力
因为软能力很重要,举一个之前说过的例子:逻辑分析能力的重要性。
百度百科 逻辑思维能力是指正确、合理思考的能力。即对事物进行观察、比较、分析、综合、抽象、概括、判断、推理的能力,采用科学的逻辑方法,准确而有条理地表达自己思维过程的能力。
逻辑能力不仅仅是用来解决开发当中的问题,可以用到很多东西上面。以之前写的文章作为例子结构化思维-MECE分析方法。在项目当中,分析业务需求,思考代码逻辑,解决问题能力提升都和逻辑分析能力密不可分。并且可以在日常工作中去提升逻辑分析能力。而且逻辑分析能力的建立,是一种方法论的东西。
![](https://filescdn.proginn.com/432d1729290d2c7ab0628699d1449e10/11c95a9c6d87b85f04dad65462a141f2.webp)
4.2 工作当中可以并且需要提高的能力
我们在工作中其实是可以培养很多的能力的。只是我们自己没有在意这些,总是认为这些不重要。
每个人都想晋升,都想成为leader,或者大牛。假设毕业三年,五年想要达到中级,高级,或者项目负责人,或者部门负责人。
这里会有一个问题?能力到了没?
当然可以说等到了位置在去磨练,也不是不行,那为什么不在现在的阶段就去打好以后成为负责人的基础呢。我们再把上面的图拿下来看一下:
![](https://filescdn.proginn.com/450d51e9c9c89a10c1401b8a2f318bf9/79011443dbd4c593da36ff7d55e133b1.webp)
我最近有两个毕业一两年的同学主动找我沟通了一下。问题主要是方向问题。
我给与的答案是:不要认为现在的工作没啥意思,感觉学不到东西,其实是你们没有意识到而已。
举个简单例子:对于日常工作,是不是可以对于业务流程去画流程图分析,锻炼自己的逻辑梳理能力,慢慢锻炼出来,后面会有逻辑分析能力,再往后结构化分析问题,这不仅是对日常任务,对于问题解决,还是掌握新的技术,都可以用这个方法处理。
而且过程当中,沟通能力,协作能力,业务能力,技术能力,规划能力都可以锻炼。
从工作中持续提高自己各方面的不足。等到了时间自动会达到对应的等级。如果现在不注意,总有一天是需要还债的。
要认识一个道理,能力到了,我们才会到了对应的等级。
5. 基础的软能力
逻辑分析能力 -> 规划能力 沟通能力 协作能力 业务能力 框架能力 心态能力
6. 延伸的软能力
判断能力:基于技术能力,业务能力和规划能力 架构能力:也是基于技术能力和业务能力 心态能力:这个很重要,在于如何处理面临问题,如何自己释放压力,调整情绪
7. 写在最后【毒鸡汤】
持续学习 工作中提升 明确自己的方向
这个过程当中很多需要自己主观上的改变,过程会有一点辛苦,在这里毛遂自荐一下自己的对于工作和学习上的困难的理解。
今天遇到的困难越多,不代表明天没有困难,而是明天遇到的困难,就会是后天或者更加往后遇到的困难
这句话可能稍显前方的路有点艰难,我总是把现在遇到的困难当成锻炼自己的机会,勇于尝试,就算现在失败了, 以后在遇到的时候,我就多了失败的资本,肯定会比现在更好的处理遇到的困难。