1. HOME
  2. ブログ
  3. IT技術
  4. MVVMアーキテクチャで書籍管理アプリを作ってみた!
MVVMアーキテクチャで書籍管理アプリを作ってみた

MVVMアーキテクチャで書籍管理アプリを作ってみた!

MVVM で書籍管理アプリを作りたい!

鈴木先生

(株)ライトコードの鈴木です!

近年、Android アプリ開発の主流となっている「MVVM アーキテクチャ」。

MVVM アーキテクチャは「Model」「View」「ViewModel」の3つのコンポーネントを用いて実装します。

役割分担をはっきりさせ、UI をモデルで操作するため、開発側・ユーザー側ともにメリットの多い設計方法です。

開発者側のメリットユーザー側のメリット
データ管理が楽UI 表示が早い
コード変更時の書き換えやミスが減るメモリ不足になるリスクが減る

今回は、この MVVM アーキテクチャを使って、書籍管理アプリを作ってみましょう!

こちらの記事もオススメ!

MVVM の構造

実装の前に、まずは MVVM の構造を説明しておきましょう。

ユーザー、各コンポーネントと API との関係は、以下のようになります。

MVVM の構造

Model

Model は、アプリ内で利用するデータを管理するコンポーネントです。

Repository を経由して、API やデータベースからデータを取得・利用します。

View

View は、表示を行うコンポーネントです。

ユーザーからアクションを検知し、画面遷移や ViewModel に処理の依頼をします。

ViewModel

ViewModel は、Viewから受けた依頼を元に、Model からもらったデータを処理するコンポーネントです。

View への反映には DataBinding を使い、自動的に反映します。

DataBinding とは?

MVVM の最大の特徴が、View と View Model を結びつける「DataBinding」です。

同じデータをやり取りしているので、どちらかの値が変更されれば、もう片方の値にも反映されるといったように、双方向でデータの更新が行われます。

MVVM でアプリを実装

それでは、MVVM を使って書籍管理アプリを実装してみましょう!

以下のような流れで、コンポーネントを作成していきます。

  1. Model
  2. ViewModel
  3. View

LiveData と ViewModel の利用準備

まずは、LiveData と ViewModel を利用できるように、依存関係を記述します。

今回は、2020年11月現在の最新バージョン2.2.0を使っています。

Model の作成

次に、Model の作成です。

「本の ID」と「タイトル」「著者」を保持する BookModel を作成します。

Repository の作成

Repository は、データベースにデータを保存したり、API からデータを取得する時に利用します。

データベースへのアクセスや API は非同期処理なので、Rx ライブラリや Coroutine などを使ってください。

ローカルデータベースの利用は、Google 提供の Room ライブラリを使うのが良いでしょう。

ViewModel の作成

本の情報を取得し、表示する ViewModel を作成します。

タイトルと著者を格納する LiveData を定義して、API で本の詳細を取得します。

タイトルと著者の LiveData に、API で取得した本の詳細を渡します。

View の作成

続いて、表示に必要な View を作成します。

ViewModel を生成して取得し、本の詳細を取得する処理をリクエストします。

LiveData の読み込み

最後に、ViewModel の LiveData を読み込みます。

observe メソッドで LiveData を読み込み、TextView の text に LiveData 値を渡すと表示してくれるようになります。

以上で、実装は終わりです。

さいごに

今回は、MVVM アーキテクチャの解説と、MVVM を使った書籍管理アプリの実装についてご紹介しました。

今や Android アプリ開発の主流である MVVM アーキテクチャは、ぜひ押さえておきたい知識です。

この記事が少しでも MVVM アーキテクチャの理解に役立てばうれしいです!

記事を書いた人

\ 3度のメシより技術が好き /
(株)ライトコードは、WEB・アプリ・ゲーム開発に強い「好きを仕事にするエンジニア集団」です。
システム開発依頼・お見積もりはこちらまでお願いします。
また、WEB・スマホ系エンジニアを積極採用中です!
※現在、多数のお問合せを頂いており、返信に、多少お時間を頂く場合がございます。

こちらの記事もオススメ!

ライトコードよりお知らせ

にゃんこ師匠にゃんこ師匠
システム開発のご相談やご依頼はこちら
ミツオカミツオカ
ライトコードの採用募集はこちら
にゃんこ師匠にゃんこ師匠
社長と一杯飲みながらお話してみたい方はこちら
ミツオカミツオカ
フリーランスエンジニア様の募集はこちら
にゃんこ師匠にゃんこ師匠
その他、お問い合わせはこちら
ミツオカミツオカ
   
お気軽にお問い合わせください!せっかくなので、別の記事もぜひ読んでいって下さいね!

一緒に働いてくれる仲間を募集しております!

ライトコードでは、仲間を募集しております!

当社のモットーは「好きなことを仕事にするエンジニア集団」「エンジニアによるエンジニアのための会社」。エンジニアであるあなたの「やってみたいこと」を全力で応援する会社です。

また、ライトコードは現在、急成長中!だからこそ、あなたにお任せしたいやりがいのあるお仕事は沢山あります。「コアメンバー」として活躍してくれる、あなたからのご応募をお待ちしております!

なお、ご応募の前に、「話しだけ聞いてみたい」「社内の雰囲気を知りたい」という方はこちらをご覧ください。

ライトコードでは一緒に働いていただける方を募集しております!

採用情報はこちら

関連記事

初心者が3ヶ月でどれくらいプログラミングができるようになるのか

採用情報

\ あの有名サービスに参画!? /

バックエンドエンジニア

\ クリエイティブの最前線 /

フロントエンドエンジニア

\ 世界はお前の手の中に・・・ /

モバイルエンジニア

\ サービスの守り神! /

インフラエンジニア

初心者が3ヶ月でどれくらいプログラミングができるようになるのか

初心者が3ヶ月でどれくらいプログラミングができるようになるのか