タイトルの通り、CSSやJSを含むHTMLを編集していたとします。開発中のローカルのPCでのブラウザを使った確認は、「file://」から始まるURIをアドレスとすればできますね。これは当然です。まどろっこしく例を挙げると、ターミナル上で編集中のHTMLを指定してopenコマンドを叩き、ブラウザを立ち上げると再現できます。
$ open index.html
ただ、スマホやタブレットを含んだマルチデバイスでの挙動を実機で確認したい時ってあります。すると「file://」から始まるURIによる参照は他の端末では出来ないので、サーバ上にファイルを置く等の施策が必要になります。それをいちいちFTPやSCPを使い、グローバルなサーバ上にアップロードしてWebサーバでサーブして... ってのはめんどくさ過ぎます。最近だとDropboxで共有かけちゃえ！ってのもやり方としてはアリですが、同期のタイムラグが若干気になったり。
ってことで僕はPerlを使うので、便利なモジュールを利用してコマンド一発でその辺り解決してます。
- 開発マシンでHTMLを閲覧出来るサーバを簡易的に立てる
- iPhone/iPad のブラウザにて、開発マシンのLAN内のIPアドレスを考慮したアドレスを入力
- 閲覧できる、ウマー
ここで追記！
@punytan の作ってるPADっていうモジュールを使えば3文字のコマンドでイケることが判明！さらにいろいろ便利な機能もある！
ドキュメント読めば分かるけど、インストール後、ディレクトリにいって
$ pad
ってすれば望む挙動をしてくれるし、オプションを選んだり、Markdownプレビュー向けのPluginがあったりする！ punytan++ すぎる！
追記ここまで。
で、肝心のサーバを立てるコマンドですが、予め
$ cpanm Plack L
とPlack、Lというライブラリをインストールしておき、HTMLファイルのあるディレクトリまで移って
$ plackup -ML -e 'Plack::App::File->new->to_app'
コマンドを実行。「http://localhost:5000/」または、「http://{LAN内のIPアドレス}:5000/」としてWebサーバが立ち上がります。もし開発中のマシンのLAN内のIPアドレスが「192.168.1.100」で「test.html」というファイルを、同じLAN内のその他デバイスで閲覧したければ
というアドレスでアクセス可能です！ちなみにお分かりの通り「Plack::App::File」というPlackのミドルウェアを超簡単に使ってるだけです。
たった一行のワンライナーコマンドを長ったらしく紹介しましたが、フロントエンドだけ開発中、製作中って時には重宝するのではないでしょうか。OSXの場合、デフォルトでApacheが入っていてそれを使えば可能なことですが、わざわざ使うまでも無いので、PlackのAppモジュールを使った例がベストかと思います。他の言語にも似たようなものがあるとは思うので、Perlerじゃない人は探してみるといいかも！？ Perl分からないけど、これは使ってみたいよー！という方は「cpanm」でググってモジュールをインストールする手はずが整えば、なんとかなると思います。
PS.
songmuさんのLモジュール 使ってみたかったけど、plackup にはもう既に「-L」パラメータがあるので今回は2回もモジュール名を打ち込んでいる... → 「-ML」指定でブッキングしないらしいのでLモジュール使える... っぽい！