自作の掲示板アプリについて技術的な意見がほしいですブラウザだけで動く簡易な掲示板アプリ(HTMLファイル1枚で動作)を作りました。主に HTML/CSS/JavaScript の書き方や構成について、第三者の目線で意見をいただきたいです。実際の動作は、下の文字列をつなげてアクセスできます。https://wonderful-smakager-dfa955.netlify.app(URLをそのまま書くとエラーになるため、この形にしています)このコードや構成について、 • わかりにくい書き方になっている部分 • こうした方がいい、という改善点 • 機能の過不足について気づいた点などを教えていただけると助かります。よろしくお願いします。

JavaScript

1件の回答

回答を書く

1196472

2026-06-28 07:30

+ フォロー

わかりにくい点



グローバル状態(stateとtabs)が分離

Magic String(\u0026quot;cb_fixed__\u0026quot;等)が説明なし

冒頭に意味不明な空HTMLテンプレート2つ

Firebase設定のプレースホルダー判定ロジックが不明瞭

エラーハンドリングの一貫性なし



改善提案



状態管理の統一(tabsをstateに含める)

定数の整理(CONFIGオブジェクト作成)

長い関数の分割(特にdoPost())

エラーメッセージUI改善

アクセシビリティ強化(aria属性の適切な使用)



不足



いいね取り消し/重複防止なし

検索結果のハイライトなし

タブ削除機能なし

通知機能なし

スパム対策なし

パフォーマンス最適化(仮想DOM等)なし



具体的修正タグ



必須修正(優先度:高)



\u0026lt;delete\u0026gt;: 不要HTMLテンプレート削除

\u0026lt;fix-security\u0026gt;: 画像URL検証追加

\u0026lt;fix-state-management\u0026gt;: state統合

\u0026lt;fix-aria\u0026gt;: aria-busy動的更新

\u0026lt;add-aria-labels\u0026gt;: ボタンラベル追加



推奨修正(優先度:中)



\u0026lt;extract-constants\u0026gt;: 定数整理

\u0026lt;refactor-doPost\u0026gt;: 関数分割

\u0026lt;add-form-wrapper\u0026gt;: フォーム要素追加

\u0026lt;add-comment\u0026gt;: コメント追加

\u0026lt;fix-error-handling\u0026gt;: エラー処理統一



機能追加(優先度:低)



\u0026lt;add-tab-delete\u0026gt;: タブ削除機能

\u0026lt;add-like-limit\u0026gt;: いいね重複防止

\u0026lt;add-search-highlight\u0026gt;: 検索ハイライト



✔総評

「動作すれば良いレベル」から「保守しやすいレベル」への引き上げが必要。特にセキュリティ・アクセシビリティ・コード構造化が改善ポイント。

うったえる有益だ(0シェアするブックマークする

関連質問

Copyright © 2026 AQ188.com All Rights Reserved.

博識 著作権所有