GAKU 〜Generate Aイデア is 苦〜

ハックツハッカソンで作成するアプリを考えてくれるアプリです！
アプリの提案や、README.mdの作成をしてくれます。

要件定義

概要

• ハッカソンでどんなアプリを作成するか支援してくれるWebアプリ.
• 作りたいものやユーザーの技術スタック等から質疑応答形式で作成物を決定. 仕様や要件をまとめたREADME用のマークダウン文章を出力する.
• DBにデータは保持せず, 質疑応答→作成物の決定 までの1フローで完結できるようにする.

フロントエンド

• ページ
  • Topページ
  • 選択ページ
  • (ロード中の表示)
  • 出力ページ
  • (提案モーダル)
• UIデザイン

バックエンドAPI

• ChatGPTにアプリを考えてもらう
• ChatGPTにREADME.mdを作成してもらう

ChatGPTにアプリを考えてもらうAPI

ChatGPTにREADME.mdを作成してもらうAPI

アプリ使用の流れ

sequenceDiagram
    autonumber
    actor user as ユーザー
    participant front as Webページ
    participant back as サーバー側
    participant ai as Chat GPT
    user->>front: Topページアクセス
    user->>front: SelectページにRequest
    front->>user: 選択肢表示
    user->>front: 選択する
    front->>back: 選択結果を送信する
    front->>user: 生成中画面表示
    back->>ai: アイデア候補一覧を要求
    ai->>back: 返却
    back->>front: 返却
    front->>user: 一覧表示（結果画面）
    user->>front: 一覧の中からアイデアを選択
    front->>back: アイデアのREADME生成要求
    front->>user: ローディング中
    back->>ai: 生成要求
    ai->>back: 返却
    back->>front: 返却
    front->>user: ローディング画面からREADMEモーダルを表示へ

使い方

1. スタート
2. 使いたい技術タグを選択し、送信ボタンをクリック
3. 提案の中から作りたいアプリを選択
4. README.mdが生成されるので、自分のプロジェクトにコピー&ペーストして使用してください！

生成されるREADMEの構成

   - アプリ名
   - アプリ概要(100文字以上)
   - 使用技術(詳細に)
   - シーケンス図(mermaidを用いて)
   - 使用技術のインストール方法(初心者にも分かりやすく段階を踏んで)
   - アプリの使い方

使用技術

• フロント： Next.js
• AI： ChatGPT API
• インフラ： Azure Static Web Apps

タスク管理

開発風景

team_田中1号

• 稲(INA)： PM, インフラ, AI
• 柊(SHU)： フロント, デザイン
• 永(EI)：フロント, プロンプト, ゲーム
• 陽(YOU)： フロント, サーバー
• 隆(RYU)： サーバー, プロンプト
• 田中1号：undefind

[
    tanaka: {
        "0号": "陽ちゃん",
        "1号": null,
        "2号": "隆ちゃん"
    }
]

GYMLABO ハッカソン

• テーマ
  「学」
• 日程
  2023-03-27（月）10:00 - 2023-03-28（火）17:00 JST
• 場所
  GYMLABO：〒804-8550 北九州市戸畑区仙水町1番1号
  （アクセス in 九工大サイト, GoogleMap 九州工業大学 戸畑キャンパス）

https://hackz-community.doorkeeper.jp/events/152011