現場日報アプリをデプロイしました！

Posted date at 2024-06-03

React

Node.js

TypeScript

　先月の月次報告会でノルマとして掲げていたアプリケーションをデプロイしました。

　

説明文

🚀アプリについて

　現在スプレッドシートで行っている現場の日報入力を代わりに行うWebアプリケーションです。

詳細は、コチラの資料📒をご確認ください。アプリの目的から実装機能や、UI/UXの一覧も記載しています。

🐡アプリ名

　SiteDIARY📒

　URL：https://site-diary-morimatsu.web.app/

🐡コードステップ・ファイル数

　ステップ数：19,590　ファイル数：132

　〇内フロントエンド

　　ステップ数：TypeScript 12,495、SCSS 2684、html 31、css 48

　　ファイル数：95

　〇内バックエンド

　　ステップ数：JavaScript 4,332

　　ファイル数：37

　※ソースコードを見たい方は、GItHubアカウントを教えていただければ招待します。

🚀機能説明（記載資料より抜粋）　

site-diary-input-single.png

site-diary-list-compact.png

site-diary-list.png

site-diary-list-ui.png

site-diary-list-month.png

🚀まとめ

　2週間を目安にしていましたが、１ヶ月近くかかってしまいました。

　しかしながら、ChatGPTにGitHubのURLと工数（時間）を提供し、開発スピードについて聞いたところ、時間的にはエンジニア初心者から中級者としては、かなり優秀だと言ってもらえたのでその点は前向きにとらえたいと思います。

　時間がかかった原因は、構想（既存のスプレッドシートの様式の希望に沿うUI/UX（どうしたら使ってもらえそうか））と入力機能の実装でした。

　毎回そうなのですが、複数の状態変数の管理とバリデーションチェックに苦しみました。

　UI/UXも１からなので、やりがいはありますが、デザインを固めるのにかなり頭を使いますし、何度も修正するため時間がかかります。逆に処理系（バックエンド）は上から下に処理を書くだけなのでフロントに比べるとかなり楽です（←一昔前のプログラマのイメージはおそらくこれなので、AIで代替できると言われるのかもしれません）。

←ホームに戻る