使用chatgpt與firebase,製作簡易訂單網頁

平常大多做得都是電腦應用程式,網頁的部分非常少。
最近剛好有機會嘗試

一開始就使用了chatgpt,跟他推薦的方式一步一步做,用到的只有複製貼上跟把api key用上去而已

chatgpt 跟firebase也太方便😊

線上版免費訂單系統

嘗試做了一個網頁版的訂單表單
從一開始就使用chat gpt,下命令,問問題,然後複製貼上。
透過firebase實現了認證、新增帳號、儲存資料。

遇到不會的問題或是偵錯時的問題,直接貼上GPT都比自己GOOGLE來的快
雖然還是有遇到一個問題是firebase的login有問題,gpt重複回答
但整體體驗十分良好
 


V1版本

一開始只是想做一個可以在手機上,輸入產品、數量、單價的程式。
用localstorage的方式儲存。

並且使用github自動發佈,整個用起來十分順暢


V2版本

透過chatgpt推薦使用免費的firebase
改成了儲存在資料庫中。
並且也順便測試看看firebase的auth功能,加入了電子郵件帳號的功能
使用GPT產生指令,可以新增帳號,並且使用帳號登入畫面


V3版本

微調功能,自己的帳號只能看到自己輸入的訂單,並且將訂單以表格的方式顯示在右邊,且增加了刪除的功能

到這一步,感覺已經OK了,算是已經達到一開始理想的簡易型訂單功能。


未來還可以改進的部分

  1. 將資料匯出
  2. 將驗證方式改成用第三方,Google、apple之類的,不要用電子郵件認證
  3. 加入公司的功能,幾個人可以看到相同訂單
  4. 加入斗內或是金流功能!!!???
  5. 串接line

 

在有一點基礎的情況下,做出了一個雛形,真的太容易了
AI真的有搞頭
下面的網址是這次的作品

https://tsorder-3f23c.web.app/

有任何改進的意見及問題歡迎傳送到電子郵件

電子郵件:momo16542@gmail.com