草庐IT

小公司的前端建设的一些思考

程序猿布欧 2023-03-28 原文

在之前的企业项目开发中,做过一些前端基础建设和项目推进的工作。
完成项目之后,一直没时间整理和反思在推进过程中,遇到的问题以及解决方案,由于前端团队人员较少,更多的是多人协作以及大家共同攻克一些问题。

工具

前端的编辑器,包括sublime,还有vscode,以及webstorm、atom这类编辑器,发展到现在,vscode成为了目前前端开发的主流编辑器
在团队开发过程中,针对一些固定的插件,需要实现规范和统一。

包括:

tab缩进的大小,以及格式化的插件,例如在vue开发过程中,推荐使用Vetur进行格式化和代码约束,包括代码检查eslint这些工具。

除了统一使用的插件作为规范以外,其他的插件作为个人爱好和习惯使用即可。


项目结构目录

文件夹划分

以vue开发为例:接口api,路由router,状态管理store,组件compoment、工具类utils,建议统一划分到各自的文件夹,明确文件夹的功能,文件命名规范可以参照:vue官方文档-风格指南

文件夹命名可以根据习惯,最重要的是要明确划分功能,确保在开发过程中造成目录混乱


代码编写

javascript

  • 常量大写,规范使用let和const等命令, 变量和方法使用 驼峰or下划线进行命名,
  • 工具类utils和依赖包方法,例如:时间格式化YYYY-MM-DD,统一使用utils中的格式化方法
  • 深拷贝或者节流防抖等方法,根据项目场景封装或者使用lodash,进行统一,混合使用容易增加开发成本。

html&&css

类名使用驼峰或者以 - 作为连接,书写顺序建议以参考腾讯css书写规范

git

  • 默认一条主分支,这个应该是大家在代码维护过程中的共识了
  • 在项目完成第一次上线之后,建议增加一条fix分支作为生产环境bug维护的分支
  • 开发过程中,dev分支的提交,提交信息应该详细且最好是按照提交的类型,是否是fix还是update代码

协作开发

在开发过程中,项目的进度和周期情况都不太一样,同时有些前端开发人员可能是刚进入项目,也有些在项目中呆了比较久,能力也会有所差别,在开发和分配任务时,就需要根据不同的情况进行分配任务。

需要考虑的问题

  • 是否根据个人能力的强弱,分配任务的时候,注重培养还是按照个人擅长的领域去处理擅长的问题。
  • 业务组件和公共组件的编写,是根据分配任务的模块划分还是由某个同学单独去完成
  • 更多问题。。。

文档以及注释

  • 项目的readme.md建议尽可能地完善,不仅仅局限于 安装npm依赖和启动,更应该包含上面所提到:插件规范、一些重要的依赖项、node版本等
  • 代码注释建议保持良好的习惯,包括代码块注释,业务逻辑注释,实现痛点等

前端负责人

  • 作为前端的负责人,需要结合业务需求,做更好的技术选型,对于现有的工具有一定的了解和知识广度
  • 良好的编码基础支持作为支撑,熟悉前端项目架构,具备前端开发的技能,面对业务开发能够熟练于心,对算法有一定的能力和理解,对前端领域的技术更新和信息有良好的敏感度
  • 具有一定的管理能力,保持团队的活力,提升整个团队的战斗能力,建议可以开展一些技术分享或者讨论,引导前端团队的成员去攻克一些难题,善于发现他们的闪光点。
  • 不管是针对前端成员还是其他同事或者上级,拥有良好的沟通和理解能力,快速定位问题,进行有效沟通。

写在最后

以上就是关于小公司前端团队建设的一些思考,2022年的前端,希望各位前端开发的同学,都能找到属于自己的一片天地。

文章个人博客地址:小公司的前端建设的一些思考

欢迎关注公众号:程序员布欧,不定期更新一些前端入门文章

创作不易,转载请注明出处和作者。

