昨年末のことだけど、Webサービスを作ってVPSで運営してみたよ
昨年12月に上記のサイト、ぷろすちま〜を公開しました。PCゲームを販売する海外サイト、Steamストアで扱われているゲームの価格をまとめたサイトです。先週ぐらいまで大型セールが開催されていたのでアクセス数も多かったのですが、今はようやく落ち着いたようです。
さて、最近やたらと「Webサービスを作ってみた」系のエントリが人気のようで*1,*2、自分のアイデアをサービスとして公開したいというプログラミング未経験者の方が多いみたいですね。そういうわけで、そうした方々の参考になればと思って、僕がぷろすちま〜を公開するまでに踏んだ手順なんかをご紹介します。
アイデアを具体化
まず頭の中にある「こんなのがあったら便利だなぁ」を、具体的な言葉や図にします。僕は忘れっぽいので思い浮かんだアイデアは片っ端からメモしておきます。
例えば、
- 白い下地のリスト形式を中央に寄せる、画面上部にメニューみたいなもの
と言った、サイトのレイアウトを自分なりにイメージできる絵を描いたり、言葉にしたり、
- セール品だけを表示するページの他に、全てのゲームを一覧できるページも作る
のように、ロジックに関わる点も箇条書きしていきます。
つまり設計に近いことを行うわけですがそんなに気張る必要はないと思います。ルールを作るというよりは、後で思い返すための備忘録を作っていると考えて下さい。せっかく思い浮かんだアイデアは全てWebサイトに取り入れたいですよね。
プログラミング言語の選択
「こんなものを作りたいんだけど、どのプログラミング言語を使えばいいのかわからない」とよく聞きますが、Webサービスを作りたいと言うなら選択肢はほぼ絞られます。そしてその中のどれを選んだとしても、実際に出来上がるものはほとんど変わりありません。せっかく言語を習得したのに無駄になっちゃった、ということはないので安心を。
まずHTMLは必須です。タグを全て覚える必要はありません。HTMLがどういった構造を持っているかを理解すれば、あとはリファレンス本があれば十分に書けます。余力があればCSSも簡単に学びたいところですね。
HTML/XHTML&スタイルシートレッスンブック―ステップバイステップ形式でマスターできる
- 作者: エビスコム
- 出版社/メーカー: ソシム
- 発売日: 2007/06/20
- メディア: 単行本
- 購入: 38人 クリック: 542回
- この商品を含むブログ (40件) を見る
そして言語の選択ですが、
の中から選んで下さい。ちなみにこれら4つは軽量プログラミング言語という名前で一括りにされるくらいですので、どれか1つをマスターすればその他の言語の習得も簡単です。この辺は完全にお好みで。
Perlははてなやmixiで使われています。PHPはレンタルWikiでよく見るPukiwikiや、個人で簡単にSNSを構築できるOpenPNEで使われています。Pythonは具体的なサービスが思い浮かびませんが、Googleや欧米で人気の愛され言語です。Rubyは日本人が開発した言語で、昔はTwitterで使われていました。
またこれらの軽量言語を大体理解した後で余力があれば、Javascript、というよりはjQueryを学ぶと簡単に素敵なサイトが作れちゃいます。
フレームワーク
個人でWebサイトを作るならフレームワークの利用が重要です。どの言語を選ぶかよりも、どのフレームワークを使うかによって開発にかかる時間・労力は大きく変わります。もちろん、自分で何から何まで作りたいという熱心な方はフレームワークを使わないのもありですが、そうでなければ車輪の再々発明をするのはやめましょう。
以下のエントリも参考にしました。なるほど、と思いました。
まず、高速開発を可能にする”最強最大の魔法“を考えましょう。
それはこれです。コーディングしない
1週間でトリビア共有サイト”trivist”を作ってみた
開発に時間がかかるとどうしてもモチベーションが下がってしまいがちです。僕はプログラミングを数年やっているのですが、途中までの作りかけがいくつもあります。それも自分の身となったわけですが、やはり実際にサービスインすることが重要だと思います。
話が逸れてしまいましたが、フレームワークを利用する利点はもう一つ。そのフレームワークの使い方に従うしかなくなるということです。これは一見デメリットのようにも感じますが違います。プログラミング初心者が自力で実装するとハマりやすい部分が、フレームワークでは隠蔽されています。要は、フレームワークを使えば余計な問題が出なくて済むのです。
PerlならCatalyst、PHPならCakePHP、PythonならDjango、RubyならRuby on Railsが有名ですね。
僕は元々Rubyが得意だったのもあり、上記のフレームワークに強い影響を与えたと言われているRuby on Railsを採用しました。
開発！開発！開発！
いよいよ開発していきます。言語の勉強をしながらサンプルや自分のサイトを作っていくか、それとも一通り勉強し終わってから作り始めるかは好みだと思います。僕の経験ですと、前者は学習スピード（飲み込み）は早いが全体の見通しが取れないまま進めることになるのでコーディングに時間がかかりやすく、後者は間違いの少ないコーディングができるが学習に実践が伴わないため時間が掛かる傾向があります。一番いいのはこれらの折衷案かもしれませんね。
開発はゴリゴリ書いていくだけなのですが、簡単なTipsを紹介します。
バージョン管理ソフトを使う
「自分一人で作っているものだし、わざわざそれを管理するソフトなんて入れるまでもない」そう思うかもしれませんが、ぜひ導入してみて下さい。管理ソフトの使い方も学ばなければいけませんが、一人で開発するならいくつかの機能だけを覚えればいいだけですし、何より開発のスピード・安定性が劇的に向上します。
例えば「今日は○○の機能までコーディングしたぞ」というとき、管理ソフトを使わないとすればどうするでしょう。面倒な人はバックアップも取らずに、明日も続けてコーディングするでしょう。しっかりした人であればソースファイルをzipなどに圧縮して、'20100110_01.zip'とでも名付けて保管しておくでしょう。しかしこの方法だと昨日との差分だけを見たり、今日書いたところだけ削除したりはできません。
そこでバージョン管理ソフトの出番です。ざっくり簡単に言うと、バックアップもでき、過去の部分的な内容を見たり、その部分だけを削除・元に戻すことができます。手動での管理が破綻する前にぜひ導入してみましょう。プログラミング初心者にバージョン管理まで覚えさせるなんて酷だと思うかもしれませんが、僕は初心者こそバージョン管理をしっかり行うべきだと思います。僕はGitというソフトを使って管理しています。
- 作者: 濱野純(Junio C Hamano)
- 出版社/メーカー: 秀和システム
- 発売日: 2009/09/24
- メディア: 単行本
- 購入: 31人 クリック: 736回
- この商品を含むブログ (155件) を見る
プラグインを使う
先のフレームワークの話題とも重複しますが、言語によっては様々なライブラリ・プラグインがあります。それらはぜひ使っていきましょう。
例えば、自分のサイトにメンバー登録・ログイン機能を付けたいというとき。よくある機能ですので、大抵の言語（もしくはフレームワーク）にはそれ専用のプラグインがあると思います。導入するだけで自分のサイトにログイン機能を追加できるはずです。しかし自力でこれらの機能を追加するとしたら、また色々とコーディングするハメになってしまいます。おまけにログイン機能ということで、セキュリティ面もしっかり考慮しなければならなく、ロジックに間違いがあってはなりません。またパスワードを保存するために暗号化技術の勉強も必要そうです。
そういうわけで面倒を省くならプラグインはとことん使って下さい。RubyならRuby Toolboxというサイトにて人気プラグインがわかりますし、ソースコードのホスティングサイトであるgithubでwatcherが多いプロジェクトを調べてみてください。
テストをする
開発はテストの繰り返しだと思います。世の中には開発手法について色々な議論がなされており、テストについてもテスト駆動開発（TDD）だとか振舞駆動開発（BDD）などもありますが、個人で開発するならそのようなものに捕らわれることなく自由にやっていいと思います。
僕が作ったものは小規模で、かつユーザからの入力もほとんどないシンプルなものなので、テストは手動で行っていました。僕の個人的な指標としては、ユーザからの入力が直接データを変更してしまうものについてはTDDを採用すると決めています。が、これは感覚的なものです。
テスト環境についてですが、僕はテストの粒度によってRubyに付属のWEBrickという簡易サーバと、VMwareを使った仮想サーバを使い分けました。理想的には本番環境に近いところでテストすべきですが、面倒なときは簡単なものを使うというスタンスです。
またWebサービスのテストには複数のブラウザが必要になります。IE、Firefox、Google Chrome、Safari、Operaをインストールしておきます。IEはバージョン差異によって大きく動作が異なるため、IE Testerというソフトを導入しておくと便利です。ちなみにぷろすちま〜はデザインは結構適当なので*3、ブラウザ毎の見た目の違いはそれほど気にしていません。Javascriptが必要なところはjQueryを使ってブラウザ間の違いを吸収しています。ブラウザ上でのデバッグにはFirebugがお勧めです。
サーバへデプロイ
開発も終了に近づいたなら本番環境も準備しましょう。大きく分けて3種類の方法があります。
レンタルサーバ
無料のものから有料のものまでたくさんあります。PHPやPerlのものなら全て無料で使えるところもあります。ただし無料だと使えるファイルサイズが少なかったりデータベースに制限があったりしますので、本格的なサービスを運用したいなら有料プランを選ばざるを得ないことが多いです。
自宅サーバ
自分でサーバを用意する最後の手段です。余ったPCがあれば簡単に公開することができますが、しっかりしたハードウェアを用意しなければなりません。Linuxの知識に加え、面倒なインストール作業も必要になります。
僕はVPSを選びました。国内でRuby on Railsを動かせるレンタルサーバがほとんどなく、また自由にサーバを弄りたかったためです。何か設定を間違えたときに、ボタン一つでOSを再インストールできるのも便利です。また最近は価格もかなりこなれてきました。候補としてはさくらのVPSとServersMan@VPSを考えたのですが、実際両方使ってみてさほど違いがなかったので、価格の安い後者を選びました。ちなみにServersManのVPSは毎月大きなアップデートがあったり、イベントでHDDやメモリ、CPU割当を増やしてくれたり、無料期間を付けてくれたりとサービスが盛りだくさんです。ただし昨年は大規模なシステムダウンがありその復旧がかなり遅れたこともあるので、良いところばかりではないってことも考慮して下さい。
VPSや自宅サーバを選んだなら環境構築をしていかなければなりません。この部分は相当面倒な作業になってくるのですが、幸い先人たちが素晴らしいエントリを書かれているので参考にさせていただきました。
さくらのVPS を使いはじめる | アカベコマイリ
さくらVPSを借りてから参考にしたサイト « tech*
ServersManでもさくらと同じCentOSを使っているので作業もほとんど同じでした。rubyやgitなどは最新版を使うためにソースファイルからインストールしなければなりませんが、パッケージのように管理したかったのでcheckinstallというソフトを使いました。
ドメインの取得
サーバ上で正常に動くことを確認したら、あとはドメイン取得です。無料のドメインでもいいのですが、やっぱり独自ドメインの方が格好良いですよね！ドメインは昔から利用しているVALUE DOMAINで取得しました。手続きが完了したらVALUE DOMAINのDNS設定にて、ドメインをServersManのIPに向けています。
まとめ
以上、僕が実際にWebサービスを作りVPSで運営するまでの手順でした。Webサービス系のエントリは多いのですけど、どういう風に開発したのかってことがあまり明らかにされていないんで、今回は隅々まで晒しちゃいました*4。エントリ中で紹介した言語やソフトはWikipediaへのリンクになっていることが多いですが、それは興味が沸いた方にはぜひググって自分で調べて公式サイト等へ辿り着いて欲しいからです。当記事がみなさんのプログラミングライフのきっかけになれば幸いです。
*2:自分でWEBサービスを作る人、ペパボ創業者・家入一真氏。｜ホットココア社長日記 @egachan
*3:本当にサービスを使ってもらいたいならデザインも重要です、すみません
*4:本当はもっと込み入ったことも書きたかったのですが、予想外に長くなってしまったためまた別の機会に…
