統合開発環境 Eclipseによるウェブプロジェクトの開発環境を構築するため、Aptana Studioプラグインをインストールします。
なお、Aptana Studioには単体で動作するスタンドアロン版もあります。
執筆対象 Eclipseバージョン 4.4.2 (2015/07/10時点)
コンテンツのご利用 内容を十分に理解され、自らの判断と責任においてご利用ください。
ご利用の結果について当サイトは一切の責任を負いかねます。

インストール

Eclipseを起動し、ヘルプ(H) → 新規ソフトウェアのインストール... で Aptana Studioのインストールを行います。

futureinstall0111.png
追加(A)... 』をクリックし、Aptana Studioのリポジトリを登録します。
aptana0101.png
名前(N) は Aptana Studio にしています。
ロケーション(L) に
http://download.aptana.com/studio3/plugin/install
を入力します。
OK』で新規ソフトウェアのインストールに戻ります。
aptana0111.png
下記のソフトウェアを選択します。
  • Aptana Studio 3 Plugin
次へ(N) >』で次へ進みます。
aptana0112.png
インストール内容の確認画面です。

次へ(N) >』で次へ進みます。

aptana0113.png
ライセンスの確認画面です。

使用条件の条項に同意します(A)』をチェックします。

完了(F) >』でインストールが開始されます。

futureinstall0201.png
インストールの進行状況通知画面です。
restart.png
Eclipseを再起動するための確認画面です。

はい(Y)』で Eclipseの再起動を行います。

aptana0121.png
Eclipseの再起動を行うと、Aptana Studio内の PortableGitを使用して Gitの構成を行うかの確認画面が表示されることがあります。

Eclipseの Gitサポートは EGitプラグインを使用しますので、そのまま確認画面を閉じます。
その際、『Check this if you do not want to be asked again.』にチェックを入れれば、再び確認画面が表示されることはありません。

EGitではなく Aptana Studio内の PortableGitを使用する場合は『OK』で先に進みます。

Aptana Studio内の PortableGitではなく、別途インストールしている (Portable)Gitを使用する場合は、そのまま確認画面を閉じます。

設定

Eclipseを起動し、ウィンドウ(W) → 設定(P) で各種設定を行います。

チーム - Git

aptana1101.png
EGitプラグインをインストールしている場合は、Gitがふたつ表示されています。
階層のない方が Aptana Studioの Git設定になります。

Aptana Studioの Git設定を選択します。

aptana0121.png
Aptana Studio内の PortableGitを使用して Gitの構成を行うかの確認画面がここで表示される場合があります。

Eclipse再起動時に表示された場合と同じです。

aptana1102.png
Aptana Studioの Git設定です。

EGitプラグインを使用しますので、Aptana Studioの Gitサポートが使用されないように『Automatically attach our git support to projects added that have git repositories』のチェックを外します。

EGitプラグインを使用しないで Aptana Studio内の PortableGitも使用しない場合は Git Executable に別途インストールしている (Portable)Gitの git.exeの場所をフルパスで入力します。

一般 - キー

aptana1201.png
<Ctrl+Shift+U><Ctrl+Shift+D>のキーバインドに競合が発生していますので、競合しているコマンドのキーバインドを削除または変更します。

例示は <Ctrl+Shift+U>アップロード...のキーバインドを削除または変更しようとしています。

競合(F)』でコマンドを選択し、『バインディング(B)』の内容を削除するか、変更後の新しい新しいキーストロークを入力します。

<Ctrl+Shift+D>も同様に対応を行います。

SVN(Subversion)プラグイン Subversiveをインストールしている場合は <Ctrl+Alt+R><Ctrl+Alt+D>にも競合が発生していますので、同様に対応を行います。

適用(A)』で設定を反映させます。

Aptana Studio - エディター

aptana1301.png
ファイル保存時に行末のスペースを自動的に削除するため 保管アクション の『Remove trailing whitespace characters』にチェックを入れています。

適用(A)』で設定を反映させます。

Aptana Studio - テーマ

aptana1401.png
背景色や要素ごとの文字色などの設定がテーマとして多数用意されてます。

好みのテーマを選択して文字のフォントや装飾をカスタマイズします。

適用(A)』で設定を反映させます。

Aptana Studio - 検証

Aptana Studioの構文チェックについて、下記それぞれの警告を無視するように設定しています。

aptana1501.png
特殊文字を実体参照やコード参照で表現する際に、終端のセミコロン ; の後ろに空白がない場合の警告を無視するようにします。

HTML Tidy Validatorエンティティー
Unescaped or unknown entity
を『無視』に変更します。

