ローカル環境で Apache+Subversion(+Dreamwever)

作っていたデータをミスって上書きして消してしまったり、1 日分の作業とばして涙目になったりが度々あったので、ローカルに Subversion を入れて使うようになりました。この記事は以前書いておいた個人メモの内容なのですが、どうせなので公開。

ローカルで Subversion を使いたいだけなら、TortoiseSVN だけ入れれば大丈夫です。しかし Dreamweaver と連携させるには Apache と絡ませないと無理そうだったので、私はAphaceh + Subversion で使ってます。

コマンドでリポジトリを作って~という方法もありますが、私は TortoiseSVN でリポジトリ作成などはしてしまってます。

Subversion のインストール

  1. Subversion for Windows | Free software downloads at SourceForge.net からダウンロード。Dreamweaver CS5 と連携させるため、Subversion のバージョンは 1.6.6 を選択。
  2. インストール途中にある、”Install and configure Subversion modules”オプションをチェック。これで Apache の httpd.conf に必要なことが設定されることもある(なんだか完璧ではないような)

Apache の設定

Subversion インストール時に設定がされている場合もありますが、httpd.conf(大体 c:\program files\apache group\apache2\conf\httpd.conf にある)を確認。

LoadModule dav_module modules/mod_dav.so
LoadModule dav_fs_module modules/mod_dav_fs.so

上記内容の最初に「#」が付いている(=コメントアウトされている)場合、「#」を消しておく。
さらに以下の内容を追加。

LoadModule dav_svn_module mod_dav_svn.so
LoadModule authz_svn_module mod_authz_svn.so

この追加した Module が読み込めない場合、以下の様にフルパスで書けば OK(最初からフルパスで書いてもいいかも)。

LoadModule dav_svn_module "C:/Program Files/Subversion/bin/mod_dav_svn.so"
LoadModule authz_svn_module "C:/Program Files/Subversion/bin/mod_authz_svn.so"

ここで一度 Aphache を再起動。動くか確認。
動かない場合、C:\Program Files\Subversion\bin\libdb42.dll を、C:\Program Files\Apache Group\Apache2\bin にコピー。

httpd.conf の最後に以下のように書いておく。
※ここでは F:/work/svn_apache をリポジトリの場所としてます。

<Location /svn>
    DAV svn
    SVNParentPath "F:/work/svn_apache"
</Location>

ブラウザからは、http://localhost/svn/ でアクセスできます。
F:/work/svn_apache の中にhoge というリポジトリを作った場合には、http://localhost/svn/hoge で。

TortoiseSVN

  1. TortoiseSVN 本体、LanguagePack を落として、両方インストールした後 PC 再起動。
  2. デスクトップ等を右クリック、TortoiseSVN→Settings…→Languageを「日本語」に。

リポジトリ作成

  1. リポジトリを作りたい場所で右クリック→TortoiseSVN→ここにリポジトリを作成
  2. リポジトリに入れたいデータのあるフォルダ(ここでは hoge とする)を右クリック→TortoiseSVN→インポートを実行
  3. hoge フォルダを、念のためリネームしてバックアップ。hoge_bk などにしておく
  4. 新しく hoge フォルダを作成して右クリック→SVN チェックアウト。これで中に元々あったファイル等が戻る

Subversion で管理してるファイルを書き出す

Subversion で管理していると「.svn」というフォルダが出来てしまいます。
サーバにアップする時や、データを誰かに送る際には Subversion からエクスポートをします。

  1. エクスポート用のフォルダを作成して右クリック→TortoiseSVN→エクスポート

Dreamweaver から Subversion を使う時の注意

重要: Dreamweaver CS4 では、Subversion 1.4.5 クライアントライブラリを使用します。Subversion 1.4.5 より後のバージョンのクライアントライブラリは、下位互換性がありません。サードパーティのクライアントアプリケーション (TortoiseSVN など) を更新して Subversion 1.5 以降で使用する場合、更新された Subversion アプリケーションによってローカル Subversion のメタデータが更新され、Dreamweaver は Subversion と通信できなくなります。この問題には、Subversion サーバーの更新は影響しません。サーバーの更新は下位互換性があります。この問題の詳細については、www.adobe.com/go/dw_svn_jp を参照してください。

