こんにちは。ブログビジネス部 石野です。
livedoor Blogやクリップ、Readerの担当ディレクターです。
今日は「CocProxy」というツールをご紹介します。
同僚のプログラマーに教わったのですが、便利です。
コーディングにも携わるディレクターにはぜひ知っておいてほしいツールです。
（一見取っつきにくそうですが）
デバッグ時にその環境を用意をするまでの手間をなくしてくれる、時間短縮してくれるツールです。
また、確認するために編集したファイルをサーバへアップロードして…といった手順をスルーできます。
amachangさんのこの記事を見て「名前は知っていたけど」という方も、この機会にぜひ試してみてください。
http://d.hatena.ne.jp/amachang/20081126/1227700830
▼準備
1. まずはRubyをダウンロード ＆ インストール
2. 「proxy.rb」をダウンロード
3. 好きな場所に『files』フォルダを作成、proxy.rbも同じ階層にコピー
▼実行
4. files内に置き換えたいファイルを置く
5. proxy.rb をダブルクリックして起動
6. ブラウザのプロキシを『localhost:5432』に設定
7. ブラウザで閲覧すると、そのページで使われている（リクエストされた）ファイルが『files』にあれば置き換えて表示してくれます。
（ちなみにfilesに置いたファイルが閲覧しているURLに存在しなくても、特に悪いことは起こりません。）
2. proxy.rbをダウンロード http://svn.coderepos.org/share/lang/ruby/cocproxy/proxy.rb
3. 好きな場所に『files』という名前のフォルダを作成
（デスクトップでもマイドキュメントでも、自分の使いやすい作業フォルダにどうぞ）
先ほどのproxy.rbも同じ階層にコピー
4. files内に置き換えたいファイルを置く
5. proxy.rb を起動
6. ブラウザのプロキシを『localhost:5432』に設定
※Firefoxアドオン「SwitchProxy Tool」や「FoxyProxy」を入れておくと より便利です。
7. ブラウザで閲覧
「Checking files/...」こういう黒い画面が動き出せば無事に動いています。
2) files内の template.css を編集して保存します。
3) プロキシを設定した状態で "http://blog.livedoor.jp/staff/" や "http://blog.livedoor.jp/ld_directors/" を閲覧（既に閲覧していた場合はリロード）すると、ローカルに保存した template.css が適用されます。
もちろんCSSファイル以外も、jsでも、jpgなど画像ファイルでも置換されます。
キャッシュのせいです。
このキャッシュをクリアしたければ、URLに『?clearcache=1』 をつけてアクセスし直してください。
CocProxyで快適なWeb制作を。おすすめです。
livedoor Blogやクリップ、Readerの担当ディレクターです。
今日は「CocProxy」というツールをご紹介します。
同僚のプログラマーに教わったのですが、便利です。
コーディングにも携わるディレクターにはぜひ知っておいてほしいツールです。
CocProxyとは
ブラウザからのリクエスト先をローカルファイルに置き換えてくれるプロキシです。（一見取っつきにくそうですが）
デバッグ時にその環境を用意をするまでの手間をなくしてくれる、時間短縮してくれるツールです。
メリット
Ajaxを使っているなど、デバッグ環境を用意するのが大変な場合もプロキシの切り替え1つで済みます。また、確認するために編集したファイルをサーバへアップロードして…といった手順をスルーできます。
amachangさんのこの記事を見て「名前は知っていたけど」という方も、この機会にぜひ試してみてください。
http://d.hatena.ne.jp/amachang/20081126/1227700830
設定方法
5分もあれば準備できます。Rubyが必要です。（Rubyの知識は不要です）▼準備
1. まずはRubyをダウンロード ＆ インストール
2. 「proxy.rb」をダウンロード
3. 好きな場所に『files』フォルダを作成、proxy.rbも同じ階層にコピー
▼実行
4. files内に置き換えたいファイルを置く
5. proxy.rb をダブルクリックして起動
6. ブラウザのプロキシを『localhost:5432』に設定
7. ブラウザで閲覧すると、そのページで使われている（リクエストされた）ファイルが『files』にあれば置き換えて表示してくれます。
（ちなみにfilesに置いたファイルが閲覧しているURLに存在しなくても、特に悪いことは起こりません。）
キャプチャ付きで手順を確認
1. Rubyをインストール http://arton.hp.infoseek.co.jp/ActiveRuby.msi
2. proxy.rbをダウンロード http://svn.coderepos.org/share/lang/ruby/cocproxy/proxy.rb
3. 好きな場所に『files』という名前のフォルダを作成
（デスクトップでもマイドキュメントでも、自分の使いやすい作業フォルダにどうぞ）
先ほどのproxy.rbも同じ階層にコピー
4. files内に置き換えたいファイルを置く
5. proxy.rb を起動
6. ブラウザのプロキシを『localhost:5432』に設定
※Firefoxアドオン「SwitchProxy Tool」や「FoxyProxy」を入れておくと より便利です。
7. ブラウザで閲覧
「Checking files/...」こういう黒い画面が動き出せば無事に動いています。
使用例「livedoor Blogの共通CSSを更新した後の表示を確認する」
1) 共通CSS "https://parts.blog.livedoor.jp/css/template.css" を『files』に保存します。2) files内の template.css を編集して保存します。
3) プロキシを設定した状態で "http://blog.livedoor.jp/staff/" や "http://blog.livedoor.jp/ld_directors/" を閲覧（既に閲覧していた場合はリロード）すると、ローカルに保存した template.css が適用されます。
もちろんCSSファイル以外も、jsでも、jpgなど画像ファイルでも置換されます。
よくあるトラップ
「リロードしてもローカルファイルをどうも読み込んでくれない」というときがあります。キャッシュのせいです。
このキャッシュをクリアしたければ、URLに『?clearcache=1』 をつけてアクセスし直してください。
http://blog.livedoor.jp/ld_directors/archives/51008735.html?clearcache=1
関連
http://coderepos.org/share/wiki/CocProxyCocProxyで快適なWeb制作を。おすすめです。
コメント