Aptana Studio と Subversion 統合

Web 開発向けの統合環境に Aptana Studio がありますが、これに Subclipse を入れてバージョン管理を使うお話です。 Eclipse for PHP Developer でも同様にインストールできるはずです。 🙂

一応、Web サイトいじりのための Ubuntu (その2) の続きですが、今回は OS があまり関係ないのでタイトル変更。

前回。

Web サイトいじりのための Ubuntu (その2)

前回に引き続きまして、Web サイトいじりのための Ubuntu (その2)です。 WordPress 個人ブログなどをレンタルサーバに持っている方向けの、Ubuntu Tips。 前回は SSH でレンタルサーバに鍵認証で接続して、Nautilus と統合までしましたので、その次に進んでみます。

では張り切って行ってみましょう。

まずは Aptana Studio 3 のインストールから書いてみたいと思います。

実は Studio 3 はまだ beta なのですが、ベースの Eclipse が最新の Helios SR1 のようなのでこちらを選択しています。

Aptana Studio 3 Beta

The professional, open source development tool for the open web

Develop and test your entire web application using a single environment. With support for the latest browser technology specs such as HTML5, CSS3 and JavaScript; and Ruby, Rails, PHP & Python on the server side. We’ve got you covered!

ダウンロードに進んで Standalone 版の.zip を取得します。 オフィシャルでは Windows / Mac OS X / Linux に対応しているようです。 ここでは Linux 版をサンプルに。 他の OS でも同じだと思います。

Eclipse for PHP Developer にしたい方はこちらより。

まずは、適当な場所に .zip を展開。 ~/apps の下にいれてみました。

aptana02

実行ファイルをダブルクリックで起動します。 Linux の場合は AptanaStudio3 というファイルです。

aptana01

これだけでインストール完了です。

Aptana は Eclipse ベースですので、様々な Eclipse のプラグインが動作します。 ここから、Subversion にアクセスするために、Subclipse というプラグインをインストールしていきます。

Help –> Install New Software を選択します。

aptana03

Subclipse の配布アップデートサイトの URL を指定します。

URL 入力後エンターすると選択がでてきますので、Core SVNKit と Subclipse を選択します。 (Windows の方は SVNKit いらないですが、どうも経験的にネイティブ版はつながらないことがあるのでこっちのほうがいいかもです)

aptana04

で、次へ次へくらいで Aptana 再起動後インストール完了です。(途中、署名関係でワーニングがでます。)

起動したら SVN の設定をします。 Window –> Preference から SVN をたどります。 上のテキストボックスに SVN をいれるとフィルターできて便利です。

で、SVN インターフェースを SVNKit (Pure Java) にしてください。 これで Aptana からリポジトリに接続できるようになりました。

aptana04-02

さっそく WordPress のリポジトリに接続してみます。 右上のパースペクティブ選択ボタンから Other を選択します。

aptana05

Eclipse は画面に表示される部品のことをビューと呼び、そのセットのことをパースペクティブと呼びます。 ビューを使いやすいように配置しておいてパースペクティブに記憶させておく感じです。

Subclipse には Subversion アクセスに便利なビューを記憶したパースペクティブがデフォルトでありますのでそれを選択して画面を切り替えます。

aptana06

できたら、 SVN リポジトリビューにリポジトリを追加します。 右クリックから、新規 –> リポジトリ・ロケーションあたりを選択。

aptana07

でもって、リポジトリの URL を入力します。

WordPress の場合は上記になります。

aptana08

Finish 押下。 リポジトリの内容がでてきます。 🙂

リポジトリのビューで便利なのが、タグ通しの比較です。 たとえば、3.0.1 と 3.0.2 を選択して「ユニファイド Diff ファイルの生成」。

aptana09

このようにタグ通しを比較して、ファイルの diff もクリックから見ることができます。 何が変更になったのかなというときに役に立ちます。

aptana10

ちなみに、Aptana ではなく Eclipse for PHP Developer (2.2) をお使いの方は上記操作が Nullpointer Exception でおちてしまいます。 これは不具合で現在作成中の 2.2.1 では fix されているようです。

Bug 326227 – Cant doubleclick on file for comparing files in svn commit dialogue

Roy Ganor 2010-10-11 17:45:57 EDT