有关小公司的前端建设的一些思考的更多相关文章

  1. ruby-on-rails - 如何生成传递一些自定义参数的 `link_to` URL? - 2

    我正在使用RubyonRails3.0.9,我想生成一个传递一些自定义参数的link_toURL。也就是说,有一个articles_path(www.my_web_site_name.com/articles)我想生成如下内容:link_to'Samplelinktitle',...#HereIshouldimplementthecode#=>'http://www.my_web_site_name.com/articles?param1=value1¶m2=value2&...我如何编写link_to语句“alàRubyonRailsWay”以实现该目的?如果我想通过传递一些

  2. ruby - 找一些句子 - 2

    我想找到在某些文本中找到一些(让它是两个)句子的好方法。什么会更好-使用正则表达式或拆分方法?你的想法?应JeremyStein的要求-有一些例子示例:输入:ThefirstthingtodoistocreatetheCommentmodel.We’llcreatethisinthenormalway,butwithonesmalldifference.IfwewerejustcreatingcommentsforanArticlewe’dhaveanintegerfieldcalledarticle_idinthemodeltostoretheforeignkey,butinthis

  3. ruby block 并从 block 中返回一些东西 - 2

    我正在使用ruby​​1.8.7。p=lambda{return10;}deflab(block)puts'before'putsblock.callputs'after'endlabp以上代码输出为before10after我将相同的代码重构到这里deflab(&block)puts'before'putsblock.callputs'after'endlab{return10;}现在我收到LocalJumpError:意外返回。对我来说,这两个代码都在做同样的事情。是的,在第一种情况下我传递了一个过程,在第二种情况下我传递了一个block。但是&block将该block转换为pro

  4. ruby - 如果键存在,向散列值添加一些东西? - 2

    我在Ruby中有一个哈希:hash=Hash.new里面有一些键值对,比如说:hash[1]="One"hash[2]="Two"如果散列包含键2,那么我想将“Bananas”添加到它的值中。如果散列没有键2,我想创建一个新的键值对2=>"Bananas"。我知道我可以通过首先使用has_key?检查散列是否具有key2来做到这一点,然后采取相应的行动。但这需要一个if语句和不止一行。那么是否有一种简单、优雅的单行代码可以实现这一目标? 最佳答案 这个有效:hash[2]=(hash[2]||'')+'Bananas'如果您希望所有

  5. ruby-on-rails - 在 Rails 应用程序的前端获取实时日志 - 2

    在Rails3.x应用程序中,我正在使用net::ssh并向远程pc运行一些命令。我想向用户的浏览器显示实时日志。比如,如果两个命令在net中运行::ssh执行即echo"Hello",echo"Bye"被传递然后"Hello"应该在执行后立即显示在浏览器中。这是代码我在ruby​​onrails应用程序中使用ssh连接和运行命令Net::SSH.start(@servers['local'],@machine_name,:password=>@machine_pwd,:timeout=>30)do|ssh|ssh.open_channeldo|channel|channel.requ

  6. ruby - 如何在转换器插件中访问页面属性(YAML 前端) - 2

    我正在为Jekyll编写一个转换器插件,需要访问一些页眉(YAML前端)属性。只有内容被传递给主要的转换器方法,似乎无法访问上下文。例子:moduleJekyllclassUpcaseConverter关于如何在转换器插件中访问页眉数据有什么想法吗? 最佳答案 基于Jekyll源代码,无法在转换器中检索YAML前端内容。根据您的情况,我看到了两种可行的解决方案。您的文件扩展名可以具有足够的描述性,以提供您本应包含在前言中的信息。看起来Converter插件的设计就是这么基本的。如果修改Jekyll是一个选项,您可以更改Convert

  7. ruby - 使用 gmail gem 跟踪一些电子邮件 - 2

    我正在使用gmailgem发送电子邮件,我需要跟踪这些电子邮件。我该怎么做?我正在尝试搜索带有message_id的电子邮件,但它会从我的收件箱中提取所有电子邮件,而我只想要特定电子邮件的回复。这是我的实际代码:*使用message_id保存电子邮件*mail=gmail.deliver(email)Email.create(:message_id=>mail.message_id,:from=>user.email,:to=>annotation.to,:body=>annotation.content,:title=>annotation.title,:annotation=>an

  8. ruby - 一些简单的 Ruby 问题——迭代器、 block 和符号 - 2

    我的背景是PHP和C#,但我真的很想学习RoR。为此,我开始阅读官方文档。我对一些代码示例有一些疑问。第一个是迭代器:classArraydefinject(n)each{|value|n=yield(n,value)}nenddefsuminject(0){|n,value|n+value}enddefproductinject(1){|n,value|n*value}endend我理解yield的意思是“在这里执行关联的block”。令我震惊的是|value|n=each的一部分。其他block对我来说更有意义,因为它们似乎模仿C#风格的lambda:publicintsum(in

  9. 企业大数据发展面临问题之存算分离技术思考 - 2

    文章目录概述背景为何要存算分离优势**应用场景**存算分离产品技术流派华为JuiceFSHashDataXSKY概述背景Hadoop一出生就是奔存算一体设计,当时设计思想就是存储不动而计算(code也即是代码程序)动,负责调度Yarn会把计算任务尽量发到要处理数据所在的实例上,这也是与传统集中式存储最大的不同。为何当时Hadoop设计存算一体的耦合?要知道2006年服务器带宽只有100Mb/s~1Gb/s,但是HDD也即是磁盘吞吐量有50MB/s,这样带宽远远不够传输数据,网络瓶颈尤为明显,无奈之举只好把计算任务发到数据所在的位置。众观历史常言道天下分久必合合久必分,随着云计算技术的发展,数据

  10. ruby-on-rails - 如何将一些参数传递给默认渲染方法? - 2

    我正在使用RubyonRails3.0.10,我想将一些参数传递给默认渲染方法。也就是说,如果我有这样的代码defshow...respond_todo|format|format.html#This,bydefault,rendersthe'show.html.erb'fileendend我想传递一些参数,也许像(注意:以下不起作用)defshow...respond_todo|format|#HereIwouldliketoaddsomelocalobjectsthatwillbeavailableinthe'show.html.erb'templatefileformat.htm

随机推荐