8
5

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

【たった一行だけ!】Junieを用いてAI睡眠日記アプリを爆速開発してみた!

Posted at

はじめに

こんにちは、いのせです。
最近は大きなカンファレンスでの登壇が決まって毎日そわそわしながら準備を進めている毎日です...笑
そんな中で今回は、Junieを用いてAI睡眠日記アプリを爆速で開発してみました!
自分で書いたコードは生成AIのAPIキーを入力するだけのたった一行だけでした。

JetBrains Junieとは?

JetBrains Junieは、2025年2月に発表され、4月に一般公開されたAIコーディングエージェントです。
従来のコード補完ツールとは一線を画し、プロジェクト全体を理解して自律的にタスクを実行できるのが最大の特徴です。

image.png

Junieの簡単な説明

自律的な動作

  • タスクを与えると、計画立案から実装、テストまで一貫して実行
  • プロジェクトの探索、コードの生成、テストの実行を自動化

IDE統合の強み

  • JetBrains IDEの機能をフル活用
  • インスペクション、リファクタリング、テスト実行まで統合

実績

  • SWEBench Verifiedベンチマークで53.6%のタスク解決率
  • 複雑なタスクから単純な作業まで幅広く対応

対応環境

  • IDE: IntelliJ IDEA Ultimate、PyCharm Professional、PhpStorm、WebStorm(近日対応)

開発したもの

早速今回開発したアプリをお見せします。

AI睡眠日記アプリの完成画面

メイン画面

localhost_5173_ (2).png

  • ダークモードの落ち着いたUI
  • 直近の睡眠記録が一覧表示
  • ワンクリックで記録追加

睡眠記録入力

image.png

  • 就寝時刻・起床時刻の入力
  • 睡眠の質を5段階評価(質のレベルは自己基準)
  • その日の出来事メモ(なぜ良い睡眠が取れたのか、逆になぜ全く眠れなかったのかなど)

AI分析結果

image.png

  • 生成AI(今回はGPT-4を使用)による睡眠パターン分析
  • 個人に最適化された改善提案
  • 睡眠の質に影響する要因の特定

ダッシュボード

image.png

  • 週間睡眠時間の推移(Recharts使用)
  • 睡眠の質の変化
  • 平均睡眠時間と理想との差分

まだまだ改善するべき点はたくさんありますが、Junieに全てコードを書いてもらっての開発はこれが限界でした...
個人的には生成AIからの返答を待っている時の一言アドバイスがお気に入りポイントです!

image.png

Junieにプロンプトを送信してここまで作れてしまうとは思ってもいなかったので、
ここから少し手を加えるだけで生活習慣の改善される素晴らしいアプリが作れそうだなと思いました。

僕の唯一書いたコード

# .env.local ファイルに追加した、たった一行
VITE_OPENAI_API_KEY=sk-xxxxxxxxxxxxxxxxxxxxxxxx

はい、以上なんです。
OpenAIのAPIキーの設定だけです。

Junieを使ってみた感想

良かった点

1. 圧倒的な開発速度

従来なら2-3日かかる開発が2時間ほどで完成。しかも品質も高い。

2. コード品質の高さ

  • 適切なエラーハンドリング
  • カスタムフックの活用
  • パフォーマンスを考慮した実装
// Junieが生成したカスタムフック(一例)
const useSleepAnalysis = (records) => {
  const [analysis, setAnalysis] = useState(null);
  const [loading, setLoading] = useState(false);
  
  const analyzeSleep = useCallback(async () => {
    if (records.length < 3) return;
    
    setLoading(true);
    try {
      const result = await analyzeWithOpenAI(records);
      setAnalysis(result);
    } catch (error) {
      console.error('Analysis failed:', error);
      toast.error('分析に失敗しました');
    } finally {
      setLoading(false);
    }
  }, [records]);
  
  return { analysis, loading, analyzeSleep };
};

3. テスト込みの実装

自動でテストコードまで生成し、実行して動作確認までしてくれる。
特にエラーが起きた時の対応は素晴らしかった。(ほぼ一発で解消してくれた)

改善してほしい点

1. 実行速度

待ち時間が少し長く感じた。しかし、今はどこの処理まで終わっていてどのタスクを実行しているのかをUIで表示してくれていたのはとても良いと思った。

2. 日本語対応

UIの日本語化は手動で微調整が必要だった。また、Junieから日本語ではなく英語オンリーで返答が返ってくるので、英語が多少読めないときついのではないかと感じた。

3. 最新ライブラリへの対応

Mastraなど最新のフレームワークはまだ学習していない様子。

これに関してはあくまでも僕が最初にMastraを用いて開発を行おうとした際に何度か挑戦したものの、うまくいかなかっただけの可能性があるので定かではありませんのでご注意ください。

まとめ

Junieを使って感じたのは、開発者の役割が「実装者」から「ディレクター」に変わりつつあるということです。
個人的にはJunie等のツールに書いてもらったコードがしっかり自分でも書けるレベルになってから使いこなす必要があるのかなあと思っているので、時々プログラミング言語の基礎学習に戻ったりもしようと思っています。

今後の展望

AIエージェントとの協働開発は、もはや未来の話ではなく現在進行形の現実です。
Junieのようなツールを使いこなすことで、より創造的で価値の高い仕事に集中できる時代が来ています。
ただし、最終的な責任は人間にあることを忘れずに、AIと上手く協働していくことが重要だと感じました。
(というよりAIに任せれば何もかも解決というのが当たり前になってほしくないという僕の願望があります...笑)

おわりに

「たった一行」というのは少し誇張かもしれませんが、実際にAPIキーの設定以外は全てJunieが実装してくれたのは事実です。

気になった方は、ぜひJunieを試してみてください!

Junieを使い始めたい方はこちら

8
5
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
8
5

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?