ユーザ用ツール

サイト用ツール


ionic.html

スマホアプリ作成ソフトIonic

Ionic3目次

Ionic4目次

Ionicのためのjavascript tips

Ionicとは

Ionicは、Drifty社による、スマホアプリ作成のためのフレームワークです。

https://ionicframework.com/

HTML、CSS、Javascriptと、Ionic特有の使い方を学べば、無料で動的ホームページ、Androidアプリ、iPhoneアプリを比較的簡単に作成することができます。

iPhoneアプリ作成にはMacパソコンが必要です。私は現時点ではMacは持っていないので、このサイトでは、Windowsパソコンを用いて、Androidアプリを作成する経過のメモを記載させていただきたいと思います。

なぜIonicを使うのか?

スマホアプリ作成といえば、iPhoneならSwiftという言語、androidならJavaという言語で作成するのがスタンダードであり、それらの言語を用いて作成した方が、アプリの容量も小さく、スピードも速いです。

統合開発環境としても、Android Studioという使いやすい無料ソフトもあります。

しかし、ド素人の私がAndroid StudioでJavaのコードを見たときは、その複雑さに一瞬でやる気を失いました。たしかに、JavaScriptのコードを見ても、最初のうちは「気持ち悪い」と思っていたのですが、動的サイト作成のためにはJavaScriptの勉強は避けて通れません。スマホアプリ(Androidアプリ)作成のためには、JavaとJavascriptのどちらかは使わなければならないとなったとき、Webサイト作成にも応用が効くJavaScriptを選ぶことにしました。

私がスマホアプリを作ってみたいなと思ったのは2017年3月頃でした。JavaScriptを用いたスマホアプリを作成ソフトは複数あり、いくつか試してみたのですが、

  • Windowsパソコンで環境構築が簡単で、
  • あらかじめBootstrapのようなデザイン機能がついている

Ionic2を選んでみました。デメリットとしては、

  • 日本語の解説がほとんど無い(これはまずい。。。)
  • なんと6カ月おきにVersion変更があり、ついていくのがむちゃくちゃ面倒
  • Javaでandroidアプリを作成するより、おそらく、アプリの容量が大きくなったり、スピードが遅くなってしまう

といったところはあると思います。

その他、スマホアプリ作成ソフトとしてお勧めは、Unityがあります。スマホゲームを作成するのであれば、C#(シーシャープ)というプログラミング言語を用いてのUnityで作成するのがお勧めです。蛇足ですが、Unity入門でお勧めの本は、Unity5の教科書(Amazonへのリンク)です。

Ionic3でお勧めの本

2018年2月現在、Ionicの日本語の本は以下の一つのみだと思います。Mac OSでの説明になりますが、Windowsでもほぼ同じです。非常に分かりやすく、お勧めです。

Ionicのバージョンについて

2015年5月 Ionic1.0.0(AngularJS1対応)
2017年1月 Ionic2.0.0(Angular2対応)
2017年4月 Ionic3.0.0(Angular4対応)
2019年1月 Ionic4.0.0(Angular7対応)
のようにリリースされています。元ネタであるAngularは、2012年6月にバージョン1.0.0が、2016年9月にはアーキテクチャを一新したバージョン2.0がリリースされています。Ionic1とIonic2は全く互換性が無い別物ですので、2016年6月以前のIonic情報は参考にしない方が良いと思います。Ionic3とIonic2は、劇的な変化は無いので、小さな違いはありますが、基本的には同じです。

(参考)
Ionic3からIonic4への変更点

https://yukiyuriweb.com/migrate-ionic2-app-to-ionic3/
Ionic 2.x.xからIonic 3.0.xへ移行する方法とIonic 3.0.0での変更点のまとめ
2018年5月25日更新

http://tech.pjin.jp/blog/2017/05/23/ionic3-cli/
ionicのCLIコマンド変更メモ
2017/5/23 nakaji

その他のリンク

https://developer.medley.jp/entry/2017/11/24/120000

20171124
フロントエンドエンジニアがIonicを触ってみた〜メドレーTechLunch〜

スマホアプリ作成ソフトIonic3

スマホアプリ作成ソフトIonic4

Ionicのためのjavascript tips

リンク

ionic.html.txt · 最終更新: 2019/03/02 by adash333

Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki