Ionicの紹介

Ionic Framework はオープンソースの UI ツールキットで、HTML、CSS、JavaScript などのウェブ技術を使って、 Angular, React, and Vue といった人気フレームワークと併用することで高性能で高品質なモバイルアプリやデスクトップアプリを作ることができます。

Ionic のインストール や First App Tutorial を参考に、主な概念を学ぶことができます。

Installation Guide

あなたのシステムの設定方法とフレームワークのインストールガイド。

UI Components

Ionic Frameworkの美しくデザインされたUIコンポーネントにダイブしましょう。

Native Functionality

BluetoothやMap、HealthKitのようなNativeデバイスプラグインの統合方法。

Theming

Ionicアプリのビジュアルデザインをブランドに合わせて簡単にカスタマイズおよび変更する方法を学びましょう。

概要

Ionic は、アプリのフロントエンドの UX と UI インタラクション（UI コントロール、インタラクション、ジェスチャー、アニメーション）に重点を置いています。学習が容易で、 Angular 、 React 、 Vue などのライブラリやフレームワークに統合することが可能です。また、シンプルな script include を使って、フロントエンドフレームワークなしでスタンドアロンで使用することも可能です。Ionic についてもっと知りたい方向けに、私たちはビデオを作成しました。ここから、基本的な使い方を学ぶことができます。

どこでもひとつのコードで

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 を使用して、信頼性の高い Web 標準テクノロジー : HTML、CSS、および JavaScript の上に構築されています。このため、Ionic コンポーネントは安定した API を備えており、単一のプラットフォーム・ベンダーの思い付きではありません。

美しいデザイン

クリーンでシンプル、機能的。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 は現在、人気の Vue3 ライブラリを公式にサポートしています。 Ionic Vue を使用すると、Vue 開発者は既存の Web スキルを使用して、iOS、Android、Web、およびデスクトップを対象とするアプリを構築できます。 @ionic/vue を使用すると、すべてのコア Ionic コンポーネントを使用できますが、ネイティブの Vue コンポーネントを使用しているように感じられます。

Future Support

他のフレームワークのサポートは、将来のリリースで検討される予定です。

Ionic CLI

公式の Ionic CLI は、Ionic アプリを迅速に構築し、Ionic 開発者に多くの役に立つコマンドを提供するツールです。CLI には、Ionic のインストールとアップデートに加えて、組み込みの開発サーバ、ビルドとデバッグのためのツールなどが含まれています。 Appflow のメンバーの場合は、CLI を使用してクラウドの構築と展開を実行し、アカウントを管理できます。

Appflow

Ionic アプリの構築、デプロイ、ライフサイクルを通じた管理を支援するために、私たちは オープンソースフレームワーク とは分離した Appflow と呼んでいる製品アプリ用の商用サービスを提供しています。

Appflow は、開発者とチームがネイティブアプリのビルドをコンパイルし、一元化されたダッシュボードから Ionic アプリにライブコードアップデートをデプロイするのを支援する。アプリストアへの直接公開、ワークフローの自動化、シングルサインオン(SSO)、接続されたサービスや統合へのアクセスなど、より高度な機能を利用するには、オプションの有償アップグレードを利用できます。

Appflow には Ionic Account が必要で、いくつかの機能を試してみたい人は無料の「Hobby」プランが付いています。

エコシステム

Ionic Framework はコアチームによって積極的に開発され、メンテナンスされており、そのエコシステムはその成長と採用を促進する開発者と貢献者の国際的なコミュニティによって導かれている。大小さまざまな開発者や企業が Ionic を使って、どこでも動くすばらしいアプリを作ってリリースしています。

コミュニティに参加する

Ionic の開発者は世界 200 か国以上に何百万人もいます。コミュニティへの参加方法をいくつか紹介します:

• Forum: A great place for asking questions and sharing ideas.
• 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.

ライセンス

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

このドキュメントコンテンツ(ionic-docsリポジトリにあります)は、Apache 2 ライセンスでライセンスされています。