在Vue的模块开发中使用GPT的体验及总结

我这一周都在忙着实现一个页面,这个页面是通过vue基于element-ui来实现的。在这个过程中,我把页面拆分成多个组件,而组件的生成是通过Chat-GPT3来实现的。
这又是一次使用AI来协同开发的体验,觉得有必要总结一下:

  1. 遵循软件系统设计中的单一原则来拆分模块;
  2. 设计模式在组装模块上的作用很重要;
  3. 管道的思想是表达数据处理逻辑的一种重要方式;

遵循软件系统设计中的单一职责原则来拆分模块

在这次体验中,我让GPT为我生成的东西很明确,即表单和表格。一方面便于GPT的理解和实施,另一方面,也是更重要的一方面,是便于自己的表达和输出。

设计模式在组装模块上的作用很重要

为了实现模块之间的事件节藕,我使用了vue提供的观察者模式。当然,这个部分的代码不多,我是手写的。但我可以遇见,设计模式的使用,一方面可以让GPT了解你的意图,另一方面也可以单独生成代码(设计模式本身很多也是遵循单一职责来设计的)。

管道的思想是表达数据处理逻辑的一种重要方式

因为我的模块都是用于数据展现的,所以,数据处理都集中到了页面上。从高内聚,低耦合的设计角度来说,这提升业务逻辑的内聚性,降低模块的耦合度。但页面上的复杂逻辑应该如何表现就变成了一个棘手的问题。在复杂逻辑的处理场景中,数据流的处理通常是核心。而数据流的处理,用管道思想再合适不过,它起到一种组织和解耦代码的作用,这里又遇到了“单一职责”原则,又是一个让GPT写代码的点。

写得有些仓促,思考也不太完整,欢迎大家评论区讨论。

2024.1.27,重庆.渝北

你可能感兴趣的:(设计心得,vue.js,gpt,前端)