(In reply to comment #5)
> I have a similar problem on 64-bit Ubuntu running PDT
> 2.2.1.v20100826-1100-53184QAN4IJShLXONIZhXX4Na9Od
> 
> Will the fix posted above address all systems?

Please use this update site that includes a fix to this issue:
http://download.eclipse.org/tools/pdt/updates/2.2/milestones

とのことですので、上記アップデートサイトをしていして PDT をマイルストーンビルドにしてしまうといいかもしれません。(ぼくはしました)

では次に、リポジトリからファイルをチェックアウトしてみます。

落としたいタグなどを選択してチェックアウト。 遊びなら trunk (開発版)を落とした方がおもしろいかもですね。

aptana11

「新規プロジェクト~」を選択。

aptana12

PHP なので PHP プロジェクトにします。 PDT の方は PHP->PHPプロジェクトくらいにあります。

aptana13

ここが重要。 もしファイルをそのまま動かしたい場合は、チェックアウト場所を Apache の htdocs 配下にします。 これで、Aptana で修正しながらブラウザで確認できます。

aptana14

ぼくは、~/workspace/htdocs が Apache のドキュメントになっているのでそこを指定しています。 xampp を直で使っている場合は、 /opt/xampp/htdocs の下とかですね。 でもって、フィニッシュ。

チェックアウトが終わったらチェックアウトした場所に普通にファイルがありますので、ディレクトリのアクセス権限とかを指定して、Apache 経由でブラウザからアクセスすれば Hello, WordPress となることでしょう。 🙂

aptana15

チェックアウトしたプロジェクトは、右のエクスプローラの右クリックから「Team」配下の操作でいろいろできます。

コアを間違って修正したものを戻したり、プロジェクト全体のタグの向き先をかえたりできます。 また、trunk を落とした場合は日々の WordPress コアチームのコミットがおちてきます。 コミットコメントとかもみれますので、進化が見れて面白いです。

また、Eclipse Mylyn を使うと trac との連携も可能です。

hiromasa.another :o)» Blog Archive » WordPress と Eclipse と

さらに Eclipse には Mylyn という仕組みが備わっていて、ソースコード管理とタスクを結びつけることができます。 タスク、、というのはそう、WordPress Trac。

さて、今回は WordPress のリポジトリを直接指定していますが、自分でつくったリポジトリであるとコミット操作もできるようになりますので、版数管理がとても便利になります。 お客さんに納品した時点のものをタグきったり、差分をとったりですね。

ぼくはローカルサーバの CentOS にリポジトリをたてていますが、いきなりサーバたてるのは結構大変なので、まずはプライベートリポジトリをフリーで貸してくれる assembla とかで試してみるといいかもしれません。

ファイルの管理というのはなかなか神経をつかう上間違いやすいものですので、こういったバージョン管理の仕組みを使うと精神衛生上もよいですね。 よければお試しください。 🙂

Web サイトいじりのための Ubuntu (その2)

前回に引き続きまして、Web サイトいじりのための Ubuntu (その2)です。 WordPress 個人ブログなどをレンタルサーバに持っている方向けの、Ubuntu Tips。 前回は SSH でレンタルサーバに鍵認証で接続して、Nautilus と統合までしましたので、その次に進んでみます。 🙂

hiromasa.another :o)» Blog Archive » Web サイトいじりのための Ubuntu (その1)

ここみたいな個人 WordPress サイト(レンタルサーバのPHPアプリ)をいじる感じ向けの Ubuntu Tips を書いていこうと思います。 そうじゃないのも混ざってくるかもですがよろしくおつきあいを。

Linux を使っていると GUI と CUI のハイブリットが使えて結構便利ですが、GNOME の場合、Nautilus ファイルマネージャに以下の拡張をいれると表示ディレクトリを cd することなく端末に開いてくれるようになり、両利用が使いやすくなります。

後で使いますので、とりあえずいれておきましょう。 🙂

sudo apt-get install nautilus-open-terminal

さて、今回のテーマはレンタルサーバのファイル編集。

前回 SSH で接続しましたので、Nautilus ファイルマネージャからローカルファイルを転送できるようになりましたが、実は Nautilus はリモート側のファイルを直接編集することができます。

Nautilus の SSH 接続は内部的に Linux の FUSE (Filesystem in Userspace) と GNOME の gvfs で実装されていますが、これはリモートコンピュータをローカルディレクトリにマッピングしている感じの動作になります。 ゆえに、そこのファイルをアプリで書き換えるとうまいことリモートが書き換わります。

理屈は抜きに実践は簡単。 普通にレンタルサーバのディレクトリを Nautilus で開いて…

ubuntu1101

こうですら。 いちいちローカルにファイル落として編集後転送し直す必要はありません。

たとえば Geany テキストエディタで編集して保存すればそれだけでレンタルサーバ側が更新できます。 ローカルでの確認の必要ないちょいなおしの場合、急ぎの場合に非常に便利です。

