前端到底有哪些工作内容? - V2EX
V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
sdwill
V2EX    前端开发

前端到底有哪些工作内容?

  •  
  •   sdwill
    geekwen 182 天前 1678 次点击
    这是一个创建于 182 天前的主题,其中的信息可能已经有所发展或是发生改变。

    书接上回,房贷快还完,我定 gap 一下,休息了个把月后,开始慢慢写点文章,分享一下过去对工作的一些总结。


    今天分享一下我在之前的工作中整理出来的一个思维导图,包含了我对前端工作的理解和思考,希望对各位有些帮助,欢迎留言评论,一起探讨。

    what-work-to-do.png

    业务开发

    对于一个程序员最基本的要求是:需要能够按时、按质的完成开发任务。但是怎么按时?怎么按质?

    • 需求理解能力:快速理解产品的意图,需求的背景
    • 逻辑思维能力:找出设计的漏洞,避免后期的返工
    • 界面审美能力:评审 UI 稿和交互时,需要评估是否好实现,是否整洁美观,是否符合使用直觉,符合用户习惯
    • 进度/风险管控:主动规划,及时的反馈,避免延期
    • 代码质量把控:质量绝对优先,时间不够时也要坚持,不能毫无底线
    • 上线流程完善:关注发布、部署流程,提升发版的体验

    业务开发是一项综合性的工作,涉及到多方面。一定要目的性及其明确的去完成每一个需求,尽可能的做到:每做一个需求,都应该让自己对业务更了解一些,让自己的技术运用能力更精进一些,让自己对于项目流程/团队职能之间的协作更默契一些,让自己对产品、界面的设计沉淀更浓厚一些,如此在永无止境得的业务开发中才能不断的提升。

    work-to-much.png

    文档规范

    我想工作过一段时间的朋友都深有体会,看文档或者看代码时,经常会吐槽:这文档、代码写的啥呀。但是真要自己写文档、代码注释的时候,又会有各种借口不写。这就造成了一种怪圈:希望别人提供的内容文档和注释良好,但是在自己的工作中又无法提供这些。

    所以我觉得在业务开发后面,紧接着最重要的能力就是写文档的能力。能够极大的提升团队信息同步,以及协作效率。其实,需要写文档的地方非常的多:

    • 单个项目的工程文档(代码注释包含在内部,具体请看图)
    • 各方面的规范文档
    • 各种通用配置的说明文档
    • 业务基础知识文档
    • 内部技术交流、各种沉淀、踩坑的文档
    • 团队内协作流程规范、团队间的协作流程规范

    写文档不仅能锻炼自己的能力,提升团队的协作效率,还能够培养团队的氛围。所以强烈建议大家在日常开发过程中把写文档作为工作内容一环,在评估工时的时候,加进去。

    work-document.png

    基础建设

    如果能做好前面两点,那就可以尝试去完善基础建设。基础建设做好了,可以提升整个团队的开发效率,包括但不限于:

    • 公共组件、hooks 、方法、css 样式等开发
    • 工程构建流程
    • 工程发布流程

    这一点要做好其实非常的难,最主要的矛盾还是在于业务项目的工作量是否繁重,团队或者公司是否重视基础建设,会把基础建设纳入到日常工作中,甚至考核目标里去。

    项目管理

    这里提到的项目管理,比前面的业务开发进度管理要更进一步。业务开发进度管理,主要是管理自己的进度,而项目管理,需要自己站在整个团队的视角,来把控整个项目的推进进度,不仅要管好自己,也需要去管好其他人,甚至去协调其他部门。这一课题是通往团队管理的必经之路。

    • 关注排期,关注流程,善于发现流程制度的不足,并提出解决方案,促进团队协作的效率
    • 参与甚至主导项目的各个环节,让需求的落地更加高效,让各个职能环节的衔接更加默契
    • 如果有机会,尽量参与到大项目中,或者主导大项目
      • 大项目往往涉及到多个部门,工作流程、信息同步、进度推进都比平常的项目更复杂,更加能锻炼人的能力
    • 及时的反馈,做好信息的同步
      • 建立与所有人同步进度的机制,避免一切延期的风险:如早会、周报等
    • 追赶进度的同时,要想办法确保质量
      • 比如:定期演示进度成果
    • 风险反馈:意外情况及时上报
    • 项目总结会
      • 大家在一起总结工作过程,是否有好的建议在下次大家一起提高

    团队氛围

    团队氛围非常的重要,但是要培养出好的团队氛围,非常的难。因为最关键的其实不是制定什么措施,而是要有对的人,擦出火花。作为团队的一员,要尽可能地做到下面这几点,才能一起让氛围变好:

    • 多发言、多参与、多分享
      • 团队氛围要靠每一个人的参与,如果整个团队只有 1 、2 个人经常发言,那么不会有团队氛围,只会有小圈子
      • 你是团队的一份子,团队是什么样子,你也有发言权,一定要参与进来
    • 主动组织代码评审、技术分享
    • 尽量从参与者变为组织者、主导者

    其实参与到团队活动中去,甚至自己组织团队活动,是非常好的提升自己在团队、公司影响力的办法。我走上管理的岗位,主要也就是靠的这一点,主动去组织各种活动,活跃氛围,提升团队凝聚力。团建如果只是简单吃个饭?真的很没有意思。

    team-celebrate.png 中间两个人竟然多了一条手臂,2333

    技术/通用能力的提升

    在我过去的职业经历中,不管是团队内部谈话,还是面试候选人,我见过不少人工作年限比较久了,但是无论是技术能力还是通用能力,都还停留在中级水平。这很不应该。如果一直吃老本,早晚一天会由于竞争力不足,找不到合适工作的。所以我一直要求自己,每一年一定要有进步,不管在哪个方面。如果没有,就要想办法突破局面,哪怕裸辞。

    下面是我总结出来的一些提升自己的方式:

    • 有自己的技术学习路线/技术学习规划,合理利用时间为自己充电(比如每天抽半小时)
      • 除了多看,还可以多写:定期产出一些文字性的总结,把经验凝练出来,对自己/对他人都有帮助
        • 可以是公开的文章,也可以是内部分享的 PPT 甚至一句话,或者各种类型的文档
      • 所学一定要在业务开发中实际运用起来,通过多次实践,才能化为自己的真实技能
      • 多与其他人进行交流,大胆的提问,大胆的回答问题,相互学习是事半功倍的一种方式
    • 主动的组织代码评审、技术分享把所学通过演讲的形式进行进一步的巩固
    • 经常与其他部门协同的同事沟通,优化工作对接的流程,提升协作效率
    • 定期与自己的直接上级进行沟通,主动反馈工作情况
    • 利用日常工作中各种事务来锻炼自己的各项能力
      • 早会、周会:提升事务的规划,总结能力以及风险预估能力
      • 生活团建(吃饭、唱歌)与工作团建(排节目,公司活动):提升沟通能力,观察能力,交际能力,组织能力
      • 代码评审、技术分享:表达能力,总结能力,感染力
      • 需求评审会议/需求排期会议:产品思维逻辑能力,项目管理能力等

    最后

    如果把前面罗列的点,都比做游戏里角色的属性点的话,10 分是精通,你在这些方面各分配了几个属性点呢?我个人的话觉得自己平均分在 7-8 分的样子。

    最后原图献上。需要源文件的朋友,可以关注我的公众号,回复:前端工程师的工作内容

    前端工程师的工作内容脑图.jpg


    wp

    4 条回复    2025-08-30 18:48:04 +08:00
    murmur
        1
    murmur  
       182 天前
    楼主这什么公司,前端这么专一,我这低代码 OA 、ios 、android 、java 、鸿蒙 arkts 、react 、vue 都做过
    sdwill
        2
    sdwill  
    OP
       182 天前 via Android
    @murmur 你这是全涵盖到了啊,真.大前端。我主要是 vue 和 react 这两块,偶尔涉及到小程序,electron 。在公司内基本上沿着一个产品线走,所以不会有技术线的太大变化。
    iwh718
        3
    iwh718  
       181 天前 via Android
    /div>
    我主要做 RN 以及周边比如 nextjs 。基本上都是在围绕 rn 开发。
    qingyingwan
        4
    qingyingwan  
       110 天前
    我愿称你为传统前端
    关于     帮助文档     自助推广系统     博客     API     FAQ     Solana     3168 人在线   最高记录 6679       Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 28ms UTC 11:52 PVG 19:52 LAX 03:52 JFK 06:52
    Do have faith in what you're doing.
    ubao msn snddm index pchome yahoo rakuten mypaper meadowduck bidyahoo youbao zxmzxm asda bnvcg cvbfg dfscv mmhjk xxddc yybgb zznbn ccubao uaitu acv GXCV ET GDG YH FG BCVB FJFH CBRE CBC GDG ET54 WRWR RWER WREW WRWER RWER SDG EW SF DSFSF fbbs ubao fhd dfg ewr dg df ewwr ewwr et ruyut utut dfg fgd gdfgt etg dfgt dfgd ert4 gd fgg wr 235 wer3 we vsdf sdf gdf ert xcv sdf rwer hfd dfg cvb rwf afb dfh jgh bmn lgh rty gfds cxv xcv xcs vdas fdf fgd cv sdf tert sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf shasha9178 shasha9178 shasha9178 shasha9178 shasha9178 liflif2 liflif2 liflif2 liflif2 liflif2 liblib3 liblib3 liblib3 liblib3 liblib3 zhazha444 zhazha444 zhazha444 zhazha444 zhazha444 dende5 dende denden denden2 denden21 fenfen9 fenf619 fen619 fenfe9 fe619 sdf sdf sdf sdf sdf zhazh90 zhazh0 zhaa50 zha90 zh590 zho zhoz zhozh zhozho zhozho2 lislis lls95 lili95 lils5 liss9 sdf0ty987 sdft876 sdft9876 sdf09876 sd0t9876 sdf0ty98 sdf0976 sdf0ty986 sdf0ty96 sdf0t76 sdf0876 df0ty98 sf0t876 sd0ty76 sdy76 sdf76 sdf0t76 sdf0ty9 sdf0ty98 sdf0ty987 sdf0ty98 sdf6676 sdf876 sd876 sd876 sdf6 sdf6 sdf9876 sdf0t sdf06 sdf0ty9776 sdf0ty9776 sdf0ty76 sdf8876 sdf0t sd6 sdf06 s688876 sd688 sdf86