- Visual Studio 2017 or 2019 または Visual Studio for Mac 2017 or 2019
- Windows 10 or Mac
アプリ開発で頻出する機能「会員登録」の住所入力部分を、iOS, Android でぞれぞれ SPA と ガワNative アプリ, Native アプリで実装し、どのような違いがあるかを体験いただくサンプルです。
簡単な機能ですが、同じ機能を iOS, Android でそれぞれ2種類、SPA が1種類の合計5種類のソースコードを準備することで、実装方法の違い、動きの違い、使い勝手の違いをご理解いただく一助になれば幸いです。 ただし、今回の目的は「UX/UI の違い」をご理解いただくことに重点を置いており、実装については敢えてライブラリなど使わず素の実装になっており、ベストプラクティスを提示するものではございません。
なお、このサンプルは、マイクロソフト様のイベント de:code 2019 の MW52 モバイルアプリ、SPA？ ネイティブ？ UX/UI の違いと技術選択のポイント で扱うデモアプリと同内容です。ご参加できる方はセッションにもご参加いただけますとよりご理解が深まります。
また、セッションのスライドはイベント終了後公開されますので、公開され次第、こちらにもリンクを張ります。
- 郵便番号を入力すると住所が表示される。
- 郵便番号に対するバリデーションが確認できる
iOS の郵便番号検索ネイティブアプリのプロジェクト Xamarin.iOS
iOS の郵便番号検索ガワネイティブアプリのプロジェクト Xamarin.iOS (WKWebView)
Android の郵便番号検索ネイティブアプリのプロジェクト Xamarin.Android
Android の郵便番号検索ガワネイティブアプリのプロジェクト Xamarin.Android (WebView)
郵便番号検索 SPA のプロジェクト HTML5 + Vue.js