ようこそ Coda デベロッパ ゾーンへ
panic.com/jp に戻る



動的にローカルの内容をプレビューする

最終更新日: 2007年12月7日 (Coda 1.1)

ローカルのファイルをプレビューする際、実際にインターネット上にアップロードせずとも、特に動的なページ(PHP や SSI など)をプレビューしたいと思うことがあります。

ここではその方法を順を追って解説します。

その前に: ここでの内容は Coda 1.1 以降で可能です。古いバージョンの Coda をお使いの場合は最新バージョンにアップデートしてお試しください。

シナリオ

まず作業をするサイトのコピーを2組用意します。ひとつは現在作業を行っているサーバ上にあるサイト(リモートコピー)、もうひとつはサーバ上の内容をローカルにコピーしたサイト(ローカルコピー)です。

既にこのような構成で作業を行っている場合、リモートプロダクションサーバと共に同じ構成のローカルにインストールされた、例えば PHP 5 モジュールがコンパイルされた Apache 2 サーバがあるかも知れません。

尚、今回の解説では Apache や PHP モジュールのコンパイルに関する部分は割愛しますので、あらかじめご了承ください。

Coda でサイト設定を構成する

作業を行っている Web ページのローカルとリモートパスおよび、ローカルとリモート(トップページ)のルート URL を正しく指定します。例えば以下のようになります:

site config

トップページ URL およびローカル URL フィールドの入力に注意してください。トップページ URL はサーバ上のサイトへの URL であり、ローカル URL はそのサイトのローカル上のコピーへの URL です。

リモートおよびローカルルートは同じパスです。今回は同じですが必ずしも常に同じとは限りません。

最後にサーバ情報を入力し、ここでは SFTP で接続します。

設定を保存し、次回からはこのサイト設定ファイルをダブルクリックするだけで作業を開始することができるようになります。

ワークフロー

それでは先ほど作成したサイト設定をダブルクリックし、ファイルブラウザではローカル、リモート共に設定されたディレクトリが開かれます。今、index.php というファイルをローカルおよびリモートに作成し、それぞれをエディタで開きます:

hello world

各タブをプレビューモードに切り替えると、それぞれが正しくプレビューされます。

hello parsed

それではローカルのファイルのみ変更を加えてみましょう。ローカルのみ "hello" を "goodbye" に変更し保存します:

goodbye world

プレビューすると、当然変更された内容でプレビューされます:

goodbye preview

Coda はローカルのファイルのみが変更されたのを検出し、いくつかのオプションを表示しました。ファイル名の右にある上矢印をクリックするとそのファイルのみがアップロードされます。また "すべてを公開" ボタンを押すとすべての変更されたファイルをアップロードします。ここではすべてを公開ボタンを押します。

そしてリモートファイルをプレビューしているタブを表示し、リロードボタンを押します。

goodbye remote

見事、ローカルの内容がサーバにも反映されました!