关于前端:前端小白是如何利用chatgt用一周时间从0做一款微信小程序的

9次阅读

共计 2172 个字符,预计需要花费 6 分钟才能阅读完成。

随着 chatgpt 的大火,真的是在工作上给各行各业的人带来了极大的便当,自己是一个 java 程序员,其实我本人是始终想开发一款属于本人的小程序的,然而迫于对前端常识的瘠薄,思考到要学的前端开发常识有很多,比方 js,ts, 前端框架vue,react…, 最好受的是css 款式,最简略的成果都要弄良久,每次想一想就放弃了。最近进去的chatgpt,让我对这个想法从新有了信念,而后就是间接开干!

☝确定好方向

为什么要做一个题库小程序呢?

之前帮人家做过主动答题的程序,所以不少人问我有没有相干网站的题库,所以既然他人有这个需要,我感觉还是有做的可行性的。

🚌模拟同类产品

既然想好了要做什么,那我就间接去利用市场,微信小程序搜相干的利用,我一口气下载和看了十几款搜题程序,搜题大侠,题海,刷题神器,聚题库 …, 总结了几点:

  • 提供了丰盛的搜题形式,手动输出文字 语音输入 拍照辨认
  • 提供题库,能够让 用户本人练习
  • 用户能够 自主上传题库

下面这几点,是用户的根底性能,也就是满足题库 app 的根本条件。
然而很多题库都没有把三点都做到,有些有拍照然而没有语音输入,有些只有文字输出,有些题库很丰盛然而不反对用户本人导入题库,而且绝大多数 app 动不动就要免费,而且免费还很高,我感觉这能够是我的突破点,作为集体开发者,我的老本必定比他们低,所以程序在免费方面必定比他们低或者不免费。

🤔策动产品 ui 和性能

性能方面,我就先模拟别人的题库 app,先把根底的性能做起来,第一步先把搜题性能做好,再做其余的性能。

  • 搜题形式:实现手动输出文字,语音输入,拍照辨认题目。
  • 题库起源:我初步想的是爬数据 + 第三方 api+ 用户上传,这样能力覆盖面广,而且题库也会始终更新。

依据要做的性能就简略画了下草图,本人不懂 ui,审美也不太行就只能潦草一点了

🥊开发

后盾

后盾接口想了下,先暂定三个接口,为了接口不被轻易爬取,采纳前台加密,后盾解密的形式,每次申请都会携带秘钥,解密胜利才会正确响应。

  • 查问题库接口
  • 登录接口
  • 百度 ocr 接口

因为后端是本人老本行,花了一天左右差不多就做完了

前台

前台我首先考察了那几款框架好做微信小程序,就是坑比拟少(包含 uniapp,taro, 原生),因为本人间接略微接触过一点react,鉴于taroreact的适配性比拟好,taro也始终在更新,所以我抉择taro(原生也思考过,然而感觉要多花工夫去理解,所以就 pass 啦)。

筹备事项

开发小程序还是有很多筹备的工作要做的,

  • 比方得先注册一个 微信小程序账号,每次公布就是须要登录这个账号来公布,
  • 抉择小程序的类目,这个挺重要的,因为有些类目,集体开发者不能申请,所以要特地小心,因为我做的属于题库,所以我抉择了 信息查问和教育两个类目。
  • 想一个容易被记住和被搜寻到的小程序名称。
  • 设计一个图标,我本人不会,就在图标网站先找了一个差不多适宜的。
  • 用户隐衷爱护指引,这个须要依据本人的小程序性能来填写,向我这边就须要麦克风和摄像机的权限,这个须要在外面阐明用处,更新提交下来,这样能力保障审核能够胜利。

依据 demo 批改

我先去官网 clone 了个 demo 下来,下载了微信开发者工具,尝试运行了下,发现还真有用
Taro 官网

而后本人先把首页的样子,用语言形容给 chatgpt,给我画出大略得雏形,而后再进行微调

如此往返,我就失去了一个简洁的首页

而后就是对接接口啦,查问题库,ocr 的接口,还有登录接口通通对接下来。
这里遇到了两个比拟坑的中央。

  • 一个是微信官网有一个“微信同声传译”插件,须要本人去市场里申请,后果发现自己死活申请不了,提醒“集体主体不能申请”,可是我也看到相似的集体小程序也用了这个插件,这我就很迷糊了,凭什么我就不能申请胜利,前面在我穷追不舍的搜寻下,终于发现了另外的入口,申请胜利!

申请步骤

  1. 去微信服务平台搜一下
  1. 找到了微信同声传译,登录后抉择给哪个小程序增加,增加胜利后去小程序的微信公众平台看曾经增加胜利了,而且是已通过状态。
  • 获取用户的昵称和头像形式变了,之前只须要调用 getUserProfile 这个 Api,在胜利回调中就能获取用户信息,当初曾经废除了,当初须要开发者本人写表单,用户本人填写头像和昵称,感觉这个会让用户操作变得麻烦,所以我临时先不实现这个性能了,等到那天想到适合的操作逻辑再做

这里前前后后花了我三四天的工夫(次要是上班来做,下班个别没啥工夫),次要是交互和摸清 wx 的 api 应用比拟花工夫,chatgpt 在设计界面和交互真的帮了我很大的忙,还有一些前端谬误他也能疾速定位,并给出解决方案,给我节俭了很多工夫

公布

最初一步就是上传代码,提交审核,个别一天左右就会审核实现,再点击公布,就能看到上线的小程序,这一刻情绪还是无比的冲动!🥰

🚧开发总结

应用 chatgpt 帮忙我一个前端小白缓缓搭建起一个小程序的过程中,
毛病 在我看来是 chatgpt 并不会准确无误地给出我想要的答案,大多数是比拟合乎的,然而必定不是特地合乎,须要本人一点一点的调整。

长处是chatgpt 每次通知你答案的时候往往还会为我解答代码的作用,这让我更快地理解语言的一些个性和框架的应用,节俭了本人去官网查文档的工夫,这让我感觉本人是真的参加了这个前端开发,而不是随便地 copy 答案。

最初非常感谢大家看到这,很快乐分享这次的开发过程,总之就是有意思,效率是真的高。

正文完
 0