MVVMがいまいちどんなものか分からないという方向け。

僕はMVVM(Model-View-ViewModel)とはソフトウェアの実装パターンの一つくらいに考えていました。

MVVMについてわかりやすくこの記事でまとめていきたいと思います

目次

前置き:ソフトウェアアーキテクチャパターンとは

これは簡単に言うと開発する際のルールのようなものです。

これまでソフトウェア開発、ハードウェア開発で問題となっていたのが開発する際のフォルダ構成やファイル名等バラつきがあり、ソースコードが属人化してしまうことです。

作った本人しか分からないソースコードは良くないソースコードであり、開発者が変わるたびに引き継ぎに多くの時間を要してしまいます。

このソフトウェアアーキテクチャパターンの登場により、決められたルールに従って開発を進められるようになったためより開発がスムーズになりました。

MVVMとは

MVVMとはViewViewModelModelという3つの要素を持った実装パターンのことです。

これにより、ビジネスロジック(DBとの連携、データの状態変化の役割部分)とプレゼンテーションロジック(UI、文字やデータを表示する部分)を分業化できます

まとめると、MVVMパターンの実装を採用することで以下のようなメリットが得られます。

Point

  • 役割をソースコードレベルで分けることで変更による影響を最小限に押さえられる
  • UI、ロジックを分業化することで、変更箇所が特定しやすくできる

MVVMの処理フロー

Tranquilpeak 上記の図は「View、ViewModel、Model」のそれぞれの役割を表しています。

Point - Viewは現在のデータの状態を表示する
- ViewModelはViewデータの紐付けとViewに関連するコマンドをModelに渡す
- ModelはViewModelからコマンドを受けDBに対して実際にクエリを実行する

MVVMを用いた場合のAPIの処理の例

例えば「会員登録をする」というボタンを押し、会員登録APIが実行される場合、MVVMパターンだと以下のような感じで分業されるかと思います。

Point

  • Viewから会員登録APIの命令を受け取る
  • ViewModelで対象となるユーザデータを変数に格納し、データの準備をする
  • Modelに登録対象となるユーザデータとコマンドを渡しクエリを実行する

MVVMのビジネス的なメリット

このように分業することで業務の分業化 => 作業の効率化に繋がるのです。

結果的に変更に強いソースコードとなり、お客さん側もより柔軟にアプリの仕様変更を考えられるようになります。

結果、プロジェクトの全員がみんなが幸せになると言うことですね。

さいごに

私は文系卒で社会人になってから0からプログラミングを Udemyで勉強し、今海外で働いています
Udemyでは動画での説明や解説等もあり親切で、学習教材も豊富にあることから プログラミング初学者の方が短期間でエンジニアを目指したいのであれば、非常に良い教材だと思います。
ぜひ皆さんもUdemyを通してエンジニアへの第一歩を踏み出しましょう🔥

世界最大級のオンライン学習サイトUdemy

また、別記事にてダナンでの生活やIT関連についても記事を書いていますのでクリックいただけると嬉しくてムーンウォークしながら寝落ちします💃

関連記事

【Udemy】未経験から始める格安プログラミング講座4選

海外移住を始めて2年ほどが経過しました、日本に住んでいた時と今ベトナムに移住してからとでどのように生活が変わったのかをこちらの記事にまとめていこうと思います。

【Udemy】未経験から現場で活躍できるエンジニアになるための実践プログラミング講座5選

プログラミング未経験だけどエンジニアになりたい方向けで記事を書きました。 実際にUdemyを受講してエンジニアになった経験から、実務で必要とされる知識を学べるUdemyのおすすめ講座をこちらの記事でご紹介できれはと思います。 中には無料で受けられる講座もあるので、興味のある方必見です😄

【無料で学べる】Udemyのおすすめフロントエンド講座4選

海外移住を始めて2年ほどが経過しました、日本に住んでいた時と今ベトナムに移住してからとでどのように生活が変わったのかをこちらの記事にまとめていこうと思います。