# Telerik からの移行

このページでは、Telerik AppBuilder プロジェクトを Monaca に移行するための簡単な手順を解説します。Monaca を使って telerik プロジェクトの実行、テスト、デバッグ、ビルドを行うことができます。

## ステップ 1: 準備

Telerik ツールを使用してプロジェクトを Cordova プロジェクトに変換します。 次に、プロジェクトを ZIP ファイルに圧縮します。

## ステップ 2: Monaca クラウド IDE へのインポート

1. Monaca [ダッシュボード](https://monaca.mobi/ja/dashboard)から、`インポート` を選択します。
2. プロジェクト名を入力し、`プロジェクトのパッケージをアップロード` オプションを選択します。 次に、プロジェクトの ZIP ファイルを参照します。

![](/files/-MgYqSaEsDUsWb9Tz9dO)

&#x20;   3\. `インポート` をクリックして、プロジェクトをMonaca にインポートします。

&#x20;   4\. Monaca クラウド IDE でプロジェクトを開くには、`開く` をクリックします。

![](/files/-MgYqhcNsobKgrzGHAAF)

&#x20;   5\. IDE が表示されたら、[プレビュー](/products_guide/monaca_ide/overview.md#pureby) でアプリを表示できます。

![](/files/-MgYqqEu9inDw-WlU_sA)

{% hint style="info" %}
Ajax リクエストまたは Cordova API が使用されている場合、プレビューウィンドウの表示や操作が正しく機能しないことがあります。詳しくは、[ プレビューの制限 ](/products_guide/monaca_ide/overview.md#purebyno)を参照してください。 この場合は、Monaca デバッガーを使用してプロジェクトを テスト/デバッグ することができます (次の項目で解説します) 。
{% endhint %}

## ステップ 3: Monaca でのデバッグ

[Monaca デバッガー](/products_guide/debugger.md) は、端末上で Monaca アプリをリアルタイムでテスト、デバッグするためのアプリケーションです。Monaca クラウド IDE で Monaca アプリを開発する場合、プロジェクトファイルに加えられた変更は、保存後すぐに Monaca デバッガーに同期されます。

Monaca デバッガーの使い方は、以下になります。

1. Google Play または App Store から端末に Monaca デバッガーをインストールします。

[![](https://docs.monaca.io/images/monaca_ide/tutorial/testing_debugging/App_Store.jpg) ](https://itunes.apple.com/us/app/monaca/id550941371?mt=8)[![](https://docs.monaca.io/images/monaca_ide/tutorial/testing_debugging/Google_play.png)](https://play.google.com/store/apps/details?id=mobi.monaca.debugger\&hl=en)

{% hint style="info" %}
Android エミュレータに Monaca デバッガーをインストールする場合は、 [Android エミュレーター向け Monaca デバッガー ](/products_guide/debugger/installation/debugger_emulator.md)を参照してください。
{% endhint %}

&#x20;   2\. Monaca デバッガーを起動し、Monaca アカウントでサインインします。 Monaca クラウド IDE と同じアカウントを使用していることを確認してください。

![](/files/-MgYrQ11yQ2acg1NaBn0)

&#x20;   3\. プロジェクトを実行するには、Monaca デバッガーのプロジェクト名をタップするか、Monaca クラウド IDE の `実機で実行` をクリックします。

![](/files/-MgYr_Eo0Sg5Q3usxupS)

&#x20;   4\. プロジェクトが Monaca デバッガーで実行されているはずです。 プロジェクトのさまざまな操作を試してみてください。

&#x20;   5\. Monaca クラウド IDE からプロジェクトのソースコードを変更し、保存します。 Monaca デバッガーに変更が反映されます。

## ステップ 4: アプリのビルド

デバッグの次は、ビルドを行います。このステップでは、Android 用デバッグビルドについて解説します。

1. Monaca クラウド IDE から `ビルド → Androidアプリのビルド` を選択します。

![](/files/-MgYrfp5Gs4dW3hXUBPJ)

&#x20;   2\. デフォルトでは、デバッグビルドが選択されています。`ビルドを開始する` をクリックすると、ビルド画面が新しいタブで開かれます。

![](/files/-MgYrmWWZJESIMHrxwsX)

&#x20;   3\. ビルドが完了するまでに数分かかる場合があります。ビルドが正常に完了すると、次の画面が表示されます。ビルドアプリを端末にインストールするさまざまな方法を選択することができます。

![](/files/-MgYropOYmFp4vnN-i2T)

## 備考

プロジェクトを Monaca に移行する際には、次のような注意点があります。

### サードパーティー製プラグインを使用する場合

Google Play または App Store で公開されているストア版 Monaca デバッガーには、[基本プラグイン](/reference/core-cordova-plugins.md) のみが含まれています。プロジェクトに 基本プラグイン以外のサードパーティー製プラグインが含まれている場合は、プロジェクトをテストするカスタムデバッガーをビルドする必要があります。カスタムデバッガーには、プロジェクトで使用されているプラグインのみが含まれます。 詳しくは、以下を参照してください。

* [カスタムビルド版 Monaca デバッガーのビルド方法 ( iOS )](/products_guide/debugger/installation/debugger_ios.md#kasutamubirudo-monaca-debaggnobirudo)
* [カスタムビルド版 Monaca デバッガーのビルドとインストール ( Android )](/products_guide/debugger/installation/debugger_android.md#kasutamubirudo-monaca-debaggnobirudotoinsutru)

### JS/CSS コンポーネントページを使用する場合

Monaca クラウド IDE には、CSS/JavaScript ライブラリを追加するためのページがあります。`設定 → JS/CSSコンポーネントの追加と削除` を選択すると、次のページが表示されます。

![](/files/-MgYsAwUR2p4lpyvZI8h)

このページでは、さまざまな CSS/JavaScript ライブラリを追加することができますが、実際にプロジェクトで利用するためには、`index.html` ファイルに、次の 2 行を記述する必要があります。

```markup
<!--Load selected JavaScript libraries-->
<script src="components/loader.js"></script>
<!--Load selected CSS libraries-->
<link rel="stylesheet" href="components/loader.css”>
```

`loader.js` ファイルには、 `cordova.js` ファイルをロードするための設定が追加されているため、上記を追加した場合は、次の行を削除することができます。

```markup
<script src="cordova.js"></script>
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://ja.docs.monaca.io/products_guide/migration/telerik_migration.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
