Ionic Framework
Ionic FrameworkはオープンソースのUIツールキットで、HTML、CSS、JavaScriptなどのウェブ技術を使って、 Angular や React といった人気フレームワークと併用することで高性能で高品質なモバイルアプリやデスクトップアプリを作ることができます。
Ionicのインストール や 初めての開発 を参考に、主な概念を学ぶことができます。
システム設定とフレームワークのインストールのガイドです。
Ionic Frameworkの美しくデザインされたUIコンポーネントをまとめて見ることができます。
BluetoothやMap、HealthKitのようなNativeデバイスプラグインの統合方法
Ionicアプリのビジュアルデザインをブランドに合わせて簡単にカスタマイズおよび変更する方法を学ぶ
概要
Ionic Frameworkは、UIコントロール、インタラクション、ジェスチャ、アニメーションなど、アプリのフロントエンドUXとUIインタラクションに焦点を当てています。覚えるのは簡単で、 Angular、 React や Vue 上で利用することができます。また、シンプルにscriptタグに含めて、フレームワークなしでスタンドアロンで利用することもできます。Ionic Frameworkについて詳しく知りたい人のために、私たちは基本的な順を説明したビデオも提供しています。
どこでもひとつのコードで
Ionicは、ウェブ開発者がすべての主要アプリストアとモバイルウェブ用のアプリを単一のコードベースから構築できるすばらしいモバイルアプリスタックです。また、Adaptive Stylingによって、Ionicアプリはすべてのデバイス上で適切な外観と操作感を提供します。
パフォーマンスにフォーカス
Ionicは、効率的なハードウェアアクセラレーション、タッチに最適化されたジェスチャなどのベストプラクティスにより、最新のモバイルデバイスで優れたパフォーマンスと動作を実現するように設計されています。
クリーンでシンプル、機能的なデザイン
Ionicは、現在のすべてのモバイルデバイスおよびプラットフォームで美しく動作し、表示するように設計されています。事前に用意されたコンポーネント、タイポグラフィ、各プラットフォームに対応したすばらしい(まだ拡張可能な)ベーステーマにより、スタイルを構築できます。
ネイティブおよびWebに最適化
IonicはネイティブアプリケーションのUIガイドラインをエミュレートし、ネイティブSDKを使用して、ネイティブアプリのUI標準とデバイス機能を、オープンWebの完全なパワーと柔軟性とともに実現します。IonicはCapacitor(またはCordova)を使ってネイティブにデプロイするか、Progressive Web Appとしてブラウザで実行します。
ゴール
クロスプラットフォーム
ネイティブのiOS、Android、デスクトップ、Webなど、複数のプラットフォームで動作するアプリをProgressive Web Appとして、すべて1つのコードベースで開発、デプロイすることができます。一度書けば、どこでも実行できます。
Web標準
Ionic Frameworkは、Custom ElementsやShadow DOMなどの最新のWeb APIを使用して、信頼性の高い
美しいデザインBeautiful Design
クリーンでシンプル、機能的。Ionic Frameworkは全てのプラットフォームで動作し、美しく表示されるように設計されています。 あらかじめデザインされたコンポーネント、タイポグラフィ、インタラクティブなパラダイム、すばらしい(まだ拡張可能な)基本テーマから始めます。
シンプル
Ionic Frameworkはシンプルさを念頭に置いて構築されているので、Ionicアプリを作成することは楽しく、簡単に学ぶことができ、ウェブ開発スキルを持っている人なら誰でも簡単にアクセスすることができます。
Frameworkの互換性
Ionicの過去のリリースはAngularと密結合されていましたが、フレームワークのバージョン4.xからはスタンドアロンのWeb Componentライブラリとして動作するように再設計され、Angularのような最新のJavaScriptフレームワークと併用できるようになりました。IonicはReactやVueを含むほとんどのフロントエンドフレームワークで使用できますが、Webコンポーネントを完全にサポートするにはshimが必要なフレームワークもあります。
JavaScript
Ionic Frameworkを Web Components に移行する主な目標のひとつは、コンポーネントをホストする単一フレームワークのハード要件を取り除くことだった。これにより、コアコンポーネントは、scriptタグだけでWebページ内でスタンドアロンで動作できるようになりました。フレームワークを使って作業することは大規模なチームや大規模なアプリにとっては素晴らしいことですが、IonicをWordPressのようなコンテキストでも、単一ページのスタンドアロンライブラリとして使用することが可能になりました。
Angular
Angularは常にIonicの素晴らしさの中心にありました。コアコンポーネントはスタンドアロンのWeb Componentライブラリとして動作するように書かれていますが、
@ionic/angular パッケージはAngularエコシステムとの統合を簡単にします。
@ionic/angular はIonic 2/3に期待されるすべての機能を含んでおり、AngularルータのようなコアAngularライブラリと統合されています。
React
Ionicは現在、人気のReactライブラリを公式にサポートしている。Ionic Reactを使うと、React開発者は既存のWebスキルを使って、iOS、Android、Web、デスクトップをターゲットにしたアプリを作ることができます。@ionic/reactを使えば、すべてのコアIonicコンポーネントを、ネイティブなReactコンポーネントを使っているような感覚で使用することができます。
将来的なサポート
将来のリリースでは他のフレームワークもサポートされる予定です。現在、Vueの公式バインディングは開発中ですが、フレームワークによってはすぐに使えるコンポーネントもあります。
Ionic CLI
公式の
Ionic Appflow
Ionicアプリの構築、デプロイ、ライフサイクルを通じた管理を支援するために、私たちはオープンソースフレームワークとは分離したmIonic Appflowと呼んでいる製品アプリ用の商用サービスを提供しています。
Appflowは、開発者とチームがネイティブアプリのビルドをコンパイルし、一元化されたダッシュボードからIonicアプリにライブコードアップデートをデプロイするのを支援する。アプリストアへの直接公開、ワークフローの自動化、シングルサインオン(SSO)、接続されたサービスや統合へのアクセスなど、より高度な機能を利用するには、オプションの有償アップグレードを利用できます。
Appflowには Ionic Account が必要で、いくつかの機能を試してみたい人は無料の「Hobby」プランが付いています。
エコシステム
Ionic Frameworkはコアチームによって積極的に開発され、メンテナンスされており、そのエコシステムはその成長と採用を促進する開発者と貢献者の国際的なコミュニティによって導かれている。大小さまざまな開発者や企業がIonicを使って、どこでも動くすばらしいアプリを作ってリリースしています。
コミュニティに参加する
Ionicの開発者は世界200か国以上に何百万人もいます。コミュニティへの参加方法をいくつか紹介します:
- Forum: A great place for asking questions and sharing ideas.
- Slack: A lively place for devs to meet and chat in real time.
- Twitter: Where we post updates and share content from the Ionic community.
- GitHub: For reporting bugs or requesting new features, create an issue here. PRs welcome!
- Content authoring: Write a technical blog or share your story with the Ionic community.
License
Ionic Framework is a free and open source project, released under the permissable MIT license. This means it can be used in personal or commercial projects for free. MIT is the same license used by such popular projects as jQuery and Ruby on Rails.
This documentation content (found in the ionic-docs repo) is licensed under the Apache 2 license.