# ぼくの環境だけかもですが Ubuntu 10.04 のときは保存後ファイルが 0byte になる不具合がでたことがあるので、初めてやるときは一応バックアップとってからやってください。 10.10 では問題ないようです。

さてこんなことやっていると、サーバ側がマスターになりはじめ何がなんだかになってしまいますが、UNIX の rsync というコマンドを使うとリモート –> ローカルに同期コピーしておくことができます。

これは wp-content 配下の画像ファイルなどのバックアップにも有効ですので、たまに実行しておくとよいです。

まずはローカルのどこかにディレクトリを作成して以下のファイル構成にします。 current ディレクトリは空です。

ubuntu1102

backup.sh の内容を以下のように作成します。

#!/bin/sh
 
rsync -avz --delete [ユーザ名]@[接続先ホスト名]:/[バックアップするディレクトリ]/ ./current/

コアサーバ/XREA 系であればこんなかんじです。 最後のスラッシュとか気をつけてください。 ぼくは面倒なので public_html 配下をフルバックアップとっていますが、wp-content の下だけでもいいかもしれません。

rsync -avz --delete another@s8.coreserver.jp:/virtual/another/public_html/ ./current/

できたら、backup.sh に実行権限をつけます。「プログラムとして実行できる。」

ubuntu1104

でもって、Nautilus から先にインストールした「端末の中で開く」を行って、

ubuntu1102

ターミナルをひらいて、、

./backup.sh

これで、ドヴァーっとファイルがリモートから転送されてきます。 ログイン認証は、前回の鍵認証をつかってくれます。 初回はホスト登録をきいてくるかもしれないので、”yes” してください。

初回なのでリモートファイルが全部転送されてきます。 この場合コアサバとかだと転送制限かたまにとまりますので、何回か試行します。 差分で持ってきますのでそのうち error なしで終わるはずです。

エラーの場合。 rsync error の文字列がみえます。

rsync: connection unexpectedly closed (255369687 bytes received so far) [receiver]
rsync error: error in rsync protocol data stream (code 12) at io.c(601) [receiver=3.0.7]
rsync: connection unexpectedly closed (1345764 bytes received so far) [generator]
rsync error: unexplained error (code 255) at io.c(601) [generator=3.0.7]

うまくいった場合。

sent 836 bytes  received 1668777 bytes  90249.35 bytes/sec
total size is 1139108950  speedup is 682.26

一度全部取得すれば、あとは差分でとってくれますのでたまに実行してあげるとファイルバックアップになってよいでしょう。 🙂

WordPress のバージョンアップ前など、必要に応じて current を別にコピーしておくとそちからバージョンアップ前に復元できます。(もちろんその前に DB も戻しが必要がありますね)

あとこの current ディレクトリはあくまでバックアップとしてここのファイルは編集しないほうがよいでしょう。 編集する場合は他にコピーしてからという方向で。

また、Ubuntu の場合、Ubuntu One 監視ディレクトリでこの操作を行うと、自動的にクラウド側にさらにバックアップできることになります。 Dropbox Linux 版でも同様にできるのかな。 便利ですね。

というわけで、以上その 2 でした。 次は、subversion についてか、xampp のインストールか、、ちょっと古くてよければ関連記事(↓)にでていると思いますので先にそちらを。 😀

