先日からプログラミングスクールのTech::Camp（テック・キャンプ）でWebアプリケーション開発を学んでいます。
今回は、Webサービスを開発して公開するまでの手順や便利なツール、必要な知識について復習を兼ねて解説してみようと思います。
- 使用言語
- フレームワーク
- 開発環境
- ソース管理・バージョン管理
- デザイン
- Web API
- スクレイピング
- セキュリティ
- テスト
- データベース・SQL
- Webアプリケーションの公開
- 覚えることは多いけど
- まとめ
使用言語
Webアプリケーションを開発するための言語はいくつか選択肢がありますが、テックキャンプではRubyを使いました。
RubyにはRuby on Railsという便利なフレームワークがあり、多くの企業とりわけスタートアップやベンチャー企業で採用されています。Ruby on Railsについては後述します。
Webアプリケーションは、ブラウザで動くHTML・CSS、JavaScriptとサーバーサイドで動く言語（今回はRuby）によって作られています。
Ruby
Webアプリケーションのバックエンド（サーバーなどユーザーから見えない部分）で処理をするためにRubyを使います。
送信されたリクエストに応じて処理を行い、処理の結果を返します。
Rubyを使うのは初めてでしたが、まさにオブジェクト指向という感じの言語です。
HTML
Webサイトの文字や画像、入力欄や送信ボタンなどを配置するための言語です。
ページの骨組みをHTMLで組んでいきます。
Web系のプログラミングには必須の言語ですので、習得しておく必要があります。
CSS
HTMLで表示した要素を装飾するための言語です。
HTMLだけだと下方向に要素が積まれていくだけなので、CSSを使ってレイアウトをしていきます。
色を変えたり、アニメーションを加えたりなど様々なことがCSSで表現できます。
JavaScript
主にクライアントサイド（ブラウザ上）で動く言語で、CSSで表現できない複雑なアニメーションを加えたり、HTMLの要素を書き換えたりできます。
本当に色んなことができるので非常に奥が深い言語だと思います。
一人で開発を行う場合は、上記の言語を習得する必要がありますが、実際の開発現場ではRuby（バックエンド）とHTML・CSS、JavaScript（フロントエンド）は別のエンジニアが開発しています。
フレームワーク
開発に必要なコードを一から書いて実装するのは時間がかかりますし、高いプログラミングスキルが必要になります。
それを解決するのがフレームワークです。
フレームワークを使えば、効率的に、楽にアプリケーション開発ができます。
Ruby on Rails
Ruby on Rails（以下Rails）はWebアプリケーション開発を楽にするフレームワークです。
フレームワークの中でも特に人気があるので、ネット上や書籍など情報が豊富にあるので学習もしやすいです。
Railsで構築されているWebサービス一例
- クックパッド
- 食べログ
- Qiita
- Airbnb
- マネーフォワード
- freee
- クラウドワークス
このような有名Webサービスでも採用されています。
Railsの処理の流れ
実際にRailsでの開発を始める前に一連の処理の流れを知っておくと良いでしょう。
ルーティングには、送られてきたリクエストに対してどのコントローラのどのアクションを動かすのかを設定しておきます。
コントローラーはルーティングとビューをつなぐ役割をします。モデルにデータを取得させて、ビューに出力します。
ビューは見た目の部分を担当しています。ビューにはERBというテンプレートファイルを使います。ERBには、HTMLなどの文章の中にRubyスクリプトを埋め込むことができます。
モデルは、データベースのテーブルに対応するRubyのクラスです。クラスの概念は簡単に説明できないので、ここで省略します。
Bootstrap
BootstrapはTwitter社が開発したCSSのフレームワークです。
使用頻度の高いスタイルがあらかじめ定義されており、ルールに従ってHTMLを組めば良い感じのページを作成することができます。レスポンジブデザインにも対応しています。
デザインが苦手という人にはおすすめです。
開発環境
Webサービスを開発するには、Rubyをインストールして、IDE（統合開発環境）やローカルサーバー・データベースを用意しなくてはいけません。
試しに始めてみようと思っても、開発環境の構築で時間を取られてしまい諦める人も少なくないでしょう。
始めのうちはCloud9を使うのがおすすめです。テックキャンプでもCloud9を利用して学習を進めました。
Cloud9
Amazonが提供している、Web上で開発ができるクラウドベースのIDEで、無料で利用することができます。
環境構築は最低限で済むので、初心者におすすめです。
現在日本語には対応していませんが、直感的に操作できるので難しくありません。
ローカル環境での開発とは違い、どのPCからでも同じファイルにアクセスできるのも非常に便利です。
ソース管理・バージョン管理
Webアプリケーション開発は、Gitを使ってバージョン管理を行います。
Git
Gitは変更履歴を管理できるシステムです。
「コードを変更したけど、やっぱり変更前に戻したい」という時、Gitを使えば簡単に変更前に戻すことができます。
また、複数人が同じファイルを編集するという時もGitを使えば同時に編集をして統合することができます。
Gitは開発の現場では必須のシステムとなっています。
Github
GithubはGitをWeb上で管理できるサービスです。無料でも利用できます。
ただし、Githubはプライベートリポジトリ（非公開リポジトリ）を利用できるのは有料会員だけです。無料会員のコードは公開に設定されます。
もしプライベートリポジトリを無料で使いたいのであれば、BitbucketやGitlabというサービスもあります。
基本的な使い方はGithubと似ているので、Githubが使えれば問題なく使えるでしょう。
デザイン
ユーザーが迷うことなく使いやすいと感じるデザインにすることも、Webアプリケーション開発には大切です。
また、あまりにもデザインが雑だと、「このサイトは大丈夫なのかな？」「素人が作ったサイトなのかな？」などと思われる可能性もあります。
ユーザーが信頼して使えるように、個人開発でも最低限のデザインは施す必要があります。
Web API
Web APIというのは、 Webアプリケーションの一部の機能を外部の開発者が利用できる仕組みです。
欲しい情報をリクエストして、JSONなどの形式でデータを受け取ることができます。
例えば、TwitterのつぶやきをWebサイトに表示したり、Facebookのシェア数をカウントしたりするのもWeb APIを利用しています。
多くのWebアプリケーションで、Web APIが利用されています。
スクレイピング
スクレイピングというのは、あるサイトのHTMLを取得して、その中から欲しい情報を得るという手法です。
APIを公開していないようなサイトの情報も取得することができます。
ニュースサイトやキュレーションサイトを作るのに役立ちます。
ただし、著作権を侵害する恐れやスクレイピングを禁止しているサイトもあるので、著作権法に気をつけて慎重に利用しましょう。
RubyではMechanizeというgem（ライブラリ）を使うと比較的簡単にスクレイピングを行うことができます。
セキュリティ
Webアプリケーションの多くはメールアドレスやパスワードなどの個人情報を扱います。
個人情報を第三者に見られたり改ざんされたりするのを防ぐために、セキュリティを強固にしておく必要があります。
そのためには、Webサイトの攻撃方法を知っておく必要があります。
具体的には、XSS、SQLインジェクション、CSRF、セッションハイジャックなどの手法です。これらの仕組みを知り、対策しなくてはいけません。
テスト
Webアプリケーションはテストをしながら開発を進めます。
テストをしないと思わぬバグやエラーが発生し、アプリケーションの利用者に迷惑をかけてしまいます。
Ralisでの開発では、RSpecというテストに特化した言語を使うと効率的にテストが行えます。
テストコードを書く際は、スピードを求めない、DRYを意識し過ぎないようにしましょう。
DRYというのはDon't Repeat Yourselfの頭文字をとったもので、「同じような記述はなるべくまとめられないか考える」というプログラミングの原則です。
テストコードは分かりやすさを重視しなくてはいけないからです。
データベース・SQL
情報を保存しておく場所がデータベースです。
TwitterやFacebookのようなSNSであれば、アカウントの情報や投稿の内容などの情報をデータベースに保存しておきます。
Excelの表のような形式で保存されるデータベースをリレーショナル・データベース(RDBS)と言います。
SQLは、データベースからデータを取得したり保存したりための言語です。
テックキャンプではMySQLというリレーショナル・データベースを使用しますが、PostgreSQLやSQliteなどのデータベースでも、基本的な文法は変わりません。
Webアプリケーションの公開
Webアプリケーションの公開にはいくつかの方法があり、その一部を紹介します。
Heroku（ヘロク）
Webアプリケーションを公開するには、サーバーを用意したり、データベースの設定をしたり、ソフトウェアをインストールしたりとやること多く大変です。
Herokuを使えば、簡単に公開することができます。
HerokuはWebアプリケーションを実行するためのプラットフォームです。いわゆる「PaaS」と呼ばれるものです。
サーバー、データベース、プログラミング言語の実行環境が整っており、簡単にWebアプリケーションを公開することができます。
レンタルサーバーよりもWebアプリケーション向けなイメージですね。
VPS
VPSは共用サーバーに比べてスペックが高く、自由度と拡張性が高いという特徴があります。
また、他のユーザーの影響をほとんど受けないというメリットがあります。
機能面では専用サーバーに近く、より低コストで運用することができます。
ただし、上のHerokuのようなサービスに比べると専門的な知識が必要になります。
Amazon EC2
Amazon EC2というのはクラウド上で利用する仮想サーバーです。
アプリケーションの規模やアクセス状況に応じて柔軟に拡張・縮小できるのが特徴です。
急なアクセスにも自動で対応してくれるので、サーバーダウンの心配がありません。
また、セキュリティも強固なので安心して利用できます。
こちらもHerokuに比べると専門的な知識が必要になるので、導入のハードルは少し高くなります。
覚えることは多いけど
このように覚えることがたくさんあり、初心者の方は不安かと思います。
実際Webアプリケーションの開発はつまずくポイントも多く、独学だと難しいと感じました。
私の場合はテックキャンプを利用していたので、メンターに質問をしながら学習ができて安心でしたし、エラーやバグもスムーズに解決できました。
教室だけではなくチャットで質問ができるのも助かりますね。
まとめ
今回解説したことのほとんどはテックキャンプで学ぶことができます。
Webアプリケーションを開発するには覚えることが多いですが、機能を実装して実際に動いた時は感動すら覚えます。
Tech::CampのWebサービス開発コースを受講して、Webアプリケーション開発の一連の流れを学ぶことができました。今後Railsをもっと詳しく勉強していきたいと思いました。
今回の記事はざっとした説明ですので、興味のある人はTech::Campで詳しく学習してみて下さい。
他にもこんな記事があります。
プログラミングスクールTech::Camp（テックキャンプ）を受講してみた感想【カリキュラム・コースの内容・料金など】 - NO TITLE
プログラミングスクールTECH::CAMP（テックキャンプ）でWEBサービス開発を受講！！【Ruby on Rails】 - NO TITLE
--