Adobe Dreamweaver CS4 * Subversion (SVN) によるファイルの取得とチェックアウトより引用』

CS4 で使おうとすると、Subversion 1.4.5 クライアントライブラリでないとエラーがでます。
SVN 接続時に「Subversion の統合を使用してファイルを更新できません」エラーが発生する(Dreamweaver CS4)に、Subversion 1.5 以降でも利用できるようにする Subversion 変換スクリプトが配布されていますが、私はこれが上手く動きませんでした。Subversion 変換スクリプトを動かす場合には、Python を入れる必要もあるようです。

CS5 は Subversion 1.6.6 クライアントライブラリを利用するということだったので、私は 1.6.6 を入れています。

重要: Dreamweaver CS5 では、Subversion 1.6.6 クライアントライブラリを使用します。Subversion 1.4.5 より後のバージョンのクライアントライブラリは、下位互換性がありません。サードパーティのクライアントアプリケーション(TortoiseSVN など)を更新して Subversion の以降のバージョンで使用する場合、更新された Subversion アプリケーションによってローカル Subversion のメタデータが更新され、Dreamweaver は Subversion と通信できなくなります。この問題には、Subversion サーバーの更新は影響しません。サーバーの更新は下位互換性があります。Subversion 1.7 以降で動作するサードパーティのクライアントアプリケーションにアップグレードする場合は、Dreamweaver で再び Subversion を使用するには、先にアドビ システムズ社で更新を確認する必要があります。この問題について詳しくは、www.adobe.com/go/dw_svn_jp を参照してください。

Adobe Dreamweaver CS5 * Subversion(SVN)によるファイルの取得とチェックアウトより引用』

ちなみに、普段は Dreamweaver からコミットなどを行っています。どうも Dreamweaver からのコミットと TortoiseSVN からのコミットなどを併用しようとするとエラーがでることが多いように感じているので、基本的にはリポジトリを作成するのとエクスポートするときだけ TortoiseSVN を利用し、それ以外は Dreamweaver としています。

Dreamweaver での設定

サイト設定→バージョンコントロール
・アクセス「localhost」
・プロトコル「HTTP」
・サーバーアドレス「localhost」
・リポジトリパス「/svn/hoge」

「ケータイサイト解体新書 デザインパターンから理解する実装テクニック」購入

ケータイサイト解体新書 デザインパターンから理解する実装テクニック
ケータイサイト解体新書 デザインパターンから理解する実装テクニック ホシナカズキ,榊原 美穂(サイト制作協力)

おすすめ平均5つ星のうち5.0
5つ星のうち5.0モバイル制作に関わるすべてのひとに
5つ星のうち5.0Webデザイナーがモバイルサイト案件があったときに読むと最適な1冊

Amazonで詳しく見る

評判が良かったので購入してみたんですが、分かりやすくまとまっていて良かったです。携帯サイトをコーディングする方にも当然おすすめですが、デザインする方も知っているとよさそうな事が色々書いてありました。

ネット上にも情報はありますが、モバイルに関しての情報は古いものが多かったり、なかなか現時点での「どうなの?」が分かりにくいので、これは楽に現状を知れて良いんじゃないかなと思います。

最近、携帯サイト制作をする機会が増えてきたんですが、一時期携帯サイト制作から遠のいていたのもあり「今どうなんだろ」と、制作するたびに色々調べる手間が大きかったんです。この本で結構すっきり分かったので、個人的にはとても満足です。もっと早く読んでいれば楽だった案件もあったなあ。

良い本だと思ったので、オススメしときます。 :)

iPhone 用 twitter アプリのアップロード機能を中心とした比較・設定メモ

主に、写真などをどこにアップできるか(TwitPic や yFrog 等)を比較したいがために作成。上から順に、使用頻度が高いアプリです。

