Eclipse を使用して Azure 用の Hello World Web アプリを作成するCreate a Hello World web app for Azure using Eclipse

このチュートリアルでは、Azure Toolkit for Eclipse を使用して、Web アプリとして基本的な Hello World アプリケーションを作成し、Azure にデプロイする方法について説明します。This tutorial shows how to create and deploy a basic Hello World application to Azure as a web app by using the Azure Toolkit for Eclipse.

注意

この記事の Azure Toolkit for IntelliJ 使用バージョンについては、「IntelliJ を使用して Azure 用の Hello World Web アプリを作成する」を参照してください。For a version of this article that uses the Azure Toolkit for IntelliJ, see Create a Hello World web app for Azure using IntelliJ.

重要

Azure Toolkit for Eclipse は 2017 年 8 月に更新され、別のワークフローが導入されました。The Azure Toolkit for Eclipse was updated in August 2017 with a different workflow. この記事では、Azure Toolkit for Eclipse のバージョン 3.0.7 以降を使用して Hello World Web アプリを作成する方法を示します。This article illustrates creating a Hello World web app by using version 3.0.7 (or later) of the Azure Toolkit for Eclipse. バージョン 3.0.6 以前のツールキットを使用している場合は、レガシ ツールキットを使用した Eclipse での Azure 用 Hello World Web アプリの作成に関するページの手順に従う必要があります。If you are using the version 3.0.6 (or earlier) of the toolkit, you will need to follow the steps in Create a Hello World web app for Azure in Eclipse using the legacy toolkit.

このチュートリアルを完了し、作成したアプリケーションを Web ブラウザーで開くと、次の図のようになります。When you have completed this tutorial, your application will look similar to the following illustration when you view it in a web browser:

Hello World アプリのプレビュー

前提条件Prerequisites

この記事の手順を完了するには、Azure Toolkit for Eclipse をインストールする必要があります。これには、次のソフトウェア コンポーネントが必要です。To complete the steps in his article, you will need to install the Azure Toolkit for Eclipse, which requires the following software components:

  • Eclipse IDE for Java EE Developers Mars 以降。Eclipse IDE for Java EE Developers, Mars, or later. Eclipse の Web サイトからダウンロードできます。You can download it from the Eclipse website.

  • サポートされている Java Development Kit (JDK)。A supported Java Development Kit (JDK). Azure での開発時に使用可能な JDK の詳細については、https://aka.ms/azure-jdks を参照してください。For more information about the JDKs available for use when developing on Azure, see https://aka.ms/azure-jdks.

  • オペレーティング システム。An operating system. Azure Toolkit for Eclipse は、次のオペレーティング システムでテストされています。The Azure Toolkit for Eclipse has been tested on the following operating systems:

    • Windows 10、Windows 8.1、Windows 8、Windows 7Windows 10, Windows 8.1, Windows 8, and Windows 7
    • Windows Server 2012 R2、Windows Server 2012、Windows Server 2008 R2、Windows Server 2008Windows Server 2012 R2, Windows Server 2012, Windows Server 2008 R2, and Windows Server 2008
    • Mac OS X バージョン "Yosemite" 以降Mac OS X version "Yosemite" and later
    • Ubuntu Linux バージョン 14、15、16Ubuntu Linux version 14, 15, and 16

注意

Eclipse Marketplace の Azure Toolkit for Eclipse に関するページに、このツールキットと互換性のあるビルドが一覧表示されています。The Azure Toolkit for Eclipse page at the Eclipse Marketplace lists the builds that are compatible with the toolkit.

