前端项目负责人最基础的需要会哪些 ╰半夏微凉° 2022-10-09 15:20 123阅读 0赞 # 写在开头 # 最近准备给团队分享一下前端技术体系，明确提升的方向，顺便说一下基础能力范畴指哪些东西，分为**技术能力和软能力**。下面列的东西也有许多我自己不擅长的地方，但是还是会列一下，也是目前自己能想到的技术体系结构。不妥不足的地方还望指正。 第二也是提出目前需要打好的基础能力范畴。 ## 技术能力图 ## ![image.png][] ## 软能力图 ## 具体可查看文章：[前端项目负责人需要具有的能力][Link 1] ![image.png][image.png 1] # 为什么强调基础能力？ # 基础能力是技术能力发展的基础。举几个例子可能会比较清楚。 ## 基础知识和react的关系 ## ![image.png][image.png 2] ## 基础知识和算法的关系 ## ![image.png][image.png 3] ## 性能优化和基础知识的关系 ## ![image.png][image.png 4] # 基础技术能力 # 这里学习这些知识是为了后面更好的发展，打好基础是关键。 ![image.png][image.png 5] ## 基础知识 ## ![初中级开发体系简介.png][.png] ### html ### * 语义化 * html元素 * 文档元数据 ### DOM ### * 节点 * html属性和dom属性的不同 * 属性 * 访问 * 事件 ### javascript ### 这里把我在掘金上写过的一些文章链接贴进来。 * js数据类型 &包装对象 内置对象 * 字符串方法 * 数组方法 * 对象方法 * 运算符操作 * [原型][Link 2] * [继承][Link 3] * [作用域链][Link 4] * [执行上下文][Link 5] * [闭包][Link 6] * [this][] * 立即执行函数表达式 * call / apply / bind * [new][] * [深浅拷贝][Link 7] * [event loop][] * [正则][Link 8] * 事件 * ajax * 文件同步异步加载 * ES6+ ### css ### 这里把我在掘金上写过的一些文章链接贴进来。 * css引入 * [选择器][Link 9] * [选择器优先级][Link 10] * 继承 * 值和单位 * 文本属性 * [盒子模型][Link 11] * [视觉格式化模型 VFM][VFM] * [BFC ][BFC]& IFC * [position][] * [float][] * [flex][] * 布局 * 层叠上下文 * less / scss ### http ### * http请求过程及http状态码 * session / cookie / localStorage / sessionStorage * get / post / restful 规范 * http协议 / OSI七层模型 / TCP-IP五层模型 * DNS 分析 * TCP分析 / 三次握手 / 四次握手 * Header ## 应用层 ## ![初中级开发体系简介 (1).png][_1_.png] ### node ### 这里不多赘述了，这个不太擅长 ### webpack ### * 入门了解 &核心概念 * 配置 * 实战方面 * 优化 * 原理 ### 微信公众号 ### * 公众号开发流程 / 部署流程 * 授权 * 支付扫 * 码推送场景 ### 微信小程序 ### * 开发环境搭建 * 文件组成 / 声明周期 / 全局变量 / 公共设置 / 导航栏处理 * 组件使用 * 小程序在android和iphone上的不同 * 部署发布 ### Typescript ### * TypeScript是什么 * TypeScript和javascript的区别是什么 * TypeScript 功能拆分 * 如何开始使用TypeScript * TypeScript和webpack的关系 * TypeScript和react的关系 * TypeScript和Eslint的关系 ### 环境部署 ### * nginx * docker部署 * nginx环境 * 客户端渲染打包部署 * 服务端渲染打包部署 * docker + nginx + cicd 环境部署 ## 框架 ## 框架具体还是看用的是什么，这里主要说react。 ![image.png][image.png 6] ### react ### * 初步了解 &上手开发demo * 核心概念 * 高级指引 * API 使用 * react hooks * redux * react-router * 场景应用 * 源码学习 & 了解 ## 高级应用 ## ![image.png][image.png 7] ### 数据结构 ### * 数组 * 栈 * 队列 * 链表 * 图 * 树 * 堆 * 散列表 ### 设计模式 ### * 设计原则 * 常见设计模式 * 设计模式运用 # 为什么强调软能力提升？ # 软能力我认为是一个人能达到多高的层次的很重要的一个因素。举个简单的例子，学习能力就是软能力，是我们获得知识的方式。 ## 逻辑分析能力 ## 因为软能力很重要，举一个之前说过的例子：逻辑分析能力的重要性。 > 百度百科 逻辑思维能力是指正确、合理思考的能力。即对事物进行观察、比较、分析、综合、抽象、概括、判断、推理的能力，采用科学的逻辑方法，准确而有条理地表达自己思维过程的能力。 逻辑能力不仅仅是用来解决开发当中的问题，可以用到很多东西上面。以之前写的文章作为例子结构化思维-[MECE分析方法][MECE]。 在项目当中，分析业务需求，思考代码逻辑，解决问题能力提升都和逻辑分析能力密不可分。并且可以在日常工作中去提升逻辑分析能力。而且逻辑分析能力的建立，是一种方法论的东西。 ![image.png][image.png 8] ## 工作当中可以并且需要提高的能力 ## 我们在工作中其实是可以培养很多的能力的。只是我们自己没有在意这些，总是认为这些不重要。 每个人都想晋升，都想成为leader，或者大牛。假设毕业三年，五年想要达到中级，高级，或者项目负责人，或者部门负责人。**这里会有一个问题？能力到了没？** 当然可以说等到了位置在去磨练，也不是不行，那为什么不在现在的阶段就去打好以后成为负责人的基础呢。我们再把上面的图拿下来看一下： ![image.png][image.png 9] 我最近有两个毕业一两年的同学主动找我沟通了一下。问题主要是方向问题。 我给与的答案是：不要认为现在的工作没啥意思，感觉学不到东西，其实是你们没有意识到而已。 **举个简单例子**： 对于日常工作，是不是可以对于业务流程去画流程图分析，锻炼自己的逻辑梳理能力，慢慢锻炼出来，后面会有逻辑分析能力，再往后结构化分析问题，这不仅是对日常任务，对于问题解决，还是掌握新的技术，都可以用这个方法处理。 而且过程当中，**沟通能力，协作能力，业务能力，技术能力，规划能力**都可以锻炼。 从工作中持续提高自己各方面的不足。等到了时间自动会达到对应的等级。如果现在不注意，总有一天是需要还债的。 **要认识一个道理，能力到了，我们才会到了对应的等级**。 # 基础的软能力 # * 逻辑分析能力 -> 规划能力 * 沟通能力 * 协作能力 * 业务能力 * 框架能力 * 心态能力 判断能力：基于技术能力，业务能力和规划能力 架构能力：也是基于技术能力和业务能力 心态能力：这个很重要，在于如何处理面临问题，如何自己释放压力，调整情绪 # 写在最后【毒鸡汤】 # * 持续学习：[学习的重要性][Link 12] * 工作中提升 * 明确自己的方向 这个过程当中很多需要自己主观上的改变，过程会有一点辛苦，在这里毛遂自荐一下自己的对于工作和学习上的困难的理解。 **今天遇到的困难越多，不代表明天没有困难，而是明天遇到的困难，就会是后天或者更加往后遇到的困难** 这句话可能稍显前方的路有点艰难，我总是把现在遇到的困难当成锻炼自己的机会，勇于尝试，就算现在失败了， 以后在遇到的时候，我就多了失败的资本，肯定会比现在更好的处理遇到的困难。 [image.png]: /images/20221005/eefd829d96e54410ad654718178c2beb.png [Link 1]: https://juejin.cn/post/6946210273061502990 [image.png 1]: /images/20221005/ec080cdc79424a4d99c6593446e2ed02.png [image.png 2]: /images/20221005/079f5286221f49429e1fbc2bec39964b.png [image.png 3]: /images/20221005/6c09ef5c825b468d82d929ab6af4b6c2.png [image.png 4]: /images/20221005/689937330b49410f9376710021ae8951.png [image.png 5]: /images/20221005/3cb627c07a0e408abc41322923204ff6.png [.png]: /images/20221005/e30100da4edd4e5ebd911b12c35cb639.png [Link 2]: https://juejin.cn/post/6944715278915731486 [Link 3]: https://juejin.cn/post/6902467368899837966 [Link 4]: https://juejin.cn/post/6961711638978232356 [Link 5]: https://juejin.cn/post/6963603066507493412 [Link 6]: https://juejin.cn/post/6966970905629032456 [this]: https://juejin.cn/post/6969985606709428232 [new]: https://juejin.cn/post/6957250427452669983 [Link 7]: https://juejin.cn/post/6957983885464436772 [event loop]: https://juejin.cn/post/6957523010693627917 [Link 8]: https://juejin.cn/post/6971036721442095111 [Link 9]: https://juejin.cn/post/6942132650060546056 [Link 10]: https://juejin.cn/post/6942788958480760862 [Link 11]: https://juejin.cn/post/6944714103671914509 [VFM]: https://juejin.cn/post/6945089335452827684 [BFC]: https://juejin.cn/post/6951043990183477278 [position]: https://juejin.cn/post/6958694510188560392 [float]: https://juejin.cn/post/6961088231777501191 [flex]: https://juejin.cn/post/6959474262440673288 [_1_.png]: /images/20221005/6a1cc1a1e9ce4fb0aa3912377c832245.png [image.png 6]: /images/20221005/c9f335f8ab2b4bfca6451d0ce22d3eb6.png [image.png 7]: /images/20221005/2599ef9d611b499c8d06e0213c700ca2.png [MECE]: https://juejin.cn/post/6941336368396107806 [image.png 8]: /images/20221005/0d0324d0e2894fa499bf6dde712f2626.png [image.png 9]: /images/20221005/4704e94741414377bd5164324d088998.png [Link 12]: https://juejin.cn/post/6968002742321152014#heading-13
还没有评论，来说两句吧...