0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Anki風のシンプルな学習アプリを個人開発してみた【React Native × Firebase】

Last updated at Posted at 2025-03-29

アプリケーション名

ankiApp

アプリケーション概要

英語・中国語・資格試験など、自分の目的に合わせたフラッシュカードを使って効率的に暗記学習ができる、React Native + Firebase製のシンプルな学習アプリです。デッキごとにカードを登録し、復習のタイミングを自動で調整することで、知識の定着をサポートします。

アプリケーションを作成した背景

日々の学習において「覚えたつもり」を防ぎ、効率的に記憶を定着させたいという思いから、本アプリの開発に取り組みました。市販のAnkiアプリは高機能ですが、その反面インターフェースや設定が複雑で、学習に集中しづらいと感じていました。

そこで、自分の学習スタイルにフィットした、シンプルで直感的に使える暗記アプリを目指し、React Nativeを使ってゼロから構築しました。以前にReactの開発経験があったこともあり、スムーズにモバイルアプリ開発へ移行できた点も大きな後押しとなりました。

参考

備考

本アプリは個人の学習支援を目的としたもので、現在はローカル/開発環境での運用にとどめています。
本番環境へのデプロイにはFirebase課金やApple Developer登録などのコストが伴うため、必要性が生じた段階で導入を検討する予定です。

アプリの画像(イメージ)

デッキ一覧 問題カード
Deck Question
回答カード 登録画面
Answer Register

今回のポイント:SuperMemo 2 アルゴリズム(SM-2)

本アプリでは、記憶の定着効率を最大化するために「SuperMemo 2(SM-2)」アルゴリズムに基づく復習スケジュールを採用しています。

SM-2は「覚えた内容を、忘れる直前にもう一度復習する」ことで、記憶の保持率を高めることを目的としたアルゴリズムです。復習ごとにユーザーが「どれくらい覚えていたか」を自己評価(0〜5段階)し、その評価に応じて次回の復習日が自動的に調整されます。

この仕組みにより、単なる暗記カード以上に、「忘却曲線」に沿った効率的な復習体験を提供します。

SM-2アルゴリズムの主な流れ:

各カードには "Ease Factor(記憶しやすさ)" があり、ユーザーの評価によって変化

評価が高ければ復習間隔が長くなり、低ければ短くなる

一度覚えた内容は、自然に復習頻度が減っていくため、効率よく学習を継続可能

これをアプリ内で自動管理することで、学習者は「次に何を復習すべきか」を考える必要がなくなります。

利用方法

✅ デッキの作成・表示

  • ホーム画面から「Add Deck」をタップし、学習テーマごとのデッキ(例:英単語、中国語文法、IT用語など)を作成。

✅ フラッシュカードの登録

  • 各デッキ内で「Add FlashCard」をタップし、表(問題)と裏(答え)を登録。例文なども追加可能。

✅ フラッシュカードの復習

  • 復習対象のカードが日ごとに表示され、復習完了すると記憶度に応じて次回表示が自動調整されます。

✅ 編集・削除

  • 登録済みカードやデッキは編集・削除可能です。

開発環境

  • フロントエンド: React Native (Expo)
  • バックエンド: Firebase Authentication / Firestore
  • アーキテクチャ: EAS Build(iOS / Android対応)
  • 言語: TypeScript

主な機能

  • ユーザー認証(Firebase Authentication)
  • デッキごとのフラッシュカード登録・管理
  • 復習スケジュールに基づいたカード表示
  • 完了率表示(プログレスバー)
  • カード詳細の編集・削除
  • デッキの名称変更・削除(ActionSheet)
  • 音声再生機能(語学学習支援)

今後の展望

  • 並び替え機能やタグ付け
  • デッキ共有・インポート機能

工夫したポイント

  • Firebaseでユーザーごとにデータを管理し、端末を問わず学習を継続できる
  • シンプルかつ最小限のUIで、操作性を重視
  • Expo + EAS Buildでクロスプラットフォーム対応(iOS / Android)
  • 学習進捗が視覚的に分かるプログレスバー表示

使用技術

  • React Native / Expo
  • Firebase Authentication
  • Firebase Firestore
  • TypeScript

大変だったこと

  • Firebaseのネスト構造でのデータ取得と管理

参考にしたもの

最後に

このアプリは「自分で決めたことを、毎日少しずつ覚える」ために作ったものです。語学・IT・資格試験・受験勉強など、どんなジャンルにも応用できるように設計しています。今後もより実用的な学習支援ツールに進化させていく予定です。

0
0
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
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?