対応している形式のまとめと、Photo アップロード先をまとめたのではっておきます。(シートが 2 つになってます)

上の表、埋め込みだと見にくいかもしれないので URL もはっておきます。よろしければどうぞ。比較データ一覧

Tweetings for Twitter

App Store Tweetings for Twitter – DW:design

高機能でかゆいところに手が届くかんじ。マルチアカウントの切り替えも楽。時々落ちたり不安定な面あり。Reply 時に、元のコメントが表示されてるのが好き。スケジュール投稿できるようですが未使用。

タイムラインのアイコンタップで、Reply、ReTweet、Quote Tweet、Favourite、Translate が出来るのは便利。

Setting > [Composing] Integrations > [Media] Photo Uploading
TwitPic / Twitgoo / MobyPicture / yFrog / Posterous
Setting > [Composing] Integrations > [Media] Video Uploading
TwitVid / MobyPicture / yFrog / Posterous
Setting > [Composing] Integrations > [Media] Audio Uploading
MobyPicture / Posterous
Setting > [Composing] Integrations > [Add tweet text to uploaded media] Send message
ON にすることで、メッセージを同時に投稿可能(ただし 2010/09/04 時点では、TwitPic+これを ON だとエラーになり投稿できない)。メッセージ同時投稿をしたい場合、Posterous なら可。
Setting > [Composing] Integrations > [Url Shortening] Provider
TinyURL / is.gd / bit.ly / tr.im / j.mp / twtn.gs / Custom
Custom Shortener、API User、API Key の設定も可能。
Setting > [Display] Advanced > [Timeline Behaviour] Read Later
アカウント設定と、Provider で Instapaper / Read It Later を選択可能(後で読むサービス)。

TweetList for iPhone

App Store TweetList for iPhone – Zooble, LLC

リストがとにかく見やすい。シンプルだけど最低限の機能はきちっとある。サクサク軽い。見ることに関しては凄く良いアプリだと思います。ただ、Reply や投稿などに関しては機能が弱い印象で、何かアクションを起こそうとした場合は少しやりにくいところも。

Reply 時に、元のコメントが表示されるのは便利。タイムラインから直接 URL を開ける。

Photo のみアップ可能で、アップ先に関する設定はない様子。TwiPic にコメント付きで投稿される。

TwitRocker

App Store TwitRocker – Toc

ちょっと前まで落ちて使えなかったけれどアップデートで復活。アカウントごとにタイムラインやリストなどが一覧で並んでいて、そこから進んで見る形式。系統は TwitBird と似てます。1 アカウントずつ、ガッチリ見る感じ。

時々落ちたりするけど、それをカバーできるくらいに良いとこもあるアプリ。高機能、分かりやすい、できることの幅が広い。リッチ系アプリなので重め。高機能でいうと Twittelator もですが、こちらのほうが操作性が良いです。

検索メモを残せて見れるので、特定のハッシュタグをよく見る場合にも便利。ツイート投稿画面から、アカウント切り替え可能。

右下の歯車アイコン > 下部メニューのツイート > 画像投稿先
yFrog / TwitPic / Posterous
右下の歯車アイコン > 下部メニューのツイート > URL 短縮ドメイン
j.mp / bit.ly
右下の歯車アイコン > 下部メニューのその他 > URL 短縮
ここで、bit.ly / j.mp のアカウント設定可能
右下の歯車アイコン > 下部メニューのその他 > あとで読む
Instapaper / Read It Later

Twitbit

App Store Twitbit – High Order Bit

Twitbit Lite
App Store Twitbit Lite – High Order Bit

無料版の Lite を使用中。シンプルでサクサク、必要な機能はちゃんとあってアカウント切り替えも楽。

Photo と Video のアップが可能。アップ先に関する設定はない(はず)。yFlog に Photo はコメント付きで、Video はコメントなしで投稿される。

HootSuite

App Store HootSuite for Twitter – Hootsuite Media Inc.

