7
11

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Herokuとpythonのwebフレームワークbottleを使ってWebアプリ(オウム返し)を作る【入門者向け】

Last updated at Posted at 2016-11-27

#はじめに
LINE BOT作成するにあたって作ってみようと思い作成。
せっかくなので自分用のメモついでに記事にしてみました。

#実行環境
OS X 10.12.1
Python 3.5.1
bottle 0.12.10

#まずは事前準備

##Heroku

###1.Herokuのアカウント作成
こちらから登録を行います。

###2.Heroku CLI のインストール
Heroku CLIはHerokuをコマンドラインで操作するためのものです。
こちらでOS X installerをダウンロードし、Heroku CLIのインストールを行います。

##bottleのインストール
bottleとはwebアプリケーションのフレームワークです。これを今回使用していきます。
以下のコマンド入力してインストールを行います。pipについてはググってください。

% pip install bottle

#いざ実装

##環境構築

環境構築と言ってもやることは一つでgitコマンドで環境を設定するだけです。
sampleというディレクリ内で作業していきましょう。

% mkdir sample
% cd sample
% git init

##オウム返しアプリ開発

エディタを開いて以下のようにコードを書きます。

app.py
# -*- coding:utf-8 -*-

import os
from bottle import route, run
from bottle import get, post, request


@route('/', method='GET')
def input():
    input_txt = request.query.get('user')
    #GETで何も渡されていない時はinput_txtに何も入れない
    input_txt = "" if input_txt is None else input_txt
    return '''
    <form action="/" method="post">
            INPUT: <input name="input_txt" type="text" value="{input_txt}"/>
            <input value="echo" type="submit" />
        </form>
    '''.format(input_txt=input_txt)


@route('/', method='POST')
def do_echo():
    input_txt = request.forms.get('input_txt')
    return "{input_txt}".format(input_txt=input_txt)

run(host="0.0.0.0", port=int(os.environ.get("PORT", 5000)))

##Herokuにデプロイするための準備

python アプリを Heroku にデプロイするためには、依存関係のあるライブラリをrequirements.txt というファイルに書き込んでおく必要があります。また、Procfile というファイルも必要になります。
今回使用した bottle のバージョンを pip freeze で確認すると bottle==0.12.10 という記述が見つかるので以下のコマンドで requirements.txt に記入します。また、Procfile の作成には以下のようなコマンドを入力します。

% echo bottle==0.12.10 > requirements.txt
% echo web: python app.py > Procfile

このディレクトリ内での作業は以上で終了ですので、gitコマンドでコミットしておきます。

% git add .
% git commit -m "first commit"

##アプリをHerokuにデプロイ

Herokuにログインします。

% heroku login

と入力すると、先ほど登録したE-mailアドレスとパスワードを聞かれるので入力します。
成功すると以下のように表示されるはずです。

Logged in as 登録したメールアドレス

次に以下のように入力します。注意点としては "heroku apps:create XXX " の XXX は Heroku全体から見てユニークな名前にしなければならないという点です。なので誰とも被っていない名前を使うようにしましょう。被っていた場合は ▸ Name is already taken と表示されるはずです。

% heroku apps:create myapp-117118
% git push heroku master

ここまでの手順で誤りがなければ remote: Verifying deploy... done. が表示されているはずです。これが表示されていれば公開先はremote:      https://myapp-117118.herokuapp.com/ deployed to Herokuの部分に書かれていますので、```
% open https://myapp-117118.herokuapp.com/


##公開したアプリの確認

適当な文字を入力し・・・echoをクリック。
![スクリーンショット 2016-11-28 3.14.35.png](https://qiita-image-store.s3.amazonaws.com/0/150412/e840ae49-8f37-2306-8c34-2c19f5601dcb.png)

きちんと反映されていますね!
![スクリーンショット 2016-11-28 3.14.45.png](https://qiita-image-store.s3.amazonaws.com/0/150412/45cc792b-7c02-8023-ecf2-341a446688d5.png)

#おわりに

思ったより簡単にwebアプリが作成できたという印象なのではないでしょうか?
プログラミング自体ほとんどやったことがないという方には "app.py" に書かれているコードを理解するのに苦労するかもしれませんが・・・

ちなみに今回が初投稿なのですが、どこでどう区切ると良いのか・・ってことが一番難しいですね(笑) 記事を書いている他のみなさんの凄さを改めて実感しています・・。
また、私も初心者なので改善すべき内容や誤った内容がありましたらご教授ください。


7
11
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
7
11

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?