aptana1502.png
divタグや pタグの内部が空の場合の警告を無視するようにします。

HTML Tidy Validator要素
Trim empty elements
を『無視』に変更します。

aptana1503.png
facebookや mixiなどの SNS向けの OGP(Open Graph Protocol)を導入するために記述する metaタグの propertyが独自属性と警告されますので無視するようにします。

HTML Tidy Validator属性
Proprietary attributes
を『無視』に変更します。

適用(A)』で設定を反映させます。
aptana1511.png
スタイルシートの Pointer Eventsが存在しないプロパティと警告されますので無視するようにします。

W3C スタイルシート・バリデータ
Property\s*[-_].*doesn't exist.*
を選択し、編集アイコンをクリックします。

aptana1512.png
Property\s*(-|_|pointer-events).*doesn't exist.*
に変更します。
aptana1521.png
スタイルシートの remが存在しない単位と警告されますので無視するようにします。

W3C スタイルシート・バリデータ追加アイコンをクリックします。

aptana1522.png
Value Error : .* \(http://www\.w3\.org/TR/REC-CSS2/.*\.html#propdef-.*\) Unknown dimension
を入力します。

※remだけではなく、存在しない単位すべてについて警告を無視する設定になります。

Aptana Studio - 公開 - FTP

Aptana Studioの FTPを使用してコンテンツファイル(HTML, CSS, スクリプト等)をウェブサーバーに新規アップロードする場合のパーミッションを設定しています。

aptana1601.png
アップロード/ダウンロードそれぞれについて、ファイルとフォルダー別に初期パーミッションを設定できます。 『適用(A)』で設定を反映させます。

FTP接続

編集、作成したコンテンツファイル(HTML, CSS, スクリプト等)をウェブサーバーにアップロードする際に、Aptana Studioでは FTPクライアントを起動することなく Eclipse上からアップロードすることが可能です。

接続設定

aptana2101.png
プロジェクト・エクスプローラービューで FTP接続を行うプロジェクトを右クリックで選択します。

公開 - Run Web Deployment Wizard... と進みます。

aptana2102.png
FTP/SFTP/FTPS を選択します。

次へ(N) >』で次へ進みます。

aptana2103.png
サイト名 にプロジェクトに対応させる任意の FTPサイト名を入力します。

FTPサーバー情報を入力します。

プロトコル
FTPサーバーへの接続プロトコルを選択します
リモート情報 サーバー
接続先 FTPサーバーを指定します
リモート情報 ユーザー名
接続先 FTPサーバーのユーザーを指定します
リモート情報 パスワード
接続先 FTPサーバーのユーザーパスワードを指定します
テスト』で FTPサーバーへ接続できることを確認します
保管(S)』にチェックを入れると Eclipseを再起動してもパスワードを入力せずに FTP接続ができるようになります  
リモート情報 リモート・パス
接続先 FTPサーバーでのパスを指定します
プロジェクトのルートに対応するパスになります
参照...』で FTPサーバーに接続して設定することも可能です
完了(F) >』で FTP接続の設定を終了します。

アップロード/ダウンロード

aptana2111.png
FTP接続設定を行ったプロジェクトの プロジェクト・エクスプローラービューでは 右上に『同期』『アップロード』『ダウンロード』ボタンが追加されていますので、プロジェクトやフォルダー、ファイルを選択して FTP操作を行います。

接続設定の変更

aptana2121.png
FTP接続設定の変更は、プロジェクト・エクスプローラービューの変更したいプロジェクトを右クリック → 公開 → Deployment Settings... で行います。

リモートビュー

アップロードしたファイルやディレクトリのパーミッションを変更したりする場合はリモートビューを表示させると便利です。

aptana2131.png
Eclipseツールバーから ウィンドウ(W) → ビューの表示(V) → その他(O)... と進みます。
aptana2132.png
Studio の リモート を選択します。

OK』でリモートビューが表示されます。

aptana2133.png
リモートビュー内でファイルやフォルダーを選択し、右クリック → プロパティー(R) と進みます。

※リモートビューの位置をプロジェクト・エクスプローラーの横に移動させています。

右クリック → 新規 でリモートにファイルやフォルダーを作成することもできます。

aptana2134.png
パーミッションを変更します。

フィードバック

記事の内容についてのご質問、ご指摘、その他ご意見等は下記にてお願いいたします。
System House ACT公式ブログ内記事 :
Eclipse ウェブプロジェクト開発プラグイン Aptana Studio

トラックバックまたはコメントにてお寄せください。