現代のWebサービス開発には「Webフレームワーク」が欠かせません。Webフレームワークとは、WebサイトやWebアプリケーション、Webサービスを効率良く開発するための土台・枠組みとなるソフトウェアのことです (Webアプリケーションフレームワーク – Wikipedia)。多くのWebフレームワークは、データベース操作やテンプレートエンジン、セッション管理などWeb開発で頻出する機能をあらかじめ提供し、コードの再利用を促進します。これにより開発者は共通処理を一から書く手間を減らし、アプリ固有の機能開発に専念できるのです。
では、なぜWebフレームワークがこれほど重要視されるのでしょうか?本記事では初心者向けに、Webフレームワークの基本概念や役割から歴史的な発展、主要なフレームワークの特徴比較、実際の活用例までを詳しく解説します。特にRubyやPython系のフレームワーク(Ruby on RailsやDjangoなど)に焦点を当て、最新のトレンドやマイクロサービスとの関係についても触れていきます。さらに、Ruby on Railsを使った簡単なWebアプリ(ユーザー登録機能)の作成手順をコード例とともに紹介し、MVC構造についても学びましょう。それでは、Webフレームワークの世界を基礎から探っていきます。



Webフレームワークとは?
フレームワークの基本概念と役割
「フレームワーク(framework)」とは日本語で「枠組み」を意味します。プログラミングにおけるフレームワークは、開発の土台となるひな型やライブラリの集合であり、決められた構造に沿ってコードを書くだけで基本的な部分が動作するように作られています。特にWebフレームワークは、Webアプリケーション開発に特化したフレームワークです (Webアプリケーションフレームワーク – Wikipedia)。例えば以下のような役割を果たします。
- リクエスト処理とルーティング: ブラウザからのHTTPリクエストを受け取り、どの処理(コントローラ)に渡すか振り分ける仕組みを提供します。開発者はURLパターンに対して関数やメソッドを対応付けるだけで、指定した処理を実行できます。
- データベース操作の簡略化: 多くのフレームワークはORM(Object-Relational Mapping)と呼ばれる仕組みを持ち、データベースのテーブル操作をオブジェクト指向的に扱えます。SQLを直接書かずとも、モデルを通じてデータの保存や検索が可能です。
- テンプレートエンジン: HTMLのテンプレートに動的データを埋め込んでページを生成する仕組みを備えています。これによりビュー(見た目の部分)の開発が効率化され、一貫したデザインで複数ページを作成できます。
- セッション・認証管理: ユーザーログイン状態を保持するセッション管理や、認証・認可の仕組みを提供するフレームワークも多数あります。セキュアな認証機能を自前で実装するのは難しいですが、フレームワークが用意する仕組みを使えば安全かつ簡単です。
- 開発を助けるツール類: 開発用の簡易サーバー、デバッグツール、フォームバリデーション(入力検証)機能、キャッシュ機構など、Web開発を取り巻く様々な便利機能がパッケージされています。
要するに、WebフレームワークはWebアプリに共通する面倒な部分を肩代わりしてくれる頼もしい土台です。これを使うことで、開発者はゼロからコードを書く労力を減らし、「ユーザー登録」や「記事投稿」といった自分のサービス固有の機能開発に集中できます。
なぜフレームワークを使うのか?
フレームワークを使う主なメリットは、開発効率とコードの品質向上です。
- 開発効率の向上: 前述の通り、フレームワークには共通機能が組み込まれているため、車輪の再発明をせずに済みます。例えばフォームの入力チェックやページネーション(ページ送り)などもライブラリが用意されていれば、自分で実装するより圧倒的に早く、ミスも減ります。ある調査では、Ruby on Railsを利用することで従来より30〜40%開発が高速化できたという報告もあります (2000年以降20年間のプログラミング技術の歴史を振り返って、得た知見を書いてみる #SoftwareDesign – Qiita) (Ruby on Railsの項で詳述)。
- 規約による品質維持: 多くのフレームワークは「規約に従うだけで動く」よう設計されています。例えばRailsでは「設定より規約(Convention over Configuration)」という思想が貫かれており、決められた命名規則やディレクトリ構成に沿えば余計な設定ファイルを書かなくても動作します (RubyとRuby on Railsの違い|Kinsta®)。これにより、プロジェクトに参加した他の開発者も構造を理解しやすく、コードの可読性・保守性が向上します。
- セキュリティ向上: フレームワークは一般的なセキュリティ脅威(SQLインジェクションやXSSなど)に対する対策も組み込んでいます。例えばDjango(Pythonのフレームワーク)は初期設定でCSRF対策やSQLインジェクション防止策が有効になっており、開発者が意識せずとも一定の安全性が担保されます。フレームワークを使うことでセキュリティ上の落とし穴を避けやすくなるのも利点です。
- コミュニティと豊富な資料: 人気のあるフレームワークには世界中に大きなコミュニティが存在し、ドキュメントやチュートリアル、Q&A情報が豊富です。初心者でも学習コストを抑えやすく、困ったとき検索すれば同じ課題に直面した人の情報が見つかることが多いでしょう。例えばReactやRailsは日本語の解説記事や入門書も数多く出版されています。
- プラグイン/ライブラリの拡張性: フレームワーク自体が提供する機能に加え、コミュニティ製のプラグインや拡張ライブラリも利用できます。必要に応じてそれらを組み込めば、さらに開発が加速します。たとえばRuby on RailsにはDeviseという認証機能ライブラリ、Djangoには各種サードパーティ製プラグインが存在し、導入するだけで高度な機能を実装できます。
以上のように、Webフレームワークを使うことは**「速く正確にWebサービスを作る」**ための近道といえます。逆にフレームワークを使わず一から全て実装するのは大変非効率で、現代のWeb開発現場ではほぼ行われません。初心者の方も、まずは代表的なフレームワークを一つ習得してみると良いでしょう。それが今後の開発スキル向上に大いに役立つはずです。
Webフレームワークの歴史と発展
Webフレームワークは最初から存在したわけではありません。1990年代から現在に至るまで、Web技術の進化とともに徐々にフレームワークが発展・普及してきた歴史があります。この章では、その歴史的背景を追いながらRubyやPython系フレームワークの進化に注目します。
初期のWeb開発とフレームワークの誕生
初期のWebサイトは単純な静的HTMLページで構成されていました (Webアプリケーションフレームワーク – Wikipedia)。ユーザーからの入力に応じてページ内容を変えるような「動的」な仕組みはなく、サイトの更新はページの作者がHTMLファイルを書き換える必要があったのです。
しかし次第に、「ユーザーのリクエストに応じて動的にページを生成したい」というニーズが高まります。その解決策として登場したのが CGI(Common Gateway Interface) と呼ばれる仕組みでした。CGIはWebサーバが外部プログラムを実行して、その出力をHTMLとして返すというインターフェースです。例えば、PerlやC言語で書かれたスクリプトをCGIとして動かし、フォームから送信されたデータに基づいてページを生成するといったことが可能になりました。これによりウェブは動的コンテンツ時代へ踏み出します。
しかしCGIには欠点もありました。リクエストごとに別プロセスを起動するためオーバーヘッドが大きいことです。アクセスが増えるとサーバに大きな負荷がかかり、パフォーマンス面で非効率でした。そこで登場したのが、Webサーバとアプリケーションをより密接に結合するアプローチです。
代表的な例が、Webサーバ自体にプログラム実行環境を組み込むAPI統合です。Apacheサーバ向けにはmod_perl
やmod_python
、mod_php
等のモジュールが開発され、これを使うと外部CGIではなくWebサーバ内で直接スクリプトを実行できました (Webアプリケーションフレームワーク – Wikipedia)。またSunのJava言語ではServlet技術が登場し、Apache Tomcatのようなサーブレットコンテナ上でJavaプログラムが動的ページを生成するモデルが確立しました。これらにより、CGIより高速にWebリクエストを捌けるようになりました。
同じ頃、よりWeb開発に適した高水準のスクリプト言語も生まれます。代表がPHPや**ASP(Active Server Pages)**です。PHPはHTMLの中に直接埋め込む形で書けるサーバサイドスクリプト言語で、扱いやすさから爆発的に普及しました(現在でもPHPはWordPressなど多くのWebシステムで使われています)。MicrosoftのASPも同様に、VBScriptなどでサーバサイド処理を書ける仕組みとしてWindowsサーバ上で広まりました。
こうした言語やサーバ統合環境により、1990年代後半には動的Webサイトが一般化していきます。ただし、まだこの時点では現在のような「統合的なWebフレームワーク」という概念は明確ではありませんでした。各言語ごとに便利なライブラリは存在したものの、開発者はそれらを取捨選択しながら自前でアプリケーション構造を組み立てていたのです。
転機となったのは2000年代に入ってからです。Javaの世界では企業向けの大規模システム開発ニーズから「フルスタックフレームワーク」が登場します。例えばJava EE(旧J2EE)やStrutsなどは、プレゼンテーション層からデータベース層まで一通りカバーするコンポーネントや設計指針(MVCモデルなど)を提供しました。またオープンソースコミュニティでも、PerlのCatalyst、PHPのCakePHPなど、各言語向けにWebアプリ開発を楽にするフレームワークが次々と生み出されていきます。
RubyとPython系のフレームワークの進化
スクリプト言語の中でもRubyとPythonは2000年代に入り注目を集めます。これら動的言語のエコシステムでも、画期的なWebフレームワークが誕生しました。その代表格がRuby on RailsとDjangoです。
Ruby on Rails(通称Rails)は、デンマーク人プログラマのデビッド・ヘイネマイヤー・ハンソン(DHH)氏によって開発され、2004年にオープンソースとして公開されました (RubyとRuby on Railsの違い|Kinsta®)。RailsはRubyで記述されたフルスタックWebフレームワークで、「設定より規約(Convention over Configuration)」や「DRY(Don’t Repeat Yourself)」といった原則を強く打ち出した革新的なものでした。例えば、クラス名とテーブル名を特定の規則に従わせればORMの設定を書かずに済む、コードを1度書けば繰り返さないよう自動生成機能を活用するといった具合に、徹底的な自動化と省力化が図られていました。この斬新さから2005年前後にRailsは世界的に大きな注目を集め、「15分でブログを作るデモ」や「Javaの10倍の生産性」といったキャッチフレーズが当時話題になったほどです (2000年以降20年間のプログラミング技術の歴史を振り返って、得た知見を書いてみる #SoftwareDesign – Qiita)。Railsの登場は、「Webフレームワーク=生産性向上」というイメージを広く植え付け、Ruby言語自体の人気も飛躍的に高めました。
一方Python言語でも、ほぼ同時期の2005年にDjango(ジャンゴ)というフレームワークが公開されています。Djangoは米国の地方新聞社のWeb開発チームによって生み出されたもので、「締切に追われる完璧主義者のためのフレームワーク」を謳い文句に掲げています。名前の由来は有名なジャズギタリストのジャンゴ・ラインハルトから来ており、軽快さと芸術性を意識しているようです。DjangoもRails同様にオープンソースで無料のソフトウェアで、2005年に最初の公開版がリリースされました (What Is Django? | IBM)。Djangoはモデル・テンプレート・ビュー(MTV)というアーキテクチャに基づき、管理画面や認証機能など**「バッテリー同梱」**の機能豊富なフレームワークとして知られます。InstagramやPinterestなど後述する有名サービスでも使われ、その堅実さと生産性から「PythonでWeb開発するならまずDjango」と言われる存在になっています。
Ruby on RailsとDjangoはいずれもMVC(厳密にはDjangoはMTV)アーキテクチャを採用し、URLルーティングやORM、テンプレート、セキュリティ機構まで包括したフルスタックフレームワークです。両者の哲学には若干の違いもあります。Railsは「魔法のような自動処理」(メタプログラミング)で開発者の手間を省くことに長け、Djangoは「Explicit is better than Implicit(暗示より明示)」というPythonの流儀もあってか設定やコードが比較的明示的です。しかし共通するのは、「フレームワークが用意するガイドラインに従えば、初心者でも高度なWebアプリを比較的容易に構築できるようになる」という点でしょう。これらが登場した2005年前後以降、各種スクリプト言語コミュニティでフレームワーク開発が加速します。PythonではDjangoの他にも軽量な**Flask(2010年頃登場)**やPyramid、Web2pyなどが生まれ、RubyでもSinatra(小規模向けのシンプルなフレームワーク)などが登場しました。
総じて2000年代後半には、Webフレームワークが一気に普及したと言えます。動的言語の利点である開発スピードを最大化しつつ、従来Java等のエンタープライズ分野で培われたMVCアーキテクチャや設計パターンを取り入れ、大小様々なプロジェクトでフレームワークが使われるようになりました。この流れは現在まで続いており、言語の選択肢こそ増えたものの「Web開発=何らかのフレームワーク利用が当たり前」という図式が定着しました。
近年のWebフレームワークの進化とトレンド
2010年代に入ると、Webフレームワークの世界にも新たなトレンドが次々と生まれました。主なキーワードとして**「フロントエンドの台頭」と「JavaScriptの躍進」、そして「マイクロサービス」**が挙げられます。
まず、それまでサーバサイド中心だったWeb開発において、フロントエンド(ブラウザ側)の重要性が飛躍的に増しました。Ajax技術の普及によりページ全体ではなく一部だけ動的に更新する手法が一般化し、ユーザビリティ向上のためにクライアント側でリッチな動作をするシングルページアプリケーション(SPA)が増えていきます。この流れで登場したのがReactやAngular、Vue.jsといったフロントエンドフレームワーク/ライブラリです。特にFacebook社が2013年に公開したReactは、UIをコンポーネント単位で構築する画期的なモデルと仮想DOMによる高速レンダリングで瞬く間に人気を博しました。GoogleのAngular(2010年頃登場)や、独立開発者エヴァン・ユー氏によるVue.js(2014年公開)は、いずれもブラウザ上で動くアプリケーションを効率よく構築するためのフレームワークです。これらの台頭により、Web開発は「フロントエンド(UI)」「バックエンド(サーバ)」の役割分担がより明確になり、それぞれに特化したフレームワークを組み合わせて使うアーキテクチャが主流となりました。
次に、JavaScript言語の躍進も見逃せません。かつてブラウザ上でしか動かなかったJavaScriptが、2009年に登場したNode.jsによってサーバサイドでも動くようになりました。Node.jsは非同期I/Oによる高いパフォーマンスを特徴とし、リアルタイムWeb(チャットやストリーミング)に強みを発揮します。そしてNode.js用の定番フレームワークがExpress.jsです。Expressは2010年頃に公開された軽量なWebフレームワークで、シンプルながら柔軟性が高く、Node.jsでWeb APIやWebアプリを作る際のデファクトスタンダードとなりました。現在では**世界で最も利用されているWebフレームワークがNode.js(とExpress.js)であるとの調査結果もあります (Stack Overflowが世界6万人以上のITエンジニアにアンケート。最も使われている言語はJavaScript、データベースはPostgreSQLが1位に定着。Stack Overflow 2024 Developer Survey - Publickey)。例えば2024年のStack Overflow開発者調査では、最も使用されているWebフレームワークとしてNode.js(Express含む)が1位、次いでReactが2位という順位でした。JavaScriptはフロントとバックの両方で使える唯一の言語であり、近年は「フロントはReact、バックエンドはNode/ExpressでAPI構築」**という全てJavaScriptで完結するスタックも人気です。
さらにマイクロサービスアーキテクチャの普及もフレームワークの進化に影響を与えました(マイクロサービスの詳細は後述)。巨大なモノリシックアプリケーションを複数のサービスに分割する考え方が広まるにつれ、小さなサービスを素早く作るための軽量フレームワークやクラウド対応が求められるようになりました。例えばPythonでは高速なAPIサーバ構築向けにFastAPI(2018年頃登場)が人気となり、Javaでも従来の重厚なSpring Frameworkから起動の速いSpring Bootへの移行が進みました。JavaScript界隈ではNext.jsやNuxt.jsといったサーバサイドレンダリング対応フレームワークが現れ、ReactやVueと組み合わせてより効率的にウェブアプリを構築できるようになっています。また、クラウド上で関数単位のデプロイを行うサーバレスの概念も登場し、フレームワークもこれに対応する形で進化を遂げています。
まとめると、Webフレームワークはこの十数年で多様化しました。フロントエンド・バックエンド各層に専業フレームワークが登場し、用途やスケールに応じて使い分ける時代です。しかし根底にある目的は一貫しています。それは「開発を迅速かつ安全に行うことを支援する」ことです。最新のトレンドを追いながらも、初心者の方はまず基本的なフレームワークの概念や使い方を押さえることが大切でしょう。それができれば、新しいフレームワークに触れても共通点が見いだせ、スムーズにキャッチアップできるはずです。
人気のWebフレームワーク比較
現在、世の中には数え切れないほど多くのWebフレームワークが存在します。それぞれ得意分野や特徴が異なるため、一概に「これが最高」と決めることはできません。ここでは代表的なフロントエンド&バックエンドのフレームワークとして、「React」「Vue.js」「Django」「Express.js」を取り上げ、初心者向けにその特徴を比較してみましょう。どれも業界で広く使われている人気フレームワークです。
React、Vue、Django、Express などの特徴比較
フロントエンド系フレームワーク(React / Vue.js)
- React(リアクト) – JavaScript製のフロントエンドライブラリ。もともとFacebook社が自社サービスのために開発し、2013年にオープンソース化しました。Reactの特徴はコンポーネント志向と仮想DOMです。画面の部品を再利用可能なコンポーネントとして定義し、それらを組み合わせてUIを構築します。また仮想DOMにより効率的に画面の差分だけを書き換えるため、高いパフォーマンスを発揮します。React自体はビュー層に専念したライブラリですが、エコシステムが非常に充実しており、React Router(ルーティング)やRedux/Zustand(状態管理)などと組み合わせて単ページアプリケーションを構築するのが一般的です。メリット: 圧倒的な利用者数と情報量、コンポーネントの再利用性による開発効率。デメリット: 学習コストはやや高め(JSXという独自記法への慣れや、周辺ツールの理解が必要)。
- Vue.js(ヴュー) – JavaScript製のフロントエンドフレームワーク。Reactと並んで人気があるフロントエンド技術です。2014年に公開され、エヴァン・ユー氏が個人で開発したことでも知られます。Vueの理念は「漸進的なフレームワーク」で、既存のプロジェクトに徐々に導入できる柔軟さが強みです。小さく始めて必要に応じて機能を追加できるため、シンプルなテンプレートエンジンとして使うことも、本格的なSPAを構築することも可能です。Vueは直感的なテンプレート記法(HTMLベース)と双方向データバインディングを備え、初心者にも理解しやすい設計になっています。メリット: 習得のしやすさ、ドキュメントの丁寧さ、軽量で高速。デメリット: 超大規模な実績はReact/Angularに比べ少なめですが、近年はAlibabaやNetflixなどでも採用例があり信頼性は高まっています。
(※補足: フロントエンド系では他にもAngularという大規模向けフレームワークも有名です。Googleが開発し、TypeScriptを用いる本格派ですが、初心者には少し難しいためここでは詳細割愛します。)
バックエンド系フレームワーク(Django / Express.js)
- Django(ジャンゴ) – Python製のサーバーサイドフルスタックフレームワーク。先述の通り2005年に公開され、「締切に追われる完璧主義者のためのフレームワーク」と称されます。Djangoの大きな特徴は、管理サイトや認証機構などが最初から内蔵されている点です。例えばモデルを定義すると自動で管理画面(Adminサイト)が生成され、ブラウザからデータを閲覧・編集できるようになります。これにより開発初期段階から基本的な管理UIが使えるため、素早くアプリの形を作ることができます。またセキュリティにも配慮が行き届いており、XSSやCSRF対策がデフォルトで有効、パスワードのハッシュ化保存など安全な実装が標準になります。アーキテクチャはMTV(Model-Template-View)と呼ばれますが、本質的にはMVCと類似しており、モデル(Model)、テンプレート(Viewに相当)、ビュー(Controllerに相当)の3要素に分かれます。メリット: 大規模開発にも耐えうるスケーラビリティと信頼性、豊富な公式ドキュメント。InstagramやSpotifyなど有名サービスでの採用実績も多数あります。デメリット: フルスタックゆえに重量級で、小規模・高速志向の用途にはオーバースペックになる場合があります(その場合は軽量なFlaskやFastAPIが選ばれます)。また学習曲線も多少急で、Python初心者には設定項目の多さに戸惑うかもしれません。
- Express.js(エクスプレス) – Node.js(JavaScript)製のサーバーサイドフレームワーク。2010年にTJ Holowaychuk氏らによって作られ、シンプルさと柔軟さで人気を博しました。Expressは極めて軽量で、基本的にはルーティングとミドルウェア(各種処理の前後に挟み込む処理)の仕組みを提供するだけです。そのため自由度が高く、必要な機能は追加のライブラリを組み合わせて構築します。例えばテンプレートエンジンやセッション管理も、自分で好きなものを導入して使います。このミニマルな設計により、プロジェクトの規模や目的に応じて無駄のない構成を取れるのが魅力です。メリット: フットプリントが小さく高速、JavaScriptなのでフロントとの統一も可能、学習コストも低め(JavaScriptが分かれば理解しやすい)。デメリット: 自由な反面、アプリの構成は開発者に委ねられる部分が多く、大規模になると構造が乱雑になりがちです。その際はNestJSのようなExpressを内包した上位フレームワークを使うケースもあります。Expressは現在でもWeb API開発の定番であり、PayPalやUberなど多くの企業が採用しています (Express.js – Wikipedia)。
(※補足: バックエンド系では他にRuby on Rails(Ruby)やLaravel(PHP)、**Spring Boot(Java)**など多数存在します。Railsについては次章で詳しく扱うためここでは割愛します。)
以上がReact, Vue, Django, Expressの概要比較です。フロントエンドとバックエンドで役割が異なるため一概に優劣はつけられませんが、それぞれ現在主流となっている技術であり、用途に応じて使い分けられています。
どどのフレームワークを選ぶべきか?
「結局どのフレームワークを使えばいいの?」と初心者の方は迷うかもしれません。これに正解はありませんが、プロジェクトの要件や自身・チームのスキルセットに応じて選定することが重要です。いくつか指針を挙げてみます。
- フロントエンド重視のWebサービス: ユーザーと対話するUI部分が非常にリッチで動的な場合、ReactやVue.jsなどのフロントエンドフレームワークはほぼ必須です。例えばシングルページアプリケーション(SPA)を作るならReact/Vueを導入し、バックエンドはそれらにデータを供給するAPIを構築する形になります。逆に、静的な内容が中心でユーザー入力も少ないサイトなら無理にReact等を使わず、サーバサイドレンダリングだけでも十分な場合があります。
- 言語の習熟度・好み: もしあなたやチームが特定の言語に慣れているなら、その言語で使える主要フレームワークを選ぶのが近道です。Pythonが得意ならDjangoやFlask、Rubyが書けるならRuby on Rails、JavaScriptが得意ならNode.js(Express)といった具合です。フレームワークは言語と切り離せないので、まずは「この言語で書きたい」という軸で選ぶのも自然な流れです。
- 開発スピード重視か制御重視か: 開発をとにかく素早く進めたいなら、RailsやDjangoのようなフルスタック型が向いています。多くの機能が自動生成・内蔵されているため、プロトタイプを短期間で形にできます。一方で、細かな挙動まで自分で制御したい・軽量に作りたいという場合はExpressやFlask、Laravelなど必要最小限から構築するタイプが良いでしょう。チームが小さく自由に設計できるなら後者、大規模開発で共通ルールが欲しいなら前者、といった視点でも選べます。
- コミュニティと将来性: フレームワーク選定では、その技術が十分に成熟しているか、メンテナンスが継続されているかも重要です。一般に有名フレームワークはコミュニティも大きくバグ修正やアップデートが活発です(ReactやRailsは毎年のように新バージョンがリリースされています)。逆にニッチすぎるものや更新が止まっているものは、学習コストに見合わない可能性があります。初心者はまず実績があり情報も多いメジャーなフレームワークから入るのが安全策です。
最後に、迷ったら実際に触ってみるのが一番です。簡単なTodoアプリでも構いません。ReactでHello Worldを表示してみる、Railsでscaffoldを使ってCRUD画面を作ってみる、といった小さな体験を積むと各フレームワークの感触がつかめます。その上で「これなら使えそうだ」と思えるものを本命プロジェクトに採用すると良いでしょう。フレームワーク選びも経験のうちです。最初から完璧を求めず、トライアンドエラーで知見を貯めていきましょう。
有名Webサービスの採用フレームワーク
実際の有名Webサービスがどのフレームワークを使って構築されているかを知ると、技術選定の参考になります。以下に一例として、世界的に知られるサービスと採用フレームワークの組み合わせを表にまとめます。
Webサービス名 | 採用している主なフレームワーク |
---|---|
Twitter (初期) | Ruby on Rails ([Top Impressive Ruby on Rails Website Examples](https://www.developers.dev/tech-talk/top-15-website-examples-built-with-ruby-on-rails-in-2022.html#:~:text=Twitter)) (後にScalaに移行) |
GitHub | Ruby on Rails ([Top Impressive Ruby on Rails Website Examples](https://www.developers.dev/tech-talk/top-15-website-examples-built-with-ruby-on-rails-in-2022.html#:~:text=GitLabs%20cofounder%20chose%20Ruby%20on,the%20first%20developed%20using%20Rails)) |
Django (Python) (The 10 Most Popular Websites Using Django) | |
Django (Python) (The 10 Most Popular Websites Using Django) | |
Uber | Express (Node.js) (Express.js – Wikipedia) |
Netflix | Node.js + Express (多数のマイクロサービス) |
食べログ (日本のグルメサイト) | Ruby on Rails (2024年注目のWebアプリ開発フレームワーク5選について解説) |
Facebook (フロントエンド) | React (2024年注目のWebアプリ開発フレームワーク5選について解説) (UIライブラリとして採用) |
※上記は公開情報や技術ブログ等から明らかになっている例です。複数のフレームワークを併用している場合や、途中で技術スタックを変更している場合もあります。また、サービスの特定部分(フロントエンドのみ・バックエンドのみ)で採用しているケースも含まれます。
いくつか補足しますと、Twitterは創業当初Railsで開発され急成長しました ( Top Impressive Ruby on Rails Website Examples )。のちにスケーラビリティの問題からバックエンドの主要部分をScalaなどにリプレースしましたが、それでも現在も一部でRailsが使われ続けています。GitHubはRails製アプリの成功例として有名で、GitLab(競合のリポジトリサービス)の創業者が「GitHubがRailsで作られていたから自分もRailsを選んだ」と語った逸話もあります。InstagramやPinterestはDjangoの代表的な事例で、巨大なユーザーベースに対応するためDjangoのスケーラビリティが活かされています (The 10 Most Popular Websites Using Django) 。NetflixやUber、PayPalといった企業はNode.jsを積極活用しており、特にExpress.jsはUberやPayPalでも使われている実績があります (Express.js – Wikipedia)。日本では食べログやクックパッドといったWebサービスがRailsで構築されてきました (2024年注目のWebアプリ開発フレームワーク5選について解説)。フロントエンドでは、FacebookやInstagram(いずれもMeta社)でReactが使われているのはもちろん、最近ではPayPalもReact導入で開発効率が大幅に上がったと報じられています (2024年注目のWebアプリ開発フレームワーク5選について解説)。
このように、一線級のサービスでもWebフレームワークが活用されています。大規模サービスになると自社開発の独自フレームワークに移行するケースもありますが、多くのサービスはまず一般的なフレームワークで出発し、その恩恵を受けながら成長しています。ぜひ皆さんも有名サービスの技術事例を調べてみてください。フレームワーク選定のヒントが得られるでしょう。
Ruby on Railsを使ったWebアプリ作成
ではここからは実践編です。数あるフレームワークの中でも、初心者に比較的親しみやすく学習コストに見合う成果が得られるものとしてRuby on Railsがあります。Railsは先述したように生産性の高さで有名で、日本語の情報も豊富です。この章ではRuby on Railsを使って簡単なWebアプリ(ユーザー登録機能付き)を作成する手順を紹介しながら、フレームワークが具体的に何をしてくれるのか体験してみましょう。
MVC構造とは?
Railsの具体的な手順に入る前に、フレームワークの基本アーキテクチャであるMVC構造について押さえておきます。MVCとはModel(モデル)・View(ビュー)・**Controller(コントローラ)**の頭文字を取った言葉で、ソフトウェアを3つの関心事に分離する設計パターンです (Model View Controller – Wikipedia)。多くのWebフレームワーク(RailsやDjango、Laravel、Express系など)はこのMVCもしくは類似の構造に従っています。
- Model(モデル): アプリケーションが扱うデータとビジネスロジックを担う部分です。データベースとのやり取り(CRUD処理)や、業務上の計算・ルール検証などを実装します。Railsではモデルはクラスとして定義され、Active RecordというORMを通じてDBのテーブルと対応付けられます。
- View(ビュー): ユーザーに見せる画面(UI)を生成する部分です。HTMLテンプレートにモデルから取得したデータを埋め込んで出力したり、フォームを表示したりします。RailsではERBやHamlといったテンプレートエンジンを用いてビューを記述します。
- Controller(コントローラ): ユーザーからの入力(リクエスト)を受け取り、適切な処理(アクション)に振り分ける司令塔です。モデルを呼び出して必要なデータを取得・更新し、その結果をビューに渡してレスポンスを生成します。Railsではコントローラはクラス内に複数のアクション(メソッド)を定義して使います。
MVCの相関関係をまとめると、「ユーザーのリクエスト → コントローラが受け取り処理 → 必要に応じモデルに問い合わせ → 結果をビューに渡す → ビューがHTMLを生成しレスポンス」という流れになります。この分業により、例えば「画面の見た目を変更したい場合はビューのコードだけ修正すればよい」「ビジネスロジックを変更したい場合はモデルだけ直せばよい」といった具合に、コードの責務が明確になります。その結果、保守性・拡張性が向上し開発生産性も高まるという利点があります。
Ruby on RailsはMVCを全面的に採用しており、プロジェクト作成時にapp/models
、app/views
、app/controllers
というディレクトリが自動で用意されます。それぞれに対応するファイルを置くことで、Railsがよしなに関連付けてくれます。たとえばUser
モデル(user.rb
)とユーザー用コントローラ(users_controller.rb
)、そして対応するビュー(views/users/
以下のテンプレート)を作れば、あとはRailsがMVCの流れをつないでくれます。では実際に簡単なアプリを通して、このMVCの流れを体験してみましょう。
RailsでHello Worldを作る
まずはRailsで「Hello World」を表示する超シンプルなアプリを作ってみます。以下の手順を自分のPCで実行してみてください(RubyとRailsの環境が必要です。Railsインストール済み前提)。
- Railsアプリケーションの作成: ターミナルで任意の作業フォルダに移動し、次のコマンドを実行します。
$ rails new hello_app $ cd hello_app
これでhello_app
というRailsプロジェクトが作成されました。ディレクトリ構成を見ると、先述のapp/
配下にmodels
やviews
、controllers
が生成されています。 - ルーティングとコントローラの設定: ブラウザに「Hello, World!」と表示させるため、まずルーティングを設定しましょう。
config/routes.rb
ファイルを開き、以下の1行を追加します(コメント行の下あたりに追記)。# config/routes.rb Rails.application.routes.draw do get '/hello', to: 'application#hello' end
これは「/hello
というURLにアクセスがあったら、application
コントローラのhello
アクションを実行せよ」というルーティング定義です。 - コントローラにアクションを定義: 次に、
ApplicationController
にhello
アクションを追加します。app/controllers/application_controller.rb
を開き、クラス定義内に以下のメソッドを追記します。# app/controllers/application_controller.rb class ApplicationController < ActionController::Base def hello render plain: "こんにちは、世界!" end end
こうすることで、/hello
にリクエストが来たとき、このhello
メソッドが呼ばれ、"こんにちは、世界!"
というプレーンテキストを返すようになります。ここではビュー(template)を経由せず、render plain:
で直接テキストを返していますが、簡易な用途ではこのようにビューを省略することもできます。 - サーバの起動と動作確認: 準備は整いました。ではRailsサーバを起動してみましょう。
$ rails server
デフォルトではポート3000番でサーバが立ち上がります。ブラウザでhttp://localhost:3000/hello
にアクセスしてください。先ほどコントローラで指定したとおり「こんにちは、世界!」と画面に表示されたでしょうか? 表示されたなら大成功です。これがRailsにおける超基本的なリクエスト処理の流れになります。リクエスト/hello
に対し、ルーティングでApplicationController#helloに振り分け、コントローラがテキストを返してブラウザに表示されました。わずか数行のコードでここまでできてしまうのがフレームワークの威力です。 補足:上記のhello
アクションではrender plain:
を使いましたが、通常はコントローラで何も描画指定をしない場合、自動で同名のビューが探されます。例えばhello
アクション用にapp/views/application/hello.html.erb
というテンプレートファイルを置けば、そこに書いたHTMLがレンダリングされます。このように「コントローラ名/アクション名.html.erb」のビューを用意すればrender
の記述なしで対応するビューを表示するのがRailsの規約です。
Railsによる簡単な「Hello World」を体験していただきました。次はもう一歩進めて、ユーザーの登録機能を持つ簡易アプリを作成し、Railsの生産性の高さを感じてみましょう。
簡単なWebアプリを作成する(ユーザー登録機能など)
Railsには強力なコード自動生成機能(ジェネレータ)が備わっており、モデルやコントローラ、ビューのひな型をまとめて作成できます。その代表例がscaffold(スキャフォールド)
です。scaffoldはデータのCRUDに必要な一式を自動生成する仕組みで、これを使えば驚くほどあっさり基本的なWebアプリが完成します。ここでは「ユーザーの名前とメールアドレスを登録できるアプリ」をscaffoldで作ってみます。
- Railsアプリケーションの用意: 先ほどと同様に新規Railsアプリを作成します(既に
hello_app
がある場合はそのディレクトリの外で別名で作成してください)。$ rails new users_app $ cd users_app
- スキャフォールドの実行: 次のコマンドを実行して、Userモデルのscaffoldを生成します。
$ rails generate scaffold User name:string email:string
これにより、User
というモデルと対応するコントローラ・ビュー・マイグレーションが自動生成されました。生成されたファイル一覧がターミナルに表示されたはずです。主なものを挙げると:app/models/user.rb
– Userモデル(名前とメール属性を持つActiveRecordモデル)db/migrate/XXXXXXXX_create_users.rb
– usersテーブルを作成するデータベースマイグレーションapp/controllers/users_controller.rb
– Usersコントローラ(index, show, new, create, edit, update, destroyアクションが定義済み)app/views/users/*.html.erb
– 各アクションに対応するビュー(一覧、詳細、フォームなど)config/routes.rb
–resources :users
が追記され、UserのCRUD用ルートが自動設定
- データベースのセットアップ: マイグレーションファイルに基づいてデータベースにテーブルを作成しましょう。
$ rails db:migrate
これでSQLite3(RailsデフォルトのDB)にusers
テーブルが作成され、カラムとしてname
(文字列)とemail
(文字列)、自動生成のid
やcreated_at
等が定義されました。 - サーバ起動と動作確認: ではサーバを起動します。
$ rails server
ブラウザでhttp://localhost:3000/users
にアクセスしてみてください。scaffoldにより用意されたユーザー一覧ページが表示されるはずです。まだデータがないので空っぽですが、「New User」というリンクがあるのでクリックしてみましょう。ユーザー登録用のフォームページが表示されます。ここに適当な名前とメールを入力し「Create User」を押すと、送信先が/users
(POST)となり、UsersControllerのcreate
アクションが実行されます。内部では自動生成されたコードがパラメータを受け取りUserレコードを作成し、保存に成功すればshow
ページ(詳細ページ)にリダイレクトするようになっています。実際、送信後には登録したユーザーの詳細画面が表示されたはずです。戻って一覧ページを見ると、新しいユーザーが追加されているでしょう。 これら一連の機能は一度のscaffoldコマンドですべて生成されました。コードを開いてみると、例えばUsersControllerには以下のようなコードが含まれています。# app/controllers/users_controller.rb(抜粋) def create @user = User.new(user_params) if @user.save redirect_to @user, notice: 'User was successfully created.' else render :new, status: :unprocessable_entity end end private def user_params params.require(:user).permit(:name, :email) end
といった具合に、フォームから受け取ったパラメータをStrong Parametersでフィルタリングし、Userモデルに渡して保存、成功時は詳細ページへリダイレクト・・・という基本ロジックが既に書かれています。ビューも自動生成されたものですが、シンプルながら動くものが出来上がっていました。**「ユーザー情報を登録し一覧・編集できる」というWebアプリの基本部分が数秒で完成した」**といっても過言ではありません。
Railsのscaffold機能は学習用途やプロトタイピングに非常に便利です。もちろん実際の開発では自動生成コードをそのまま使うだけでなく、細部のカスタマイズや機能追加を行っていく必要があります。しかし、最初から最後まで自分で全部書くのと比べれば圧倒的なスピードで土台を作れることがお分かりいただけたと思います。
このようにRuby on RailsはMVCアーキテクチャのもと、豊富な自動生成・支援機能によって初心者にも優しい開発体験を提供してくれます。「とりあえず動くもの」を早期に作ってみて、あとから理解を深めながら手を加えていく、といった使い方ができるのもRailsの良いところです。ぜひ興味のある方はRailsチュートリアルなどを参考に、ブログアプリやSNS風アプリの作成にチャレンジしてみてください。フレームワークを使う楽しさと、生産性の高さを実感できるはずです。
Webフレームワークとマイクロサービス
近年のシステム構築ではマイクロサービスアーキテクチャというキーワードもよく耳にします。これはWebフレームワークとも深い関わりがあります。最後に、マイクロサービスとは何か、そしてWebフレームワークとどのように関係するのかについて簡単に整理します。
マイクロサービスアーキテクチャとは?
マイクロサービスアーキテクチャとは、ひとつの巨大なアプリケーションを細かな独立したサービス(マイクロサービス)の集合体として構築するアプローチです (〖完全版〗マイクロサービス (microservices) とは?モノリシック アーキテクチャとの比較・実際のマイクロサービスの使用例 | 株式会社レリパ)。従来型の単一システム(モノリシックアーキテクチャ)では、すべての機能が一つのコードベース・一つのデプロイ単位に収められていました。それに対しマイクロサービスでは、機能ごとにサービスを分割し、それぞれが別個にデプロイ可能でゆるく連携します。
マイクロサービスの特徴をまとめると以下の通りです。
- 各サービスはそれぞれ独立したプロセスとして動作し、自身のデータストレージ(データベース)や技術スタックを持ちます。
- サービス間は**軽量な通信(通常はHTTPベースのAPIやメッセージング)**でやりとりを行います。あるサービスの出力を他のサービスの入力とし、全体としてひとつのシステムを形成します。
- サービスごとにスケーリング(リソース増強や複製)を行えるため、負荷が高い部分だけ個別に拡張できます。モノリスだとシステム全体をスケールさせる必要があり無駄が多いですが、マイクロサービスなら必要なところにだけサーバーを増やせます。
- デプロイや開発をサービス単位で独立して行えるため、小規模なチームがそれぞれのサービスをアジャイルに開発・デプロイできます。あるサービスを変更しても他に大きな影響を与えにくく、新機能リリースやバグ修正を継続的に行いやすくなります。
マイクロサービスアーキテクチャはNetflixやAmazon、Twitter、PayPalなど大規模Webサービスで採用例が多く、一時期から現在にかけて大きな流行となりました。例えばNetflixは2010年代初頭に従来のモノリシック構造から数百ものマイクロサービスに移行し、開発スピードと信頼性を向上させたことで有名です ( Microservices vs. monolithic architecture | Atlassian )。もっとも、マイクロサービスはメリットばかりではなくシステム全体の複雑性が増すというデメリットもあります。サービスが増えすぎると管理が煩雑になり、サービス間の通信やデータ整合性の確保など新たな課題も出てきます。そのため「闇雲にマイクロサービス化すれば良い」というものではなく、適切な設計・運用体制が必要です。
フレームワークとの関連性
では、マイクロサービス時代におけるWebフレームワークの役割はどう変わるのでしょうか。結論から言えば、フレームワークはマイクロサービスでも重要なツールであり続けます。
マイクロサービスではアプリケーションが複数のサービスに分割されますが、その一つ一つは結局のところ小さなWebアプリケーションやWeb APIです。例えば「ユーザー認証サービス」「商品カタログサービス」「決済サービス」など、それぞれが独立したWebサービスとして振る舞います。したがって各マイクロサービスの開発にも、従来同様フレームワークを使うのが一般的です。むしろ、サービス数が増える分だけフレームワークによる効率化効果が大きくなるとも言えます。小規模なマイクロサービスであっても、一からHTTP処理やデータベース接続を書いていては非効率なので、やはり適切なフレームワークを適用して素早く構築するのです。
マイクロサービスでよく使われるフレームワークにはどんなものがあるでしょうか。基本的には従来からある軽量〜中量のWebフレームワークがそのまま使われるケースが多いです。例えば、
- JavaならSpring Boot:設定より規約を重視したSpringのサブセットで、起動が速くマイクロサービス向き。NetflixやUberなどでも活用。
- JavaScript(Node.js)ならExpressやその発展形のNestJS:シンプルで高速、サービスをAPIとして構築するのに最適 (Express.js – Wikipedia)。
- PythonならFlaskやFastAPI:Djangoより軽量でシンプルなマイクロフレームワーク。高トラフィックなAPIもFastAPI(非同期IO対応)ならこなせる。
- Go言語ならGinなど:Goはシンプルさと高速性からマイクロサービス実装で人気。GinはGoの代表的なWebフレームワーク。
などが挙げられます。要するに、マイクロサービスだから特殊なフレームワークを使うというより、各言語で信頼できる従来型フレームワークをサービスごとに採用する形です。各サービスが独立しているため、サービスAはRailsで作り、サービスBはGoで作る、といった異なる技術スタック併用も可能です(現に大企業ではチームごとに好きな言語・フレームワークでサービスを実装している例もあります)。
フレームワーク開発側もマイクロサービス潮流を受けて改良が加えられています。たとえばSpring BootはDockerやKubernetesとの親和性を高めクラウドデプロイしやすくなっていますし、RailsもAPIモード(ビュー無しのAPI専用サーバ構築)を提供して他のフロントエンドとの組み合わせを意識するようになりました。要は、フレームワークはマイクロサービスを実現するための部品として進化を続けているのです。
マイクロサービスとフレームワークの関係をまとめると、「マイクロサービスアーキテクチャになっても、各サービスの中では依然としてWebフレームワークが重要な役割を担う」ということです。アーキテクチャがモノリスかサービス分割かに関わらず、開発者の助けとなるフレームワークの価値は不変です。ただし、マイクロサービス全体を見渡す視点では、サービス間通信の設計や分散トレーシング、コンテナオーケストレーションなど別の技術要素も考慮に入れる必要が出てきます。それらはフレームワークの管轄外ですが、フレームワークでしっかり各サービスを作り込むことが、マイクロサービス成功の土台となるのは間違いありません。
まとめ – Webフレームワークを活用しよう
本記事では、Webフレームワークの基礎から歴史、主要フレームワークの比較、そして簡単な実践例やマイクロサービスとの関連まで幅広く解説しました。
Webフレームワークとは何か? —— それはWeb開発における「土台・枠組み」であり、開発者の生産性とコード品質を飛躍的に高めてくれるツールです (Webアプリケーションフレームワーク – Wikipedia)。静的サイトの時代から動的サイト、そして高度化・巨大化するWebサービスの時代において、フレームワークは常に開発者を支える存在として発展してきました。Ruby on RailsやDjangoが登場した2000年代中盤以降、Webフレームワークは言語毎に百花繚乱となり、現在ではフロントエンドのReactやVueから、バックエンドのExpressやLaravel、フルスタックのRailsやDjangoまで実に様々です。それぞれ特徴はありますが、目的は共通しています。それは**「速く、安全に、みんなで開発しやすいWebアプリを作る」**ということです。
初心者の方はまず、興味を持ったフレームワークを一つ選んで実際に触れてみることをお勧めします。この記事で紹介したRuby on Railsによる入門例のように、簡単なアプリケーションを自作してみると得られるものが大きいでしょう。フレームワークの基本的な使い方(プロジェクトの作り方、MVCの役割、ルーティングの書き方、モデルとデータベース操作など)を体験すれば、Web開発の全体像が掴めるはずです。最初は分からないことも多いかもしれませんが、公式ガイドや有志の解説記事、コミュニティのQ&Aサイトなど情報源は豊富です。躓いたときは調べ、学び、少しずつ理解を深めていきましょう。
最後に強調したいのは、Webフレームワークを使いこなすことはプロのWebエンジニアへの大きな一歩になるということです。現場で開発するサービスはいずれも何らかのフレームワーク上に構築されています。フレームワークの習熟は即戦力につながり、自身のアイデアを素早く形にする力にもなります。また複数のフレームワークを経験すれば、それぞれの長所短所が見えてきてアーキテクチャ設計の引き出しも増えるでしょう。
Web技術は日進月歩で新しいトレンドが登場しますが、本質的な部分(効率よく安全に開発するための考え方)は変わりません。ぜひこの機会にWebフレームワークの世界に触れてみてください。そしてフレームワークを**活用(Use)し、最終的にはフレームワークに依存しすぎず自分のプロダクトを作り上げる克服(Master)**の境地を目指していきましょう。あなたの作る次世代の素晴らしいWebサービスを期待しています!
References:
- Webアプリケーションフレームワークの定義と目的 (Webアプリケーションフレームワーク – Wikipedia) (Webアプリケーションフレームワーク – Wikipedia)
- CGIからフルスタックフレームワークに至る歴史 (Webアプリケーションフレームワーク – Wikipedia) (Webアプリケーションフレームワーク – Wikipedia)
- Ruby on Railsの誕生と原則 (RubyとRuby on Railsの違い|Kinsta®) (2000年以降20年間のプログラミング技術の歴史を振り返って、得た知見を書いてみる #SoftwareDesign – Qiita)
- Djangoの公開と特徴 (What Is Django? | IBM) (The 10 Most Popular Websites Using Django)
- 現在人気のフレームワーク動向 (Stack Overflowが世界6万人以上のITエンジニアにアンケート。最も使われている言語はJavaScript、データベースはPostgreSQLが1位に定着。Stack Overflow 2024 Developer Survey - Publickey)
- 有名サービスの採用事例(Twitter, GitHub など) ( Top Impressive Ruby on Rails Website Examples ) ( Top Impressive Ruby on Rails Website Examples ) (Express.js – Wikipedia)