初ハッカソン ～AI活用とやらかした話～

Transcript

1. AI活用とやらかし編 初ハッカソン amano kouei 2025年11月作成
2. 自己紹介 天野 滉瑛 プロフィール 東京の情報系専門学校の2年生です！ バックエンドエンジニア を目指しています！ スキル Web開発５月にはじめました React.js/ Ruby on Rails/ Laravel 最近 コーヒーに凝りはじめた 福岡にハマってる 初ハッカソン行ってきた
3. ・AI活用編 ・やらかし編 ・ネクストアクション 目次
4. AI 活用編 １ 早めに全体像を理解したい ？？？ ３ AIに置いていかれてる感 ？？？ 2 自分で噛み砕いて理解したい ？？？
5. AI 活用編 １ 早めに全体像を理解したい Figma make ３ AIに置いていかれてる感 ？？？ 2 自分で噛み砕いて理解したい ？？？
6. クエリ アキネーターみたいな感じのUIで　上に 質問がでてきて　下に選択肢がいくつか あるページ Figma make
7. AI 活用編 １ 早めに全体像を理解したい Figma make ３ AIに置いていかれてる感 ？？？ 2 自分で噛み砕いて理解したい ？？？
8. AI 活用編 １ 早めに全体像を理解したい Figma make ３ AIに置いていかれてる感 ？？？ 2 自分で噛み砕いて理解したい Chat gpt
9. やりたいこと TS からJSに変換したい 理解しながら実装したい Chat gpt React 要素は細かく実装 CSS はAIに丸投げ 機能単位での実装 使い方
10. AI 活用編 １ 早めに全体像を理解したい Figma make ３ AIに置いていかれてる感 ？？？ 2 自分で噛み砕いて理解したい Chat gpt
11. AI 活用編 １ 早めに全体像を理解したい Figma make ３ AIに置いていかれてる感 Github copilot 2 自分で噛み砕いて理解したい Chat gpt
12. Github copilot (agent mode) キーワード 学生無料 copilot-instructions.md 段階ごとに進める 調査　→　計画　→　実装　→　デバック 使い方
13. Github copilot (agent mode) キーワード 学生無料 copilot-instructions.md 段階ごとに進める 調査　→　計画　→　実装　→　デバック 使い方
14. やらかし編 １ 管理しやすくしした インラインスタイル地獄 ３ 終盤バタバタした api 無料枠切れた 2 フロントエンドなめてた がばがばUX
15. 意識すること UXの向上 レスポンシブ対応 気持ちよく動くUI 飽きさせない工夫 フロンドエンドなめてた デザインが崩れないような比率の意識 ローディングアニメーションの追加 ホバー時のアニメーション モダンなレーダーチャート作成 実際にやったこと
16. Next Action
17. フロントエンドは奥が深い。 ハッカソンはバタバタしていい。 そして、AI 時代こそ 苦しんでコード書いたほうがいい。
18. Q & A X github.com/KoueiAmano