横にスライドさせてタイムラインや mention を切り替えるタイプ。横スライド式だと他には TweetDeck、TweetMe がありますが、HootSuite はオンライン版(ブラウザで見る)と同期するのが特徴。ちなみに、PC では HootSuite をブラウザで使うことが多いです。

横スライドで切り替えられる複数ページを任意で決められるうえ、それを何セットか作ることが出来ます。これはマルチアカウントの人には特に便利かと思います。通常は何個かのリストだけ見たいけど、場合によってこのアカウントの mention だけ見たい~等、がセットの切り替えで可能なので良い感じ。

統計とか、個人的にはちょっと要らない機能が下部メニューを陣取ってるのが惜しい。

Photo のみアップ可能で、アップ先に関する設定はない様子。ow.ly にコメントなしで投稿される。

Twitter

App Store Twitter – Twitter, Inc.

元 Tweetie、公式に買い取られ、公式アプリに。抜群の安定感です。API エラーが他アプリで出る場合にも、なぜかこれだと出なかったりとか。

分かりやすくシンプルに見えるけど機能もそこそこで、重くもなく、全てにおいてバランスが良い印象です。タイムラインで、横にスライドさせるとメニューが出るのが、使っていてなんとなく楽しい。

アカウント画面 > 設定 > 連携サービス > 画像サービス
yFrog / TwitPic / TweetPhoto / Mobypicture / Twitgoo / Posterous /img.ly / カスタム…
サービス側が対応していれば、ちゃんとコメント付きで投稿される(TwitPic、Posterous はコメント付き確認済み)。
アカウント画面 > 設定 > 連携サービス > 動画サービス
yFrog / TwitVid / Mobypicture / Posterous / Vodpod
アカウント画面 > 設定 > 連携サービス > URL 短縮サービス
j.mp (bit.ly) / TinyURL / is.gd / l.pr / u.nu / Linkyy / カスタム…
アカウント画面 > 設定 > 連携サービス > “後で読む”サービス
Instapaper / Read It Later
アカウント画面 > 設定 > 連携サービス > API キー
j.mp (bit.ly) の API ログイン、API キー、の設定

Twittelator Pro

App Store Twittelator Pro – Twitter Client – Big Stone Phone

リッチ系アプリ。かなり機能満載なので、結構レアな設定もあったりします。タイムラインでタッチする場所によって機能が違っていたり、使いこなせればかなり良いアプリだと思います。タイムライン内に画像を小さく表示してくれるのが素敵。

ですが、おそらく人によっては少し使いにくい。画面の触る場所によって機能が…というのがアダになり、意図せず返信画面になったりすることが多くありました。返信画面を都度とじるのにも、保存するか聞かれて面倒で。これがイヤになって現在あまり使っていません。

設定 > サービス > [メディアサービス] 写真サービスを選択
Moby / Pikchur / TwitPic / yFrog / TwitGoo / Posterous / TweetPhoto / WordPress / TwitLens
設定 > サービス > [メディアサービス] オーディオサービスを選択
Moby / Posterous
設定 > サービス > [メディアサービス] ビデオサービスを選択
yFrog / Moby / TwitVid / Posterous / Pikchur
設定 > サービス > [URL 短縮サービス] プロバイダー
bit.ly (j.mp) / piurl / href.in / is.gd / →.ws
設定 > サービス > [URL 短縮サービス] プロバイダー
j.mp (bit.ly) の API ログイン、API キー、の設定が可能。
設定 > サービス > [その他のサービス] YouTube
YouTube のアカウント情報設定。TwitVid ビデオも YouTube にアップロードする、という設定あり。
設定 > サービス > [その他のサービス] Posterous
Posterous のアカウント情報設定
設定 > サービス > [その他のサービス] WordPress 用 TweetPress
自分の WordPress サイトの情報設定。※TweetPress という WP プラグインが必要
設定 > サービス > [リンク保存サービス] プロバイダー
Instapaper / Read It Later / OmniFocus

Osfoora

App Store Osfoora, for Twitter – Said M. Marouf

