プログラミング

PythonのFlaskで簡単なWebアプリケーションを作ってみよう!

こんにちは!デジタルマーケターのウマたんです!

WebブラウザでアプリケーションのことをWebアプリケーションと呼びます!

アプリケーションと言えば、スマホのネイティブアプリのイメージが強いかもしれませんがWebブラウザで動くWebアプリケーションも負けていません!

そして、そんなWebアプリケーションであればPython・Javascript・HTML・CSSを使って簡単に作ることが可能です!

Pythonは普段データ解析用の言語として用いているのですが、実はWebアプリケーションを開発するサーバーサイド言語としても使えます。

Pythonは非常に優秀なプログラミング言語なのです。

この記事では、PythonのFlaskというモジュールを用いて簡単なWebアプリケーションを作っていきます!

ウマたん
ウマたん
PythonのFlaskは簡単!

PythonのFlaskとは?

Webアプリケーションを実装する言語としてはRubyやPHPなどもありますが、Webアプリケーションのロジック部分で数値計算を行うのであればPythonを同時に使用してしまった方がラクです。

高度な数値計算もWebアプリケーション開発も同時に出来てしまうのがPythonの特徴であり最強である所以なのです。

そんなPythonでWebアプリケーションを開発するためにはDjangoを使うパターンとFlaskを使うパターンがありますが、Flaskの方が軽量で簡単に実装が可能なため最初はFlaskでWebアプリケーション開発に慣れたほうが良いでしょう。

複雑なWebアプリケーションを実装する際にはDjangoが必要になってきます。

ちなみにFlaskのリファレンスは以下のサイトを参考にすると良いでしょう!

https://a2c.bitbucket.io/flask/

Flaskを使って実現したいこと

ここでは、数値を入力したら有意差を算出してくれるWebアプリケーションを作成していきたいと思います。

データのやり取りや有意差計算を行うのはPythonになりますが、表示する画面を作るのはHTML・CSS・Javascriptになります。

まずは、有意差計算のための数値を入れる画面をHTML・CSS・Javascriptを使って作ります。そしてAjaxで非同期にデータをサーバーサイドに渡しPythonで有意差計算をしてクライアントサイドに戻し表示するという流れになります。

有意差に関しては詳しく以下の記事にまとめていますのでご覧ください!

有意差とは?簡単な例で見ていこう! 統計学において頻繁に登場する有意差という概念。 実際にビジネスの現場で使われていることも多々ありますが、しっかりと有意差と...

Flaskを使ってロジック部分を作る

まずは、PythonのFlaskを使ってロジックを作っていきます。

以下がコードになります。

順番にコードを見ていきましょう!

こちらはFlaskを定義する部分。おまじないみたいなモノです。

最終的にここで定義したncをrunしてWebアプリケーションを走らせていきます。

続いて@nc.routeでルートを指定します。Webサイトで言うURLにあたります。

ここでsig.htmlという画面表示部分をレンダリングしています。

sig.htmlについては後で見ていきましょう!

この部分では、画面上で入力してもらった数値を動的にAjaxでPOST形式でサーバーサイドに送信しています。送信形式はPOSTとGETがありますが、POSTの方が秘匿性が高くなっており今回はPOSTを用いています。

json形式でデータをもらった後は、有意差を計算していきます。今回はAとBのパターンの有意差はカイ二乗検定を行って算出しています。WebマーケティングでありがちなメールのABテストなどを実装できます。

最後にこのWebアプリケーションを実装して終了です。

Webアプリケーション表示部分を作る

ロジック部分が出来上がったので、続いてWebアプリケーションの表示部分を作っていきます!

コードは以下です。

ここでは、簡単に見やすいUIを作成することの出来るBootstrapというフレームワークを使っています。

HTMLやCSSの細かい知識がなくても比較的簡単に綺麗な画面を作成することができますが、ある程度の知識は必要です。

BootstrapはTwitter社が作成したフレームワークです。以下細かいリファレンスが載っているので参考にしてみてください。

https://getbootstrap.com/

以下でBootstrapを使って画面部分を記述していきます。

比較的見やすい画面表示が出来上がりました。

続いて入力された数値を非同期にサーバーサイドに送信していきます。

Flaskのルールとして、HTMLファイルはPythonファイルと同じディレクトリ内に「templates」という名前のファイルを作成し、その中に格納しておかなくてはいけませんので注意しましょう。

CSSファイルやJSファイルは「static」ファイルに入れる必要があるのですが、今回はHTMLの中で全て完結させたので問題ありません。

Python flask まとめ

これで有意差計算Webアプリケーションが完成しました。

Flaskを使ってWebアプリケーションを作るのは比較的簡単であることが分かってもらえたと思います。

とは言えプログラミング言語の勉強は挫折しやすい!ということで以下の記事でプログラミング言語の勉強に挫折しない方法についてまとめています!

基本的には、環境と目的が大事ですね!

プログラミングを挫折しないで勉強し続けるには?こんにちは! 事業会社でWebマーケ・データ解析屋さんとしてお仕事をしているウマたんです。 大学時代に様々なプログラミング言...