モバイルApp開発フレームワーク-Ionic
2663 ワード
1. Ionic
Ionicはオリジナルに近いHTML 5モバイルApp開発フレームワークで、Ionicを使用すると軽量級のハイブリッドアプリケーションを迅速に開発することができ、ウェブサイトを構築するようにアプリケーションを開発することができ、Ionicフレームワークはあなたの「ウェブサイト」アプリケーションAndroid、IOS、windows Phoneなどのモバイルデバイスを開発することができます.Ionicの最新バージョンはIonic 2 betaで、JavaScript MVVMフレームワークとAngular 2フレームワークを使用してアプリケーションを強化する強力なアプリケーションの開発を支援するUIコンポーネントを豊富に提供しています.Ionicを使ってアプリケーションを開発するには、まずHTML+CSS+JavaScriptを学びます.これは標準的なウェブ開発技術です.それから、Angularフレームワークを学ぶ必要があります.現在、Angular 2はType Script言語を使って開発されています.これらの基本技術を身につけると、自分のハイブリッドアプリケーションを開発することができます.
2.Ionic 2のインストールとHello World
IonicをインストールするにはまずNodeJSをインストールし、NodeJSが提供するnpmツールを使用してインストールします.MacまたはLinuxにsudoを追加する必要があります.-gはグローバルインストールを示す.
新規Ionicプロジェクト
新規プロジェクトディレクトリへ
ブラウザで新しいアイテムをプレビューすると、Ionicはデフォルトで開発者のためにいくつかのページを新規作成し、他のフレームワークのHello Worldに相当します.ionic serveコマンドを使用すると、ブラウザで効果をプレビューできます.
モバイルデバイスまたはシミュレータでアプリケーションを実行します.IonicアプリケーションはiOS simulator、Android simulator、Genymotion、携帯電話機器で実行できます.デバイス上で実行するにはCordovaをインストールする必要があります.Cordovaは標準的なHTML/CSS/JSをnative App上で実行できるファイルに変換することができます.CordovaはJavaScript APIを提供し、Ionicアプリケーションがカメラ、センサー、アルバムなどの携帯電話デバイスのnative機能を使用できるようにします.Cordovaは、IonicアプリケーションbuildをIOS、Android、Windows phoneアプリケーションとするツールも提供しています.Cordovaのインストール
iOSを実行する前にiOSプラットフォームを追加するには、次の手順に従います.
シミュレータで実行:
iOSデバイスで実行:まずXcodeツールをインストールすることが条件です
Androidシミュレータおよびデバイスで動作:
その後、Android SDKをインストールし、native Androidアプリケーションを開発した人はすべて使用するか、Genymotionを使用して、より速いAndroidシミュレータデバイスを使用する必要があります.インストールして次のコマンドを実行すると、シミュレータで自分のAppを実行できます.
Androidデバイスで実行:
3.開発ツール
最も一般的なのはVisual Studio Codeを使用して開発デバッグIonicプロジェクトを行い、VS codeでブレークポイントを設定してプロジェクトをデバッグすることができ、ページレイアウトを調整するときにブラウザでデバッグすることができます.私はchromeブラウザを使用しています.chromeの開発者ツールは開発者に豊富なデバッグツールを提供しています.開発者ツールのElementsでは、Webソースコードが表示され、HTMLやCSSスタイルをよりよく修正することができます.Networkには、ネットワーク要求に関するパラメータが表示されます.コンソールではログを印刷できます.
4.まとめ
工欲善其事必先利其器,框架选好,开発工具准备好后,可以享受的进行开発,在项目中写边学,これは绝えず勉强して完璧な过程で、その中で避けられないのはいくつかの曲がりくねった道を歩いて、いくつかの深い穴に入って、今后よく総括して、绝えず自分の技术を高めることができることを望みます.Android nativeの開発からIonicに移行するのは良い選択だと思います.モバイルアプリケーションもできるし、後でゆっくりと先端を回ることができます.この道が間違っていないことを望んでいます.
5. About Me:
個人用ページGitHub
Ionicはオリジナルに近いHTML 5モバイルApp開発フレームワークで、Ionicを使用すると軽量級のハイブリッドアプリケーションを迅速に開発することができ、ウェブサイトを構築するようにアプリケーションを開発することができ、Ionicフレームワークはあなたの「ウェブサイト」アプリケーションAndroid、IOS、windows Phoneなどのモバイルデバイスを開発することができます.Ionicの最新バージョンはIonic 2 betaで、JavaScript MVVMフレームワークとAngular 2フレームワークを使用してアプリケーションを強化する強力なアプリケーションの開発を支援するUIコンポーネントを豊富に提供しています.Ionicを使ってアプリケーションを開発するには、まずHTML+CSS+JavaScriptを学びます.これは標準的なウェブ開発技術です.それから、Angularフレームワークを学ぶ必要があります.現在、Angular 2はType Script言語を使って開発されています.これらの基本技術を身につけると、自分のハイブリッドアプリケーションを開発することができます.
2.Ionic 2のインストールとHello World
IonicをインストールするにはまずNodeJSをインストールし、NodeJSが提供するnpmツールを使用してインストールします.MacまたはLinuxにsudoを追加する必要があります.-gはグローバルインストールを示す.
$ npm install -g ionic@beta
新規Ionicプロジェクト
$ ionic start myIonicApp --v2
新規プロジェクトディレクトリへ
$ cd myIonicApp
ブラウザで新しいアイテムをプレビューすると、Ionicはデフォルトで開発者のためにいくつかのページを新規作成し、他のフレームワークのHello Worldに相当します.ionic serveコマンドを使用すると、ブラウザで効果をプレビューできます.
$ ionic serve
モバイルデバイスまたはシミュレータでアプリケーションを実行します.IonicアプリケーションはiOS simulator、Android simulator、Genymotion、携帯電話機器で実行できます.デバイス上で実行するにはCordovaをインストールする必要があります.Cordovaは標準的なHTML/CSS/JSをnative App上で実行できるファイルに変換することができます.CordovaはJavaScript APIを提供し、Ionicアプリケーションがカメラ、センサー、アルバムなどの携帯電話デバイスのnative機能を使用できるようにします.Cordovaは、IonicアプリケーションbuildをIOS、Android、Windows phoneアプリケーションとするツールも提供しています.Cordovaのインストール
$ npm install -g cordova
iOSを実行する前にiOSプラットフォームを追加するには、次の手順に従います.
$ ionic platform add ios
シミュレータで実行:
$ ionic emulate ios
iOSデバイスで実行:まずXcodeツールをインストールすることが条件です
$ ionic run ios
Androidシミュレータおよびデバイスで動作:
$ ionic platform add android
その後、Android SDKをインストールし、native Androidアプリケーションを開発した人はすべて使用するか、Genymotionを使用して、より速いAndroidシミュレータデバイスを使用する必要があります.インストールして次のコマンドを実行すると、シミュレータで自分のAppを実行できます.
$ ionic emulate android
Androidデバイスで実行:
$ ionic run android
3.開発ツール
最も一般的なのはVisual Studio Codeを使用して開発デバッグIonicプロジェクトを行い、VS codeでブレークポイントを設定してプロジェクトをデバッグすることができ、ページレイアウトを調整するときにブラウザでデバッグすることができます.私はchromeブラウザを使用しています.chromeの開発者ツールは開発者に豊富なデバッグツールを提供しています.開発者ツールのElementsでは、Webソースコードが表示され、HTMLやCSSスタイルをよりよく修正することができます.Networkには、ネットワーク要求に関するパラメータが表示されます.コンソールではログを印刷できます.
4.まとめ
工欲善其事必先利其器,框架选好,开発工具准备好后,可以享受的进行开発,在项目中写边学,これは绝えず勉强して完璧な过程で、その中で避けられないのはいくつかの曲がりくねった道を歩いて、いくつかの深い穴に入って、今后よく総括して、绝えず自分の技术を高めることができることを望みます.Android nativeの開発からIonicに移行するのは良い選択だと思います.モバイルアプリケーションもできるし、後でゆっくりと先端を回ることができます.この道が間違っていないことを望んでいます.
5. About Me:
個人用ページGitHub