🥙-ケバブ-ケース-ゲーム-🥙

落下してくる文字に串を飛ばして、最高のケバブケースを作ろう！

---

🎯 ゲーム概要

このゲームは、命名規則をテーマにした学習＆アクションゲームです。

落ちてくる単語がケバブケースになりそうかを見極め、タイミングよく串を刺しましょう。
自動でケバブケースになったか判定しスコアがでます。高得点を目指しましょう。

「用語解説」ページでお勉強もできます。

---

🎮 遊び方

1. 落ちてくる文字列を見て、タイミングよく「串を飛ばす」ボタンをクリック！
2. 串が文字に当たると、命名規則を自動判定！
3. 命名規則（例: kebab-case, snake_case, PascalCaseなど）と命中率によってスコアと評価が決まります。
4. 結果画面では、演出画像と素材文字とスコアが表示されます。
5. 仕上がり・スコア・評価を X（旧Twitter） にシェアして自慢しよう！

---

🧩 使用技術

種類	内容
HTML	全ページの構造を構築
CSS	UIの一部・アニメーション
Tailwind CSS	UIの実装
JavaScript	落下処理・衝突判定・命名規則判定・スコア算出など
Google Fonts	（日本語）M PLUS Rounded 1c / （欧文）Quicksand を使用
Google Analytics	実装・セキュリティポリシー練習

---

💬 開発メモ

• 会話中の思いつきから作ったミニアプリです（私は特段ケバブが好きなわけではありません）
• TailwindCSSはCDN版を使用しています
• JavaScriptはすべて<script>タグ内で完結（ファイル分けるべきだったかも）
• 各ページ共通で「ヘッダー」「ボタン」「フッター」構成を採用（コンポーネント化してない）
• MVPの概念を知らず…フィードバックもらえたらありがたいです

---

💬 本当に気が向いた時のタスク

• 他のゲームモードを追加する（連続採点・他ケース）
  
• 背景位置とかUIとか改善したい
  
• レスポンシブ対応する
  
• 諸々リファクタする
  
  • ヘッダー・フッター等をコンポーネント化
    
  • JavaScriptの処理を効率的で賢い記述に
    
• 別サービスでデプロイしてみる
  

---

👦 作者

NOA
📘 GitHub: Noa-aoN