プログラミングにおけるフレームワークとは?特徴と使い方、コードの具体例を解説!

 2021.03.26  株式会社システムインテグレータ

フレームワークとは「全体の処理の流れがある程度決められている開発ツール」です。Webアプリやスマホアプリを作る際、自分で1から作っていくと非常に時間がかかります。それを解消してくれるのがフレームワークです。

 本記事ではフレームワークの概要について、主にWebフレームワークを中心にご紹介した後、イメージをより鮮明にするため、フレームワークがどんな動きをするのかまでお見せします。

 フレームワークを使いこなして、爆速でアプリ開発できるようになりましょう

フレームワークとは

突然ですが、もし今からブログ機能を持つアプリケーションをつ作れと言われたら、どうやって作りますか?一度でもアプリを作ったことがあれば開発の流れはつかめていると思いますが、一度も作ったことがない方は恐らく頭が真っ白になるのではないでしょうか?何から手をつければ良いかも分からず、途方にくれるはずです。なぜなら、プログラミングというものは非常に自由で、縦にも横にも広がっている世界だからです。

理論上、プログラミングができればあらゆるシステムやアプリケーションが開発できます。しかし、あまりに自由すぎると逆に何もできなくなるものです。

この問題を解決するのが「フレームワーク」です。

フレームワークは「枠組み」や「骨組み」「構造」といった意味を持つ言葉で、あまりに自由すぎるプログラミングの世界に一定のルールや制限をつけてくれます。フレームワークはインターネット上にいくつも存在しているので、自分が作りたいアプリを作れるフレームワークを選ぶことで、アプリ開発のゴールまで最短距離で導いてくれます。これがフレームワークを使う利点です。

ライブラリとの違い

似たようなシステムにライブラリが存在しますが、フレームワークが枠組みやルールによって開発をスムーズにできるようにするものなのに対し、ライブラリは「システム内の要所要所で使える便利なシステム群」というニュアンスです。

フレームワークはシステム全体の枠組みライブラリは小さなシステムと覚えておくと良いでしょう。

詳しい内容はこちらに記載しています。
ライブラリとは?特徴と使い方、具体例について解説します。

Webフレームワークとは

WebフレームワークとはWebを使ったシステムやアプリケーションの開発に向いているフレームワークです。

 単にフレームワークと言うと、たいていの場合はWebフレームワークを指していることが多く、有名なプログラミング言語には基本的に公式・非公式問わず用意されています(フレームワークはその言語の開発者以外の第三者でも作れます)。

 Webフレームワークの最も基本的な部分はHTTP通信の制御です。HTTPを通してWebサーバーに必要なデータをリクエストし、そのレスポンスを取得し返却することがコアとなっています。 ですがそれだけでは味気ないので、ほとんどのWebフレームワークには以下の機能がアタッチされています。

  • モデル(Model):POSTされたデータをデータベースへ保存する
  • ビュー(View):取得したhtmlを画面に表示する
  • コントローラー(Controller):HTTPリクエストを受け取り、モデルやビューに命令を出す

 また、この3つの枠組みを持ったWebフレームワークのことを「MVCフレームワーク」と言います。

Webフレームワークの種類

基本的にプログラミング言語ごとにフレームワークは存在しますが、ここではPythonのWebフレームワークをご紹介します。

Flask

Flask(フラスク)は最小限の機能でシンプルなWebアプリケーションを開発する場合に優れたWebフレームワークです。

Flask公式で、最小限の機能だけを持ったフレームワークのことを「マイクロフレームワーク」と呼んでいます。

Django

Django(ジャンゴ)はWeb開発におけるあらゆる機能が備わっているWebフレームワークです。そのようなフレームワークのことを「フルスタックフレームワーク」と呼びます。

また、Djangoは完全にではありませんが、MVCフレームワークに近い機能を持っていて、それぞれの機能ごとにコードを分割し、整理整頓されたソースコードを記述できます。

Webフレームワークを使ってみる

より深くWebフレームワークを理解してもらうため、ここではFlaskを使ってどのようにアプリケーションを作っていくのかのデモンストレーションをしていきます。今回はボタンを押したら数値がずつ増えていく、シンプルなカウンターを作成します。