ホームがちょっと変わってるかも。タイムラインに入ってしまえば、よくある感じです。Twitter と同じくらいかそれよりもっとシンプルかも。自由度、使い勝手共に中程度ですが軽いです。

Setting > [Service] Image Service
yFrog / TwitPic / Posterous / img.ly / TweetPhoto
Setting > [Service] Video Service
yFrog / Posterous / TwitVid
Setting > [Service] URL Shortener
bit.ly / TinyURL / Customize bit.ly account
※最後の Customize bit.ly account で、bit.ly のアカウント設定が可能
Setting > [Service] Read Later
Instapaper / Read It Later

TwitBird free

App Store TwitBird free for Twitter – NibiruTech LTD.

アカウントごとにタイムラインやリストなどが一覧で並んでいて、そこから進んで見る形式。TwitRocker と同系です。Reply した場合、元のコメントをタイムラインに一緒に表示してくれるのが分かりやすい。

個人的には、テーマにバルーン表示ではなくて、Dark ではない白っぽいものがあれば良いんだけどないんですよねー残念。

設定 > [Integration] ReadItLater
後で読むサービス Read It Later のアカウント設定
設定 > [Integration] Instapaper
後で読むサービス Instapaper のアカウント設定
設定 > [Integration] 写真を投稿
TwitPic / yFrog / MobyPicture / pic.im
設定 > [Integration] url 短縮
bit.ly / tr.im

Echofon

App Store Echofon for Twitter – naan studio, Inc.

定番なアプリ。サクサク動いて、機能もそこそこにあってバランスが良い。ただ、マルチアカウントの切り替えがどうにも面倒くさいです。アカウント選択後に、わざわざ「閉じる」を押さないとといけないのが手間です…。

タイムラインから URL を直接開くことができたり、Reply の応報も見やすいです。マルチアカウントでなければ、もっと使っていたかも。

Video は、決めうちで TwitVid に投稿されるようです。

メニュー > 設定 > [アカウントオプション] アカウントオプション > [サービス] bit.ly
j.mp (bit.ly) の API ログイン、API キー、の設定
メニュー > 設定 > [アカウントオプション] アカウントオプション > [サービス] 写真サービス
TweetPhoto / TwitPic / Flickr
メニュー > 設定 > [詳細設定] Read It Later / Instapaper
利用サービスの選択、それぞれのサービスのアカウント情報設定
メニュー > 設定 > [詳細設定] 写真の解像度
640*480 / 1024*768 / リサイズなし
リサイズ時のぼかし具合の設定(?)あり

TweetMe

App Store TweetMe – FLIGHT SYSTEM CONSULTING Inc.

横にスライドさせてタイムラインや mention を切り替えるタイプ。しゃべった内容をツイートできる、音声認識機能あり。インターフェースは独特かも。

横にスライドさせるのに、少し癖がある気がする。TweetDeck や HootSuite と違い、アカウントをこえた形ではなく、アカウントごとにスライドで表示させるページを設定できる。

アカウント選択画面の左上、歯車アイコン > [ツイート投稿] 投稿画像画質
低 / 中 / 高 / 投稿時に選択
アカウント選択画面の左上、歯車アイコン > [ツイート投稿] 写真投稿サービス
TwitPic / Twitgoo / yFrog
アカウント選択画面の左上、歯車アイコン > [リンク保存サービス] Instapaper
後で読むサービス Instapaper のアカウント設定
アカウント選択画面の左上、歯車アイコン > [リンク保存サービス] Read It Later
後で読むサービス Read It Later のアカウント設定

TweetDeck

App Store TweetDeck for iPhone – TweetDeck

横にスライドさせてタイムラインや mention を切り替えるタイプ。PC 版もあります。リストをメインで見る人には便利かも。

ただ、タイムラインも、mention も、DM も、あれもこれも見たい~というタイプの人は横にページが増えすぎて使い勝手が落ちます。そういう人には HootSuite のほうがオススメ。

Settings > [General] Settings > Picture Service
TwitPic / yFrog / TweetPhoto
Settings > [General] Connect to Bit.ly
j.mp (bit.ly) の API ログイン、API キー、の設定

