開発環境を手軽に用意。ローカルサーバーの立ち上げと確認用サイトの公開を簡単に行うツール

Publish2016/01/06(水)

今日は技術系の記事を書きます。
サイトを作る時に、ローカル環境でサーバーを立てたり、作ったサイトのデータを誰かと共有するという工程があるかと思います。
僕の場合は、ローカルサーバーの立ち上げをほとんどせずに自分のテストサーバーやお客さんのサーバー上にテスト環境作って共有したりすることが多いんですが、稀に例外的な感じで動くこともあります。
その時に使っているものを紹介しようというのが今回の趣旨です。
今回はメインで使っている2つと、その2つが使えない時の代替候補のツール2つを紹介します。
なお、今回のコンセプトは「パッ」と作って、「サッ」と確認してもらうことが前提なので、その環境を中長期的に維持していく想定ではありません。
その点を踏まえて読んでいただければと思います。

ローカルサーバーの立ち上げにはSuperStatic

以前書いたAMPの時にもさらっと触れましたが、ローカルサーバーをサクッと立ち上げるのに一番手っ取り早いのは「SuperStatic」だと思っています。
XAMPPとかVagrantとかでもいいんですけど、初期に時間がかかるので早さ優先の場合ではちょっとどうかなという部分がありますし。
SuperStaticの場合は、nodeの入っている環境であれば、
npm install -g superstatic
ってターミナルで打ってインストールしたら、
cd 確認したいディレクトリ
で移動して
superstatic
ってターミナルで打てば「localhost:xxx」とかでローカルサーバーが立ち上がります。
実にスピーディーで簡単ですね。
この場合は自分の環境で動きさえすればいいので、簡単にサーバー上での動作確認したい場合とかはこれで十分な場合の方が多いかもしれません。
こういう方法もあるということを知った上で、TPOに合わせて自分がやりやすい形で作ればいいんじゃないでしょうか。
追記:以前のバージョンのSuperStaticでは「ss」ってコマンドで起動しましたが、現行の4.0.1のバージョン(2016/1/12現在)では「ss」では起動しなくなっています。
SuperStaticを開発したDivshotが、Google傘下のFirebaseに吸収されましたので、その影響ではないかと思います。

作ったものの確認環境にはsurge

作ったものをサクッと確認してもらう場合は、「surge」が便利です。
こちらもnodeが入っている環境であれば
npm install --global surge
ってターミナルで打ってインストールしたら、
cd 確認したいディレクトリ
で移動して
surge
ってターミナルで打てば、ディレクトリ下のデータがsugeのサーバーにアップロードされて「xxx.surge.sh」という形のサブドメインで確認できます。
こちらも非常に簡単です。
作ったデータがsurgeのサーバーに転送されるので、それが嫌な人や案件によっては使えませんが、こちらもこういう手段があるということを知っておくだけで選択肢が広がります。
なお、アップロードされたプロジェクトは
surge list
で確認できます。確認して不要なデータを削除する場合は
surge teardown ドメイン名
で削除することができます。
不要なデータは削除しておく方がエコですね。

その他のツール

今回紹介した2つ以外にも同様のサービスはたくさんあります。
ローカルサーバーで言えばアプリとかもありますので選択肢も多いと思いますので、surgeと同じような機能の2つを紹介します。
まず一つ目は「LocalTunnel
これもnode環境があればsurgeと同じような感じで使えます。
きちんと使ってないのですが、さくっと使った感じでは特に問題なく使えたので好みの問題で使い分けたらいいかなと思います。
もう一つは「ngrok」。
こちらはnode環境なくてもインストーラーも用意されているので、ターミナル苦手とかwinの人でも使えるかと思います(Winで試してませんがサイト上には使えると表記してあります)
これも使い方は簡単ですが、サイトの説明は英語なのでそれが苦手だと辛いかもしれません。

まとめ

この辺のツールは、今紹介してますが実際には結構前からあるものです。
Webの最新のツール類はすごく開発が早いので、今こうやって紹介してますが次の日にはもっといい上位互換のツールが出てくることもしばしばです。
なので、僕自身もずっとこれを使い続けるつもりも特にないですし、いいものがリリースされたらそっちを使うと思います。
ただ、このツールはこういうときに使えるものだということを知っておけば、いざという時に役に立つとは思うので覚えておいて損はないかと思います。

記事の著者:ふにすでぐち

ふにすでぐち

1978年生まれ。企業のWeb活用をテーマに、Webサイトの運用を中心とした戦略的な企画立案、サポートやWebサイトの構築などを行っています。
5年間のWeb制作会社勤務後、2年間のフリーランスで「フニス」として活動後に法人化し、2012年7月「ふにす株式会社」を設立。
Web活用の情報や考え方などを発信するブログ「ふにろぐ」を不定期で更新しています。
2015年11月より大阪府高槻市に「ふにすWeb相談所」を開設。
地域の方々に気軽にWebのことを相談できる場所として、より多くのWeb運用の問題解決をするために活動しています。
また、不定期で大阪を中心にWeb運用やブログなどをテーマにしたイベント「ふにセミWS」を開催しています。
サイトの運用や活用にお困りの方はお気軽にご相談ください。
お問い合わせはこちら

LINEでWebに関する質問にお答えしています。

ふにすでは、LINEでWebに関するご質問にお答えしています。Webに関するあんなことやこんなこと、今さら聞けない疑問などなんでもご相談ください。LINEアプリでQRコードを読み取ると友達登録のリンクが表示されますので、試しに登録してみてください。

ふにろぐとは?

でぐち

ふにろぐは「ふにす株式会社」の「でぐち」が書いているブログです。
このブログでは主にサイトの運営をしている企業のご担当者様向けに、「サイトの運営に役立つTips」や「今更人に聞けないような初歩的なこと」を中心に情報を配信しています。
その他には僕自身の考え方なども書いています。

このブログについて

ふにす株式会社

ふにす株式会社は大阪の高槻にある「Webを起点に会社の成長を応援するパートナー」をモットーに、Webにまつわるいろいろな問題を解決する、サポートをする会社です。
ホームページでお問い合わせを増やしたい、もっとたくさんの人に見てもらいたいなど、ホームページ/Webサイトを活用したい方向けの活動を行っています。
また、ホームページの作成や、外部パートナーとしての運用サポートなど、幅広くWebにまつわる諸々のことをおこなっております。

ブログ内検索

サービス

ふにすWeb相談所

ホームページの運用お得情報

ホームページ/Webサイトの運用に関する記事のまとめです。ツールや運用ノウハウなど、知っていると便利になる情報ですので、まずはこちらをご覧ください。

Webサイトの運用に関する情報

お問い合わせ

ホームページを成功させたいとお考えの方はお気軽にご相談ください。
ご相談は、下記の中からお好きなものを選んでいただければ大丈夫です。

  • メールで問い合わせる
  • チャットワークで問い合わせる
  • Facebookで問い合わせる
  • Twitterで問い合わせる

LINE@でも相談を受け付けています。
QRコードから友達登録を行って、メッセージを送ってください。

LINE@

最新記事

カテゴリ別記事一覧

月別記事一覧