ぼのを 「ちょっぱーを寝かせてきます。」

    W      W
 ( '∇')(´—`)
ヽ| P |人| P |ノ

Web サイトいじりのための Ubuntu (その1)

ここみたいな個人 WordPress サイト(レンタルサーバのPHPアプリ)をいじる感じ向けの Ubuntu Tips を書いていこうと思います。 そうじゃないのも混ざってくるかもですがよろしくおつきあいを。

Web サイトを配置するレンタルサーバは Linux や BSD など UNIX 系の OS が大半ですので、いじるクライアントも UNIX 系にしておくと何かと都合がよいものです。 またこういった知識があると、レンタルサーバ側での操作の理解も深まります。 🙂

さて、UNIX 系の OS を触ることの最初の関門はターミナルでしょうか。 インターネットを検索しても操作説明がコマンドベースで書かれていることも多いです。

ということで、まずはコマンドシェル (bash) の練習3つしておきましょう。

ubuntu1001

その1。 コマンド補完。

入力するパスなどを正確にキーボードから入力するのはなかなか大変なものです。 そんなときは、途中までうってTAB キーを押下しましょう。 ユニークに認識できる部分まで入力されていれば勝手に入りますし、ユニークまであと一歩なら候補をだしてくれます。 とりあえず、TAB 連打でなんとかなる! (笑)

その2。 ヒストリー。

さっきうったコマンドや、いつもよく入力するコマンドををもう一回うちたいなって場合は、とりあえずカーソルのキー上下でたどることができます。 近くにあることがわかっている場合はこれでよい。

結構昔にうったなぁって場合は、いくつか方法がありますが CTRL + r 押下で後方検索してもらうのがひとつ。 また $ history | grep 文字列 で検索後、でてきた左の番号を $ !番号 で実行するという方法も覚えておくと便利かもしれません。

その3。 ショートカットキー。

カーソルキーの移動にショートカットキーを使うと便利です。 カーソルキーに慣れている人でもネットブックとか小さいキーボードを使うときに覚えておくと、有効性が分かると思います。

ヒストリ表示などカーソル上下相当。 CTRL + p, CTRL + n。

カーソル左右。 CTRL + f, CTRL + b。

Home, End キー相当。 CTRL + a, CTRL +e。

Backspace キー相当。 CTRL + h。

とりあえずこれだけ覚えておけば便利に使えると思います。 だいたいのキーは英語スペルの頭文字です。 forward とか back とか previous とか next とかですね。

ちなみにこれができると emacs がそのまま使えます。 nano エディタもこのアサインで操作できますね。 vi のキーアサインといっしょに使っていると頭がおかしくなりそうになりますが(笑)

では実践。 Web サイトいじりといえば、レンタルサーバへの接続。

お使いのレンタルサーバに SSH の鍵認証で接続する設定を Ubuntu でしてみます。 おそらく SSH 接続許可のサーバであれば適応可能だと思います。 そしてこの後の GUI から接続でも使えますので是非設定しておきましょう。

鍵認証とは(たとえば) Ubuntu に秘密鍵を置き Web サーバに公開鍵を置いてペアの確認で接続するといった認証方式です。

ではまずは Ubuntu 側で鍵のペアを作成します。 ちなみにコマンド入力時、ssh-k くらいで TAB を押すとコマンドが補完されるのが分かります。

$ cd ~/.ssh
$ ssh-keygen -t dsa
Generating public/private dsa key pair.
Enter file in which to save the key (/home/hiromasa/.ssh/id_dsa): id_dsa.internet
Enter passphrase (empty for no passphrase): [エンター押下]
Enter same passphrase again: [エンター押下]
Your identification has been saved in id_dsa.internet.
Your public key has been saved in id_dsa.internet.pub.

鍵はホームディレクトリの .ssh に格納しておきます。

Ente file is which to save the key では好きなファイル名を設定してください。 パスフレーズの設定はここではなしにしています。(鍵自体に任意のパスワードを設定できます)

できたかどうか確認するため ls。 .pub となっているのが Web サーバに設定する公開鍵となります(ついてないのが秘密鍵、大事にしましょう)。 公開鍵の内容を cat で表示させてメモ(?)っておきましょう。

hiromasa@hiromasa-netbook:~/.ssh$ ls -laF
合計 20
drwx------  2 hiromasa hiromasa 4096 2010-10-30 14:03 ./
drwxr-xr-x 52 hiromasa hiromasa 4096 2010-10-30 14:00 ../
-rw-------  1 hiromasa hiromasa  668 2010-10-30 14:03 id_dsa.internet
-rw-r--r--  1 hiromasa hiromasa  615 2010-10-30 14:03 id_dsa.internet.pub
-rw-r--r--  1 hiromasa hiromasa  982 2010-10-30 14:00 known_hosts
hiromasa@hiromasa-netbook:~/.ssh$ cat id_dsa.internet.pub
ssh-dss AAAAB3NzaC1kc3MAAACBAKh7oNSM2..ww== hiromasa@hiromasa-netbook

次に SSH で接続時にこのファイルを検索してもらえるように、このディレクトリに config という名前のファイルを作成して以下の内容にします。 vi に慣れていない方は GUI のテキストエディタでつくるとよいです。

IdentityFile ~/.ssh/id_rsa.internet

いくつか鍵がある場合はこのファイルに同じように追加していけばOKです。

さて次は、レンタルサーバ側に公開鍵を登録します。 とりあえず、ssh のパスワード認証でログイン。

   1: $ ssh -l [レンタルサーバ・ユーザ名] [レンタルサーバ・ホスト名]
   2: Are you sure you want to continue connecting (yes/no)? yes

はじめてつなぐサーバの場合 yes/no を聞いてきますので、yes を選択しましょう。でもって、サーバに接続するいつものパスワードを入力します。 コアサバ/XREA などは SSH で接続する前に Web 管理画面からホストの登録が必要なのでそのように。

つながったらそこはレンタルサーバの UNIX の世界。

やりたいことは、.ssh/authorized_keys というファイルに公開鍵の内容を記入しレンタルサーバ側に配置することです。

$ cd ~/.ssh
$ vi authorized_keys

vi を起動して先ほどの .pub ファイル ssh-dss で始まる1行を全部コピペしてあげてください。 vi の使い方は気合いで。。(笑) 起動後 ESC 押して i おして、GUI から貼り付けて、ESC 押して :wq[エンター] とうてば良いかもしません。

コアサバとかの場合は nano も入っているみたいですのでそちらのエディタでもかまいません。 下に表示されているコマンドは CTRL を押しながらで発動します。

本当はリモートコピーとか簡単にやる方法があるのですが、練習ということで。 終わったら exit とうつとレンタルサーバから自分世界に戻ってこれます。 どーしてもできない! って場合はいつものやり方でファイルを転送してあげてください。 🙂

ほいでもって、

$ ssh -l [レンタルサーバ・ユーザ名] [レンタルサーバ・ホスト名]

とすると、鍵認証でログインできることが確認できます。

さてここからがお待ちかね(?)、GUI の世界です。 今の設定をつかって SSH 接続のファイル転送をしてみましょう。 FTP の転送は安定もしません(大量ファイル転送で FTP が止った経験はありませんでしょうか?)ので、SSH つかえるならこちらの方法がおすすめです。

GNOME 環境では Nautilus という Windows でいうところのファイルマネージャが利用できます。 こいつは SSH 接続も対応していますのでこちらから接続します。

ファイル –> サーバの接続。

ubuntu1010

こんな感じで設定して接続! するとさっきの SSH の設定をつかって鍵認証接続してくれます。

ubuntu1011

こんな感じ。 向こうもこっちも UNIX 系なので同じインターフェースで操作できます。 ファイルの属性変更もいつも通りです。

ファイル転送はやっぱり2ペインだよ~って方は、F9 押して F3 おしましょう。

ubuntu1012

エキストラペインを使えば2画面ファイラにもできます。 🙂

せっかくなので Nautilus  の TIPS をもう一つ。 Ubuntu で作業していると NAS など Windows 共有をみたくなることもあります。 そんなときは CTRL + L。

ubuntu1013

smb:// で相手先の IP アドレスをうてばさくっと表示できます。 ブックマークも可能ですのでよく見るところはしておくと早いでしょう。

…。

思いかけずいい加減長くなってきたので、ここからは

[tegaki]駆け足(笑)[/tegaki]

レンタルサーバにつながったので、ばりばりソースいじるぞって場合は Geany という GTK ベースのエディタがよいかもしれません。 オープンソースの Scintilla ベースのテキストコンポーネントを利用しており、内部リストの性能も悪くないようです。

Geany はプラグインアーキテクチャも持っていますので、とりあえずファイルブラウザを入れる。

ubuntu1020

しかるに左ペインでファイル一覧ができるようになりますので、WordPress いじるときは便利でしょう。

ubuntu1021

正規表現を伴う grep や矩形選択もできますのでいろいろ試してみてください。 よく使われる機能では、キーボードマクロ以外のことはできると思われます。

他にもソースいじる系では Eclipse や Aptana なんかも問題なく動作します。

さて、最後に Web 開発とはあんまり関係ありませんが GNOME Do を紹介です。 ぱかぱかコード書いているとあんまりマウスってさわりたくないものですが、そんなのを解消してくれるアプリです。

とりあえず、インストールして Super(Winキー) + スペースを押してみます。 でもって、fi くらいまでキーボードをうつ。

ubuntu1030

左に対象がでて、右に操作が出ます。 それらのフォーカスは TAB で動かせて選択がある場合はカーソルキーの上下で選べます。 この場合は Firefox の起動。

最近だと Windows 7 も Windows キーからそのまま fire とかうつと起動まではできるようになりましたが、GNOME Do はもーちょっとあります。

何かしら文字を選択した状態で、transl くらいまで入力。

ubuntu1032

選択されたテキストとすると、翻訳サイトにふっとばしてくれます。 とても便利あるね。 GNOME Do さんもいろいろプラグインがありますので試してみてください。 設定は GNOME Do 画面の右上の三角から表示できます。

ubuntu1031

Ubuntu 10.10 Netbook Remix を使っている方は、Unity に Super キーをとられてしまっているので動作しません。 Unity のショートカットはいまいち使えないので、ぼくは gconf-editor で Super のアサインを解除しています。 (apps の下です)

ubuntu1033

うっへ~、とりとめなく長っ、。

ここまで読んでくれた人に、読者サービス。

チラッ☆ (←不要です

Masayan 「…」

ぼのを「…」

続く。(のか?