Boxcar

twitter アプリではないけど、twitter の mention や DM を通知してくれるアプリ。プッシュ通知ありのアプリで…と探すより、これを使ってしまうほうが制約がなくて楽です。プッシュ通知も安定して早いしオススメ。

App Store Boxcar – appremix

アプリ内ではなく、iPhone の設定 > 通知 > Boxcar
アイコンにバッジが不要な場合は、ここでバッジをオフにしておく。

画像のアップにまつわる、雑感

画像をアップした先のサービスに「ツイートしたテキスト」も一緒に投稿したいと思うんですが、サービス側の対応と、アプリケーションごとの対応の両方が OK でないとできないんですよね。どこにアップするかは好き好きだと思うのですが、コメントも一緒にいけるサービスが私は好きです。

画像をタイムラインにインライン表示してくれるアプリ(iPhone、PC 版共に)で、対応されている率が高いのは TwitPic。画像もビデオもオーディオも全部一カ所にまとめたくて、コメントもちゃんと付けたいのなら、Posterous。という感じで最近 2 つにしぼりつつあります。

最近は、「写真アップするぞ!」「タイムラインみるぞ!」「ちょっと見たい検索ワード or ハッシュタグがあるぞ!」というそれぞれのケースで、起動するアプリがそれぞれ違ったりしているんですが、これだとアップしたい場所によってアプリ切り替えればいいので、ある意味楽なんですよね :)

今回書いたのは全部 iPhone に入ってます。結局 1 つにはしぼれないし、なんだか消せないのですよねーそれぞれ良いところもあるので…フォルダ機能さまさまです。

Dreamweaver CS5 に拡張機能を入れる際にエラーがでたら

DW CS5 に入れたい拡張が何個かあったのですが、先日入れようとしたら「メニューを更新できませんでした」とエラーが出てしまって入れられず。

調べたところ、ショートカットを設定したり変更していると出るようです。私は特にショートカットの設定を変えた記憶もなかったので不思議なのですが…。

あれこれ試しているうちに DW で一切ショートカットが効かなくなり、なんかもうどうしたらいいのやらという状態になったので一度アンインストールして、再度インストール。

懲りずに今日、また拡張機能を入れてみました。
前回同様「メニューを更新できませんでした」とエラーが出てしまって入れられなかったので、以下のように。

XP
C:\Documents and Settings\userName\Application Data\Adobe\Dreamweaver CS5\ja_JP\Configuration\Menus

Win7
C:\Users\userName\AppData\Roaming\Adobe\Dreamweaver CS5\ja_JP\Configuration\Menus

内にある、「Menus.xml」と「Menus.xbk」をバックアップを取って削除。
※変更したショートカットなどがある場合、消えるので再設定が必要なようです。
 ↓
拡張機能をインストール。

先日はあんなに上手くいかなかったのに、今回はあっさりと成功しました。前回はなんだったのか…DW が不安定になっている中で色々したのがダメだったのかもしれません。

とりあえず上手く入ったので良かったです。
入れた拡張機能は、以下の 3 つ。

Vim にも zen-coding を入れてたので、DW にも入れたかったんです。嬉しい。
ちなみに、DW に入れた zen-coding は 0.6 のものです。

