[ionic4入門] ionicってどんなフレームワークなの?

Ionic Docs – What is Ionic Framework?

このページでは上の公式の情報を元にざっくりとionicについて見ていきます🏭

ionicフレームワークとは?

Ionic Frameworkは、Webテクノロジ(HTMLCSS、およびJavaScript)を使用して、高性能な高品質のモバイルおよびデスクトップアプリケーションを構築するためのオープンソースのUIツールキットです。

Ionic Frameworkは、フロントエンドのユーザーエクスペリエンス、またはアプリケーションのUIインタラクション(コントロール、インタラクション、ジェスチャー、アニメーション)に焦点を当てています。学ぶのは簡単で、Angularなどの他のライブラリやフレームワークとうまく統合できます。また、単純なスクリプトを使用してフロントエンドフレームワークを使用せずにスタンドアロンで使用することもできます。

下の画像がAngularを使わず、jsとcssをindexで読み込ませた場合のionicです。


Ionic 4.0.0 Overview – YouTubeより

現在、Ionic FrameworkはAngularと公式に統合されていますが、VueとReactのサポートは開発中です。ダイビングに入る前にIonic Frameworkの詳細を知りたい場合は、基本を紹介するビデオを作成しました。

早口で聞き取れませんでした。。。

ionic 一つの到達点

今もまだまだ進化中のionicが、その一つの到達点としてできることをお伝えします。

クロスプラットフォーム

ネイティブiOS、Android、デスクトップ、プログレッシブWebアプリケーションとしてのWebなど、複数のプラットフォームで動作するアプリケーションを、1つのコードベースで構築して展開します。一度書いて、どこでも走らせてみてください!

Web標準ベース

ionic Frameworkは信頼できる標準化されたWebテクノロジー(HTML、CSS、JavaScript)の上に構築され、Custom ElementsやShadow DOMなどの最新のWeb APIを使用します。このため、Ionicコンポーネントは安定したAPIを持ち、ionicの気まぐれに付き合うことなくWeb標準を意識した開発が可能になります。

美しいデザイン

クリーンでシンプルで機能性を意識し、Ionic Frameworkは、すべてのプラットフォームですぐに使用できるように設計されています。まず基本のサンプルテーマから始めてみてください!。それにはコンポーネント、タイポグラフィ、インタラクティブなパラダイム、豪華さ(しかし拡張可能な)が設計済みです。

とにかくシンプル

Ionic Frameworkは簡単に作成できるので、Ionicアプリを作成することは楽しく、学習しやすく、Web開発スキルを持つ人なら誰でも簡単に利用できます。

ライセンス

Ionic Frameworkは、許可されたMITライセンスの下でリリースされたフリーでオープンソースのプロジェクトです。つまり、個人用または商用プロジェクトで無料で使用できます。 MITは、jQueryやRuby on Railsなどの人気プロジェクトで使用されているのと同じライセンスです。

Ionic CLI

公式のIonic CLI(Command Line Interface)は、Ionicアプリの土台作るツールであり、多くの有用なコマンドをIonic開発者に提供します。 Ionicのインストールと更新に加えて、CLIには、組み込みの開発サーバー、ビルドツールとデバッグツールなどが付属しています。 Ionic Proのメンバーであれば、CLIを使用してクラウドビルドと導入を実行し、アカウントを管理することができます。

フレームワークの互換性

以前のリリースのIonicはAngularと緊密に結合されていましたが、フレームワークのV4は、Angularのような最新のJavaScriptフレームワークを統合したスタンドアロンWebコンポーネントライブラリとして機能するように再設計されました。他にもReactやVueなどのほとんどのフロントエンドフレームワークで成功を収めていますが、一部のフレームワークでは完全なWebコンポーネントをサポートするために間になにかかませる必要があります。

 JavaScript

Ionic 4の主な目標の1つは、コンポーネントをホストするための単一のフレームワーク上のハード要件を削除することでした。つまり、コアコンポーネントは、Webページ内の単なるスクリプトタグでスタンドアロンで動作することができます。フレームワークを使って作業することは、大規模なチームや大規模なアプリケーションには効果的ですが、WordPressのようなコンテキストでも、Ionicをスタンドアロンのライブラリとして単一のページに使用することが可能になりました。

<script src="https://unpkg.com/@ionic/core@latest/dist/ionic.js"></script>

上のタグをindex.htmlに埋め込むことでシンプルにionicを使うこともできます。

Angular

AngularはいつもIonicを大きくする中心にあります。コアコンポーネントはスタンドアロンWebコンポーネントライブラリとして機能するように書かれていますが、
@ionic/angularパッケージはAngularエコシステムとの統合を容易にします。
@ionic/angularには、Angular開発者がIonic 2/3から期待するすべての機能が含まれており、AngularルーターのようなコアAngularライブラリと統合されています。

 今後のサポート

将来のリリースでは、他のフレームワークのサポートが期待されています。現在、VueとReactの公式のバインディングが開発されていますが、一部のコンポーネントはこれらのフレームワークの枠組みの外で作業します。

Ionic Framework V4+

ionic Framework V4は、パフォーマンス、互換性、および全体的な拡張性に重点を置いて、プロジェクトの基礎となるテクノロジと機能の大きな進歩です。 V4は
@ionic/angularパッケージを使用してAngularと深く統合されていますが、フレームワークに依存しないため、他のJavaScriptフレームワーク(Vue、React、Preactなど)がまったくなくてもかまいません。 V4では、Web標準に移行することで、Ionicのコアが、フレームワーク固有のモデルではなく、最新のブラウザでサポートされている標準コンポーネントモデルに依存することができます。これは、読み込み時間の短縮、パフォーマンスの向上、コード全体の削減を意味します。

Ionic Pro

ライフサイクル全体でIonicアプリを管理するため、私たちは、Ionic Proと呼ばれるプロダクションアプリ用の商用アプリケーションプラットフォームも提供しています。これは、オープンソースフレームワークとは別のものです。

他にもIonic Proは、開発者とチームがランタイムエラーを監視および追跡し、ネイティブのアプリケーションビルドをコンパイルし、集中コードのダッシュボードからIonicアプリケーションへのライブコード更新を展開するのに役立ちます。 Proはionicアカウントを必要とし、そのいくつか機能を試すことに関心のある人には無料の「スターター」プランがおすすめです。より高度な機能と規模の有料プランへのオプションのアップグレードも利用できます。

エコシステム

ionic Frameworkは、コアチームによってフルタイムで積極的に開発され、維持されています。そのエコシステムは、成長と普及を促進する国際的な開発者と貢献者のコミュニティによって導かれます。開発者や企業は、Ionicを使ってあらゆる場所で動作するすばらしいアプリを構築して出荷しています。

コミュニティに参加する

世界200カ国以上に数百万のionic開発者がいます。参加するにはいくつかの方法があります:

Content authoring:技術的なブログを書くか、あなたの話をIonicコミュニティに紹介してください。

シェアする

  • このエントリーをはてなブックマークに追加

フォローする