新しい Web アプリ プロジェクトの作成Create a new web app project

  1. [Azure Toolkit for Eclipse の Azure サインイン手順][eclipse-sign-in-instructions] の説明に従って、Eclipse を起動し、Azure アカウントにサインインします。Start Eclipse, and sign into your Azure account by using the instructions in the [Azure Sign In Instructions for the Azure Toolkit for Eclipse][eclipse-sign-in-instructions] article.

  2. [ファイル][新規][Dynamic Web Project](動的 Web プロジェクト) の順にクリックします Click File, click New, and then click Dynamic Web Project. ([ファイル][新規] のクリック後、使用可能なプロジェクトとして [Dynamic Web Project (動的 Web プロジェクト)] が表示されない場合は、[ファイル][新規][プロジェクト] の順にクリックし、[Web] を展開して、[Dynamic Web Project (動的 Web プロジェクト)][次へ] の順にクリックします)。(If you don't see Dynamic Web Project listed as an available project after clicking File and New, then do the following: click File, click New, click Project..., expand Web, click Dynamic Web Project, and click Next.)

    新しい動的 Web プロジェクトの作成

  3. このチュートリアルでは、プロジェクトに MyWebAppという名前を付けます。For purposes of this tutorial, name the project MyWebApp. 画面は次のようになります。Your screen will appear similar to the following:

    新しい動的 Web プロジェクトのプロパティ

  4. [完了] をクリックします。Click Finish.

  5. Eclipse の Project Explorer ビューで、 [MyWebApp] を展開します。Within Eclipse's Project Explorer view, expand MyWebApp. WebContent を右クリックし、[新規][JSP ファイル] の順にクリックします。Right-click WebContent, click New, and then click JSP File.

    新しい JSP ファイルの作成

  6. [New JSP File (新しい JSP ファイル)] ダイアログ ボックスで index.jsp ファイルに名前を付け、親フォルダーは MyWebApp/WebContent のままにして [次へ] をクリックします。In the New JSP File dialog box, name the file index.jsp, keep the parent folder as MyWebApp/WebContent, and then click Next.

    [New JSP File(新しい JSP ファイル)] ダイアログ ボックス

  7. [Select JSP Template (JSP テンプレートの選択)] ダイアログ ボックスで、このチュートリアルのために [New JSP File (html) (新しい JSP ファイル (html))] を選択し、[完了] をクリックします。In the Select JSP Template dialog box, for purposes of this tutorial select New JSP File (html), and then click Finish.

    JSP テンプレートの選択

  8. index.jsp ファイルが Eclipse で開いたら、"Hello World!" を動的に表示するためのテキストをWhen your index.jsp file opens in Eclipse, add in text to dynamically display Hello World! 既存の <body> 要素に追加します。within the existing <body> element. 更新された <body> コンテンツは、次のようになります。Your updated <body> content should resemble the following example:

    <body><b><% out.println("Hello World!"); %></b></body>
    
  9. index.jsp を保存します。Save index.jsp.

Azure への Web アプリのデプロイDeploy your web app to Azure

  1. Eclipse のプロジェクト エクスプローラー ビューでプロジェクトを右クリックし、[Azure][Publish as Azure Web App](Azure Web アプリとして発行) の順に選択します。Within Eclipse's Project Explorer view, right-click your project, choose Azure, and then choose Publish as Azure Web App.

    [Publish as Azure Web App (Azure Web アプリとして発行)]

  2. [Deploy Web App](Web アプリのデプロイ) ダイアログ ボックスが表示されたら、次のいずれかのオプションを選択できます。When the Deploy Web App dialog box appears, you can choose one of the following options:

    • 既存の Web アプリを選択します (存在する場合)。Select an existing web app if one exists.

      アプリ サービスの選択

    • [Create New Web App](新しい Web アプリを作成する) をクリックする。Click Create New Web App.

      App Service を作成する

      [App Service の作成] ダイアログ ボックスで Web アプリに必要な情報を指定し、[作成] をクリックします。Specify the requisite information for your web app in the Create App Service dialog box, and then click Create.

      [App Service の作成] ダイアログ ボックス

  3. Web アプリを選択し、[デプロイ] をクリックします。Select your web app and then click Deploy.

    アプリ サービスのデプロイ

  4. ツールキットにより Web アプリが正常にデプロイされると、[Azure の活動ログ] タブに [発行済み] 状態として表示され、デプロイされた Web アプリの URL へのハイパーリンクが設定されます。The toolkit will display a Published status under the Azure Activity Log tab when it has successfully deployed your web app, which is a hyperlink for the URL of your deployed web app.

    発行済み状態

  5. ステータス メッセージに表示されたリンクを使用して、Web アプリを参照できます。You can browse to your web app using the link provided in the status message.

    Web アプリの参照

  6. Web を Azure に発行した後、アプリを管理するには、それを右クリックし、コンテキスト メニューからオプションのいずれかを選択します。After you have published your web to Azure, you can manage your app by right-clicking on it and selecting one of the options on the context menu. たとえば、Web アプリを開始停止、または削除できます。For example, you can Start, Stop, or Delete your web app.

    アプリ サービスの管理

次の手順Next steps

Azure Toolkit for Eclipse の詳細については、以下のリンクを参照してください。For more information about the Azure Toolkit for Eclipse, see the following links:

Azure での Java の使用方法の詳細については、以下のリンクを参照してください。For more information about using Java with Azure, see the following links:

[Get Java JDK downloads and support when developing for Azure](https://aka.ms/azure-jdks)

Azure Web Apps の作成の詳細については、「 Web Apps の概要」を参照してください。For additional information about creating Azure Web Apps, see the Web Apps Overview.