2024年Web前端最新前端项目负责人在项目初期需要做什么？，2024年最新350道Web前端面试真题分享-CSDN博客

本文链接：https://blog.csdn.net/2301_77595001/article/details/138738938

学习笔记

主要内容包括html，css，html5，css3，JavaScript，正则表达式，函数，BOM，DOM，jQuery，AJAX，vue等等

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

HTML/CSS

**HTML：**HTML基本结构，标签属性，事件属性，文本标签，多媒体标签，列表 / 表格 / 表单标签，其他语义化标签，网页结构，模块划分

**CSS：**CSS代码语法，CSS 放置位置，CSS的继承，选择器的种类/优先级，背景样式，字体样式，文本属性，基本样式，样式重置，盒模型样式，浮动float，定位position，浏览器默认样式

HTML5 /CSS3

**HTML5：**HTML5 的优势，HTML5 废弃元素，HTML5 新增元素，HTML5 表单相关元素和属性

**CSS3：**CSS3 新增选择器，CSS3 新增属性，新增变形动画属性，3D变形属性，CSS3 的过渡属性，CSS3 的动画属性，CSS3 新增多列属性，CSS3新增单位，弹性盒模型

JavaScript

**JavaScript：**JavaScript基础，JavaScript数据类型，算术运算，强制转换，赋值运算，关系运算，逻辑运算，三元运算，分支循环，switch，while，do-while，for，break，continue，数组，数组方法，二维数组，字符串

image.png

架构相关

image.png

这一部分主要是为了能够给予业务，满足业务的情况下设计书写出技术架构图。前面三个是为了能够做好技术架构的基础信息了解。

如何书写架构方案

这个其实我个人也没有很好的方法论。贴两张以前画过的图：

image.png

但是到底技术架构图的标准是什么？

下面这些条件是公司大佬【阿里p8】和我过技术架构图【上面第二张图】反馈给我的。

• 技术架构：上面图主要表现的是技术架构• 业务边界：针对不同的业务场景，边界清晰，走不通的业务架构• 业务架构：针对具体的业务场景进行技术支持。例如我们遇到pos离线的场景，这属于业务架构• 动态流程：业务流程 pos 下单，查商品商品流程如何在架构图体现【缺失】• 集成架构：其他系统集成• 部署架构：部署

技术相关

image.png

脚手架

技术选型 & 脚手架选型

这里主要是做技术选型和脚手架选型。因为我们相对统一，所以基本没这个问题。

系统模块处理

这里是列举了三个例子

• 权限• 多页签• 登陆校验

公共模块处理

• 公共方法：公共方法的放置• 公共枚举值：可参照用dumi发布一个用于处理枚举值的npm包[2]• 公共service：数据接口处理• 公共组件：位置放置和规范【也可通过dumi发布公有包或者私有包参照：用react手写一个简单的日历[3]】

技术调研 & 技术落地

疑难问题的技术调研和技术落地方案。

• 以前做过：react - 多页签页面缓存[4]• 现在在做：electron 做pos【js控制打印机，js加载动态库dll适配ic卡等等】

业务开发demo

这是为了最大化的解决项目当中初级开发的开发问题。

• 代码demo：业务开发的demo代码• 开发讲解：同步讲解demo的开发模式• 文档说明：沉淀文档说明

任务划分相关

image.png

这里的内容就不多说了，以前的文章提到过一些：前端项目负责人需要具有的能力[5]。

根据阶段目标check任务排期是否合适

这里着重提出来，是和团队相关部分提到的阶段目标有关系。需要和阶段目标契合，这样在一个时间段，我们项目整体协作出来的东西才是完整的东西。

规范相关

image.png

开发规范

• 代码规范• 协作流程• 提交规范

内部协同规范

• 早会• 周会• 下发任务沟通：下发任务明确，讲清楚技术重点难点，开发人员了解并确认。• 完成任务汇报：任务完成及时汇报，更多是通过项目管理工具完成。• 疑难问题协同

文档规范

• 相关文档汇总地址• 技术文档• 规范文档• 周会文档汇总

前端部门相关

image.png

协作相关

====

image.png

与产品

image.png

统一原型规范

这里着重说明：统一原型规范，就是原型的输出同样的交互页面风格要保持统一，不允许有很大差距。

image.png

• 原型输出不像一个系统• 代码开发内耗

与后端

image.png

统一前端后共识

image.png

这里着重说明：前后端对于一些事情处理需要达成共识，这样会节省很多沟通问题。

最后

javascript是前端必要掌握的真正算得上是编程语言的语言，学会灵活运用javascript，将对以后学习工作有非常大的帮助。掌握它最重要的首先是学习好基础知识，而后通过不断的实战来提升我们的编程技巧和逻辑思维。这一块学习是持续的，直到我们真正掌握它并且能够灵活运用它。如果最开始学习一两遍之后，发现暂时没有提升的空间，我们可以暂时放一放。继续下面的学习，javascript贯穿我们前端工作中，在之后的学习实现里也会遇到和锻炼到。真正学习起来并不难理解，关键是灵活运用。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

css源码pdf