Physical Address

304 North Cardinal St.
Dorchester Center, MA 02124

如何與chatGPT合作生產並且部署一個短網址服務

內容目錄

如何與chatGPT合作生產並且部署一個短網址服務

chatGPT問世之後一直想來與chatGPT合作產生一個服務,最近總算花了一點時間完成這個小合作-部署短網址服務,因為設計很多程式碼細節,我在這篇僅紀錄與分享合作過程和遇到的問題。

確立目標

在開始之前,自己先訂了幾個小目標:

  1. 目標是完成短網址服務
  2. 要實際部署
  3. 程式碼盡可能交給chatGPT生產,後來在實際合作過程中,我幾乎都是大膽直接複製貼上去跑服務

運用的環境與工具

  1. nodeJS + express
  2. 部署在Vercel上
  3. 資料丟給firebase的realtime database

我們開始吧

一開始我就很暴力的直接問chatGPT
「如何使用node打造短網址服務,需要與firebase連結」

根據chatGPT的回應,我完成了幾個步驟

  1. 在firebase設定好環境
  2. 從firebase取得node用的初始化與導入方法
  3. 建立node服務
  4. 完全遵照chatGPT回應貼上啟動服務的程式碼
  5. 分別貼上「處理短網址」和「處理長網址」兩個api的程式碼
  6. 貼上啟動express服務的程式碼
  7. 啟動

好啦其實我沒有那麼嚴謹,所以某些小細節我覺得怪怪還是有點修改,但基本上沒有太大問題。
例如,chatGPT提供的作法是用require來引入,因為習慣問題我改成了import。還有chatGPT提供的程式碼是分段敘述,我組合起來時有餐入一點個人習慣,但這問題應該可以透過「請將程式碼組合成index.js」之類的prompt來調整。

有時我也會問他一些函式寫法問題,像是下圖:

總之有稍微不懂就直接問,問爆XDDD

寫完就啟動啦!

當然沒那麼順利,剛剛那些步驟做完後,我很開心的輸入

npm run dev

然後就一如往常出現錯誤啦,chatGPT跟我的距離也沒多遠嘛
當然出現錯誤,我就會敘述清楚回報給chatGPT,像是下圖。

這邊提到一個很有趣的狀況,其實chatGPT會漏給資訊唷
在短網址服務中,最重要的環節是將長網址轉換成一個隨機短字串,這邊一開始chatGPT居然只給我一個函式名稱就呼隆過去,我一開始就發現不對勁,果然啟動後發現這邊根本跑不動XDDD
於是叫他補上,可惡ㄋ,我當免費仔也不能用騙啊。

看起來順利執行了

補上後整體看起來有87像了,但他寫的程式碼他要跟我說怎麼測試啊( 你看使用者真的很懶),所以就順口問了,啊這段程式碼怎麼測試。


這之後開始進入一段時間不短的錯誤與改進攻防戰,因為服務不能正確運作,我就一直把錯誤狀況丟回去給他修改。
大約來回四五次後提出來的程式碼版本終於能正常使用了,看起來沒啥問題。到這邊其實基本功能已經完成了,只是後來有想到一些防呆與檢查,chatGPT給我的版本處理的不是很好就稍微再修改過,未來有要這樣使用的話記得要提醒他加上檢查判斷。

但我覺得他已經完成任務!真的強啊!

補上介面

剛剛做的只有基本的node api,還沒有加上介面,當然這也得交給chatGPT囉。喂!快工作。

稍微看一下覺得寫得還不錯喔!雖然還是一點錯誤,但那其實是給予的資訊不夠清楚,跟前面一樣開始做一些調整的溝通就弄個差不多了。

要請他修正最好給予足夠資訊,例如在什麼地方做什麼出現什麼訊息。通常會給很具體的調整方式。

最後我嫌介面不好看,還叫他用Alertify.js弄漂亮一點XDDDD像這樣

這時其實已經弄的差不多了,大概花了4小時左右。

該來部署囉

剛剛提到我想部署到Vercel上,這邊犯了一個錯,忘記連部署方法也先叫他提供,導致這邊卡了一段時間,
問題大意是我要在Vercel部署express服務,但又得提供一個介面,Vercel其實有自己一套做法,但一開始我先從express的設定去調整,造成服務一直部署失敗,Vercel的做法之後會再寫一篇文補上(?
花了一些時間找錯誤後發現問題在於Vercel的設定,於是重新問問夥伴怎麼寫比較好。

看一看有點不太懂rewrites的一些規則,就乾脆直接問清楚,ㄟ你跟我怎麼設定辣!

我得說這樣問後得到的回答超清楚,比我自己回答還要清楚qq
就這樣重新問了幾次後,我也搞懂了,然後就部署成功了,哈哈XD
最後算了一下,從開始到部署完成運作大概花了兩天,中間有些時間是做小調整,熟練後能更快。

結論

經過這次練習後確認chatGPT真的能有效協助工程師執行專案,尤其面對一些陌生狀況更能快速找到一條處理的道路。說來真感概,幾年前寫論文就是在做人機合作的專家系統,那時就感覺NLP這塊每年技術迭代都在加速,沒想到畢業三年後就看到這麼純熟的人機合作工具,這個時代真棒。

目前主要問題大概是整合部分,但用的過程也覺得只要給予的條件、目的夠明確,chatGPT回饋的程式碼越具體,所以我想整合能力未來也會突破。

總之以後不管做工作專案也好、side project也好,有chatGPT真的是幫助不小,這個工具能補足很多欠缺的部分,讓我非常期待可以做更多有趣的東西啦。
倒不太擔心什麼會被取代之類,反正我也沒多強,有這類工具身為創作者才能飛得更遠不是嗎?
以上就是這個小專案的過程,分享一下,也歡迎留言討論。

最後這是部署的工具網址
https://short-url-test.vercel.app/