Ionic、このフレームワークをUbuntu20.04にインストールするにはどうすればよいですか

イオンについて

次の記事では、Ionic Frameworkと、それをUbuntu20.04にインストールする方法について説明します。 このフレームワークにより、ユーザーはAngularなどの他のフレームワークを使用してプロジェクトを実装できます。。 Ionicは、DriftyCo。のMaxLynch、Ben Sperry、Adam Bradleyによって2013年に作成されたハイブリッドモバイルアプリ開発用の完全なオープンソースSDKです。元のバージョンは2013年にリリースされ、AngularJSとApacheCordovaの上に構築されました。 ただし、最新バージョンはWebコンポーネントのセットとして再構築されました。 ユーザーがAngular、React、またはVue.jsプロジェクトを実行することを選択できるようにします。 また、ユーザーインターフェイスフレームワークなしでIonicコンポーネントを使用することもできます。

イオニック 最新のWeb開発慣行とテクノロジーに基づいて、ハイブリッドデスクトップ、モバイル、プログレッシブWebアプリケーションを開発するためのツールとサービスを提供します。 このために、CSS、HTML5、SassなどのWebテクノロジーを使用できます。 このフレームワークを使用すると、iOS、Android、またはWeb自体と互換性のあるWebテクノロジーを使用してアプリケーションを開発できます。 また、プロジェクトを管理および作成できる強力なCLIツールも提供します。

イオンの一般的な特性

  • このフレームワークは無料でオープンソースです。 モバイル向けに最適化されたユーザーインターフェイスツールとコンポーネントのライブラリを提供し、高速で高度にインタラクティブなアプリケーションを作成します。
  • IonicはCordovaを使用し、 最近では、GPS、カメラ、懐中電灯などのホストオペレーティングシステム機能にアクセスするためのプラグインがあります。
  • ユーザーはアプリを作成してから、Android、iOS、Windows、デスクトップ(Electronを使用)、または最新のブラウザー用にカスタマイズできます。.
  • イオニック 可動部品、タイポグラフィ、または拡張可能な基本テーマが含まれます.
  • 使用するとき Webコンポーネント、Ionicは、それらと対話するためのカスタムコンポーネントとメソッドを提供します。 それらのコンポーネントのXNUMXつである仮想スクロールにより、ユーザーはパフォーマンスに影響を与えることなく、何千ものアイテムのリストをスクロールできます。 別のコンポーネントであるTabsは、ネイティブスタイルのナビゲーションと履歴ステータス管理をサポートするタブ付きインターフェイスを作成します。
  • SDKに加えて、Ionicは 開発者が機能を有効にするために使用できるサービスコードの実装や自動ビルドなど。
  • さらに IonicStudioとして知られる独自のIDEを提供します.
  • それはまたのインターフェースを提供します コマンドライン (CLI)プロジェクトを作成する。 CLIを使用すると、開発者は追加のCordovaプラグインとパッケージを追加したり、プッシュ通知を有効にしたり、アプリアイコンを生成したり、画面をスプラッシュしたり、ネイティブバイナリを作成したりすることもできます。

Ubuntu20.04にIonicをインストールします

このフレームワークのインストールは非常に簡単です。 開始するには、ターミナルを開いて(Ctrl + Alt + T)、 システムパッケージを更新する:

sudo apt update; sudo apt upgrade

その後、 いくつかの必要なパッケージをインストールします。 同じ端末で、次のコマンドを使用する必要があります。

依存関係をインストールする

sudo apt install curl gnupg2 wget git

次のステップは NodeJSをインストールします。 私がバージョンでテストしたこの例 14.x。 このバージョンをインストールするには、 必要なリポジトリを追加することから始めます:

リポジトリnodejsを追加します

curl -sL https://deb.nodesource.com/setup_14.x | sudo bash -

その後、私たちはすることができます インストール NodeJS この他のコマンドの実行:

nodejsをインストールします

sudo apt install nodejs

IonicにはApacheCordovaが必要です。 これは、モバイルアプリケーション開発者がJavaScriptを使用して、カメラや加速度計などのデバイスのネイティブ機能にアクセスできるようにする一連のデバイスAPIであることを明確にする必要があります。

NodeJSをインストールした後、次のことができます コルドバをインストールする ランニング:

コルドバのインストール

sudo npm install -g cordova

この時点で、次に進むことができます npmを使用してIonicをインストールします:

npmを使用したインストール

sudo npm i -g @ionic/cli

インストール後、 コマンドでインストール済みバージョンを確認する:

イオンバージョン

ionic -v

サンプルアプリケーション

インストールが正しく行われたかどうかを知るために、小さなサンプルアプリケーションを作成することから始めることができます。 これを行うには、 次のコマンドを実行して例を作成します:

ionic start

このコマンドを実行するとき 作成するプロジェクトの種類を定義する必要があります。 この例では、Angularを選択しました。 さらに、プロジェクトに名前を付けてテンプレートを選択する必要があります。 これはすべて、次のような画面から選択する必要があります。

イオンスタート

セットアップ後、 プロジェクトに付けた名前でフォルダが生成されます。 このフォルダにアクセスして、プロジェクトの構造を確認してください.

例の起動手順

プロジェクトを見る、同じ端末で、次の別のコマンドを実行します。

サーバーを起動します

ionic serve --host 0.0.0.0 --port 8000

このコマンドで すべてのホストがポート8000​​にアクセスできるようにします.

必要なものがすべて読み込まれると、 Webブラウザーを開いて、 http://localhost:8000 o http://IP-de-tu-servidor:8000 作成したばかりのサンプルページが表示されます.

応用例

Ionicは、クロスプラットフォームアプリケーションをシンプルかつエレガントな方法で開発できるようにする最新のフレームワークです。 入手できます でのインストールと操作に関する詳細情報とドキュメント プロジェクトのウェブサイト.


コメントを残す

あなたのメールアドレスが公開されることはありません。 必須フィールドには付いています *

*

*

  1. データの責任者:MiguelÁngelGatón
  2. データの目的:SPAMの制御、コメント管理。
  3. 正当化:あなたの同意
  4. データの伝達:法的義務がある場合を除き、データが第三者に伝達されることはありません。
  5. データストレージ:Occentus Networks(EU)がホストするデータベース
  6. 権利:いつでも情報を制限、回復、削除できます。