FlaskはWebフレームワークですが、ライブラリとしてもインポート可能です。

 コードは以下の通りです。

コード(main.py):

from flask import Flask, render_template, request, redirect, url_for
import os

app = Flask(__name__)

@app.route('/')
def index():
    return render_template("index.html", counter=0)

@app.route('/plus', methods=["POST"])
def plus():
    counter = int(request.form['counter']) + 1
    return render_template("index.html", counter=counter)

app.run(debug=True, host=os.getenv('APP_ADDRESS', 'localhost'), port=8001)

色々書いていますが、重要なのは@app.routeです。@app.route(‘/’)は「http://localhost:8001/」を指定することでその下のindex関数を動作させることができます。同じく’plus’の方は「http://localhost:8001/plus」を指定することでその下の関数を動作させられます。

 つまり、URLに応じてどの処理を呼ぶのかをルーティングしています。index()はindex.htmlを開いています。その際にcounterという変数に0を代入して渡しています。plus/はjavascript側から送られてきたcounterに1を足して、index()と同じようにindex.htmlを開きます。

index.htmlはこのようにしました(body部のみ抜粋)。
index.htmlは、main.pyの横にtemplatesディレクトリを作成して保存しましょう。

コード(index.html):

<!DOCTYPE html>
<html lang="ja">

<head>
    <meta charset="utf-8" />
    <script
src="https://code.jquery.com/jquery-3.5.1.js"
integrity="sha256-QWo7LDvxbWT2tbbQ97B53yJnYU3WhH/C8ycbRAkjPDc="
crossorigin="anonymous"></script>
</head>

<body>
    <form name="f" method="post">
    <p>count:</p>
      <button type="button" name="btn_plus">+1</button>
      <input type="hidden" name="counter" value="">
   </form>
   <script>
    $(document).ready(function(){
        $('button[name="btn_plus"]').click(function() {
        $('form[name="f"]').attr('action', '/plus');
          $('form[name="f"]').submit();
});
    });
</script>
</body>

</html>

 簡単に説明すると、にはindex()やplus()から渡されるcounter変数が入ります。また、+1ボタンを押すとhttp://localhost:8001/plusでリクエストするようになっています。これで実装は終わりです。このプログラムを実行してhttp:localhost:8001/をリクエストすると、次の画面が表示されます。

画像1

count:0の「0」はindex()から渡したcounter変数を表示しています。
+1ボタンを押すとこうなります。

画像2

URLがhttp://localhost:8001/plusに変わり、countが1になりました。これはPython側のplus()呼ばれているからです。
何度か+1ボタンを押すことで、1ずつ増えていきます。

画像3

このように、Flaskを使うことで「リクエストの受け取り」→「内部処理」→「結果の画面表示」という流れを簡潔に作ることができます。

今回は入れませんでしたが、一般的なアプリケーションでは内部処理でデータベースを扱うことも多いでしょう。その場合もFlaskはFlask独自のデータベース操作のライブラリを追加することで、比較的容易にDB連携が可能になっています。

これでデモンストレーションは終了です。

まとめ:フレームワークはシステム開発の道しるべ

自由すぎるプログラミングの世界の中で、自分が何をすべきなのかを明確にしてくれるという点で、フレームワークはシステム開発の道しるべとしての役割を持っています。何か作りたいと思い立ったら、まずはどんなフレームワークがあるのかを調べるのが、開発をスムーズに進めるためにやるべきことで、非常に重要です。

また、今回はPythonのフレームワークのみ紹介しましたが、有名なプログラミング言語であれば、フレームワークは基本的にあると思って良いでしょう。

自分が勉強中の言語にどんなフレームワークがあるのか、一度調べてみると成長するためのきっかけをつかめるかもしれませんよ!

CTA

RELATED POST関連記事


RECENT POST「プログラミング」の最新記事


プログラミング

Pythonとは?|言語の特徴と学習するメリット

プログラミング

競技プログラミングとは?問題例や参加方法なども解説!

プログラミング

JavaScriptとは?特徴やできることまとめ

プログラミング

PHPとは?特徴やできることまとめ

プログラミングにおけるフレームワークとは?特徴と使い方、コードの具体例を解説!