C:\Documents and Settings\userName\Application Data\Adobe\Dreamweaver CS5\ja_JP\Configuration\Commands\ZenCoding
内にある「zen_settings.js」を開いて、最初にある lang 設定などを書き換えておくと良いです。

	'variables': {
		'lang': 'ja',
		'locale': 'ja-JP',
		'charset': 'UTF-8',
		'profile': 'xhtml',

本当は、DW のエディタ部分が Vim だったらいいんだけどな~…などと思いますが、ニッチすぎるかな。連番にしたいときなど、凄く Vim ならば…と思ったりしてしまいます。

最近 DW から Subversion を利用しているので、Vim より DW を使うことが増えました。ここに来て、DW に戻ってます。なんだかんだ、HTML 特化してるのは便利ですね。

表示確認用ローカルサーバの Virtual Hosts ( Apache ) 設定

ローカルサーバー構築 ( Apache, Perl, PHP, MySQL ) 」で、ローカルサーバをたてる方法を書きましたが、今回はその補足として。実際に使う場合に便利な Virtual Hosts の設定。色々試して、現在こんな形でやっています。

httpd.conf

C:\Program Files\Apache Software Foundation\Apache2.2\conf 内
httpd.conf

#Listen 12.34.56.78:80
Listen 80
Listen 8080
Listen 8000

8080 と 8000 も使えるように。

# Virtual hosts
Include conf/extra/httpd-vhosts.conf

Vitual hosts の設定ファイル httpd-vhosts.conf を読み込むように。

httpd-vhosts.conf

C:\Program Files\Apache Software Foundation\Apache2.2\conf\extra 内
httpd-vhosts.conf

#
# Use name-based virtual hosting.
#
NameVirtualHost *:8080
NameVirtualHost *:8000
<VirtualHost *:8080>
    ServerAdmin test@test.com
    DocumentRoot "C:\work\UserVirtual8080\htdocs"
    ServerName localhost:8080
    AddHandler cgi-script .cgi .pl

    <Directory "C:\work\UserVirtual8080\htdocs">
        Options Includes ExecCGI FollowSymLinks
        AllowOverride All
        Order allow,deny
        Allow from all
    </Directory>
    ErrorLog "logs/localhost-error.log"
    CustomLog "logs/localhost-access.log" common
</VirtualHost>

<VirtualHost *:8000>
    ServerAdmin test@test.com
    DocumentRoot "C:\work\UserVirtual8000"
    ServerName localhost:8000
    AddHandler cgi-script .cgi .pl

    <Directory "C:\work\UserVirtual8000">
        Options Includes ExecCGI FollowSymLinks
        AllowOverride All
        Order allow,deny
        Allow from all
    </Directory>
    ErrorLog "logs/localhost-error.log"
    CustomLog "logs/localhost-access.log" common
</VirtualHost>

UserVirtual8000 内の任意名のディレクトリ(例、hoge)が、http://localhost:8000/hoge/ でみれて、UserVirtual8080 内の htdocs が http://localhost:8080/ でみれるように。

本番環境にあわせ、普段は 8080 のほうを利用。
本番環境で http://xxx.com/hoge/ のような URL がトップの場合は、8000 のほうを利用。

8080 内の htdocs は、作るサイトが変わるたびにそこに html 等のコーディングデータを入れ替えておいてもいいですが、私の場合、プロジェクトごとにフォルダは掘っておきたいなという気持ちがあるので以下のようにしています。

「プロジェクト名ディレクトリ」の中に「htdocs」ディレクトリを作成(例:C:\work\プロジェクトA\htdocs)。その htdocs のジャンクションを、UserVirtual8000 内に作成。

ジャンクション作成には、以下のリンク作成シェル拡張を使ってます。楽です。

例でいうと、C:\work\プロジェクトA 内の htdocs を右クリックして C:\work\UserVirtual8000 内にドラッグアンドドロップすると、右クリックなのでメニューがでます。その中の、「ディレクトリジャンクションをここに作成」を選択。

これで、C:\work\プロジェクトA\htdocs と、C:\work\UserVirtual8000\htdocs が同じ内容になり、C:\work\プロジェクトA\htdocs 内を変更すれば C:\work\UserVirtual8000\htdocs 内も変更されます。ジャンクションについてはここでは説明しませんが、実体丸ごとのリンク、みたいなイメージです。

参考:WindowsXPにおけるジャンクション作成方法 – GeekなNooblog

こうすることで、プロジェクトを切り替えるたびにジャンクションを変えるだけで済みます。httpd-vhosts.conf を書き換えるより楽なのでこうしてます。

「もっとこうしたほうが良いよ!」とか「こういう設定オススメだよ!」とか「こういう方法もいいよ!」等あれば、是非教えてください :)