产辞迟迟濒别で始める奥贰叠アプリの最初の一歩
?
21 likes?16,201 views
(2017/09 追記)http://www.denzow.me/archive/category/Bottle でまとめ直し始めました PythonのWAFの中でもとりわけ軽量?シンプルなBottleを使って アプリケーション作成の第一歩を踏み出すお手伝いをします。
![11
WEBアプリに必要なもの
ビジネスロジック → あなたがやりたいこと
普通の処理
def view_list():
connect = db.connect()
cur = connect.cursor()
cur.execute("select id,name from items order by id")
item_list = []
for row in cur.fetchall():
item_list.append({
"id":row[0], "item_name": row[1]
})
return item_list
DBから商品一覧を
取得したい etc](https://image.slidesharecdn.com/20160705bottle-160706101539/85/bottle-WEB-11-320.jpg)
![34
アイテム一覧見たい
# アイテム一覧を戻す関数
@route("/list")
def view_list():
# ダミーデータ(あとでDBから取得するようにする)
item_list = [
{"id": 1, "name": "りんご"},
{"id": 2, "name": "ばなな"},
{"id": 3, "name": "すいか"},
]
# 表示用のHTMLを組み立てる
display_html = "<table border='1'>"
for item in item_list:
display_html += "<tr>"
display_html += "<td>{}</td>".format(item["id"])
display_html += "<td>{}</td>".format(item["name"])
display_html += "</tr>"
display_html += "</table>"
return display_html
app.py](https://image.slidesharecdn.com/20160705bottle-160706101539/85/bottle-WEB-34-320.jpg)
![37
テンプレート使う
<h1>アイテム一覧</h1>
<table border="1">
%for item in item_list:
<tr>
<td>{{item["id"]}}</td>
<td>{{item["name"]}}</td>
</tr>
%end
</table>
list_tmpl.tpl
ほぼHTML
% や{{ }}のなかだけ
Pythonのように処理される
item_listは
使うときにapp.pyから
ディクショナリを渡す](https://image.slidesharecdn.com/20160705bottle-160706101539/85/bottle-WEB-37-320.jpg)
![38
テンプレート使う
from bottle import route, run, template
：
：
# アイテム一覧を戻す関数
@route("/list")
def view_list():
# ダミーデータ(あとでDBから取得するようにする)
item_list = [
{"id": 1, "name": "りんご"},
{"id": 2, "name": "ばなな"},
{"id": 3, "name": "すいか"},
]
# 表示はテンプレートを戻すだけ
return template("list_tmpl", item_list=item_list)
app.py](https://image.slidesharecdn.com/20160705bottle-160706101539/85/bottle-WEB-38-320.jpg)
![42
DBからitem_listを取得するように変更
import sqlite3
from bottle import route, run, template
：
：
@route("/list")
def view_list():
# items.dbとつなぐ
conn = sqlite3.connect('items.db')
c = conn.cursor()
c.execute("select id,name from items order by id")
item_list = []
for row in c.fetchall():
item_list.append({
"id": row[0],
"name": row[1]
})
conn.close()
# 表示はテンプレートを戻すだけ
return template("list_tmpl", item_list=item_list)
app.py](https://image.slidesharecdn.com/20160705bottle-160706101539/85/bottle-WEB-42-320.jpg)
![45
ルーティングとメソッド作成
@route("/add", method=["GET","POST"])
def add_item():
return template("add_tmpl")
app.py GETとPOST
両方でアクセス
できるようにする](https://image.slidesharecdn.com/20160705bottle-160706101539/85/bottle-WEB-45-320.jpg)
![47
ルーティングとメソッド作成
@route("/add", method=["GET","POST"])
def add_item():
if request.method == "POST":
# POSTアクセスならDBに登録する
# フォームから入力されたアイテム名の取得(Python2ならrequest.POST.getunicodeを使う)
item_name = request.POST.getunicode("item_name")
conn = sqlite3.connect('items.db')
c = conn.cursor()
# 現在の最大ID取得(fetchoneの戻り値はタプル)
new_id = c.execute("select max(id) + 1 from items").fetchone()[0]
c.execute("insert into items values(?,?)", (new_id, item_name))
conn.commit()
conn.close()
return "SUCCESS"
else:
# GETアクセスならフォーム表示
return template("add_tmpl")
app.py
POST/GETで分岐
GETはフォーム出すだけ
formからPOSTされた
データを取得](https://image.slidesharecdn.com/20160705bottle-160706101539/85/bottle-WEB-47-320.jpg)
![50
一覧画面のテンプレート変更し削除リンク追加
<h1>アイテム一覧</h1>
<a href='/add' >新規作成</a>
<table border="1">
%for item in item_list:
<tr>
<td>{{item["id"]}}</td>
<td>{{item["name"]}}</td>
<td><a href="/del/{{item['id']}}">削除</a></td>
</tr>
%end
</table>
list_tmpl.tpl
ついでに新規作成つけとく
削除リンク
/del/1や/del/2といった
URLへリンクする](https://image.slidesharecdn.com/20160705bottle-160706101539/85/bottle-WEB-50-320.jpg)
产辞迟迟濒别で始める奥贰叠アプリの最初の一歩
- 2. 2 # whoami ?名前 ? 山田 聡(@denzowill) ?仕事 ? DBエンジニア(○racle,PostgreSQL) ? チョットだけWebLogicエンジニア ? Pythonは趣味 ?スキル ? 統計もわかりません ? 機械学習もわかりません ? ちょっとWEBアプリわかります
- 8. 8 今回は？
- 11. 11 WEBアプリに必要なもの ビジネスロジック → あなたがやりたいこと 普通の処理 def view_list(): connect = db.connect() cur = connect.cursor() cur.execute("select id,name from items order by id") item_list = [] for row in cur.fetchall(): item_list.append({ "id":row[0], "item_name": row[1] }) return item_list DBから商品一覧を 取得したい etc
- 12. 12 WEBアプリに必要なもの HTMLの表示 → ビジネスロジックの結果を画面に <h1>アイテム一覧</h1> <table border="1"> %for item in item_list: <tr> <td>{{item.id}}</td> <td>{{item.name}}</td> </tr> %end </table>
- 14. 14 フレームワークとハードル ?WEBアプリケーションフレームワーク(WAF)？ あるルールに従って作成すると、簡単にWEBアプリケー ションが作成できるようにしたライブラリの集合のよう なもの。
- 15. 15 フレームワークのよくある機能 ?ルーティング ? URLに応じて処理先を割り当て ?テンプレート ? HTMLを簡単に動的に組み立て ?ORM ? 搁顿叠惭厂等をオブジェクトとして透过的に操作
- 16. 16 フレームワークのよくある機能 ?ルーティング ? URLに応じて処理先を割り当て ?テンプレート ? HTMLを簡単に動的に組み立て ?ORM ? 搁顿叠惭厂等をオブジェクトとして透过的に操作 フレームワークによっては 他のORMライブラリを 組み込むケースも
- 20. 20 このあたりから 途端に辛い
- 21. 21 なんでつらい？ ?MVCとかMTVとかいろいろある ?フレームワーク毎に解釈が違ったりする ?フレームワークの作法に従えばなんとなくは できる ?でも、それはそのフレームワークに縛られる
- 31. 31 Bottleセットアップ $ mkdir <適当なディレクトリ> $ cd <作ったディレクトリ> $ wget https://github.com/bottlepy/bottle/raw/master/bottle.py bottle.pyを持ってくれば終わり
- 32. 32 Bottleの動作確認 from bottle import route, run # / にアクセスしたら index関数が呼ばれる @route("/") def index(): # 画面に表示されて欲しいHTMLを戻す return "<h1>WELCOME STAPY!</h1>" # サーバを起動(localhost:9999で起動する設定) run(reloader=True, port=9999) app.py
- 34. 34 アイテム一覧見たい # アイテム一覧を戻す関数 @route("/list") def view_list(): # ダミーデータ(あとでDBから取得するようにする) item_list = [ {"id": 1, "name": "りんご"}, {"id": 2, "name": "ばなな"}, {"id": 3, "name": "すいか"}, ] # 表示用のHTMLを組み立てる display_html = "<table border='1'>" for item in item_list: display_html += "<tr>" display_html += "<td>{}</td>".format(item["id"]) display_html += "<td>{}</td>".format(item["name"]) display_html += "</tr>" display_html += "</table>" return display_html app.py
- 37. 37 テンプレート使う <h1>アイテム一覧</h1> <table border="1"> %for item in item_list: <tr> <td>{{item["id"]}}</td> <td>{{item["name"]}}</td> </tr> %end </table> list_tmpl.tpl ほぼHTML % や{{ }}のなかだけ Pythonのように処理される item_listは 使うときにapp.pyから ディクショナリを渡す
- 38. 38 テンプレート使う from bottle import route, run, template ： ： # アイテム一覧を戻す関数 @route("/list") def view_list(): # ダミーデータ(あとでDBから取得するようにする) item_list = [ {"id": 1, "name": "りんご"}, {"id": 2, "name": "ばなな"}, {"id": 3, "name": "すいか"}, ] # 表示はテンプレートを戻すだけ return template("list_tmpl", item_list=item_list) app.py
- 41. 41 初期データの準備 import sqlite3 # items.dbとつなぐ(なければ作られる) conn = sqlite3.connect('items.db') c = conn.cursor() # テーブル作成 c.execute("create table items(id, name)") # 3行投入 c.execute("insert into items values(1,'りんご')") c.execute("insert into items values(2,'ばなな')") c.execute("insert into items values(3,'すいか')") # 確定 conn.commit() # バイバイ conn.close() pythonを対話型で起動して実行
- 42. 42 DBからitem_listを取得するように変更 import sqlite3 from bottle import route, run, template ： ： @route("/list") def view_list(): # items.dbとつなぐ conn = sqlite3.connect('items.db') c = conn.cursor() c.execute("select id,name from items order by id") item_list = [] for row in c.fetchall(): item_list.append({ "id": row[0], "name": row[1] }) conn.close() # 表示はテンプレートを戻すだけ return template("list_tmpl", item_list=item_list) app.py
- 43. 43 登録処理作る
- 44. 44 登録用のフォームのテンプレート作る <h1>アイテム登録</h1> <form action='' method='POST'> <input type='text' name='item_name' placeholder='アイテム名'/> <input type='submit' value='登録' /> </form> add_tmpl.tpl
- 45. 45 ルーティングとメソッド作成 @route("/add", method=["GET","POST"]) def add_item(): return template("add_tmpl") app.py GETとPOST 両方でアクセス できるようにする
- 47. 47 ルーティングとメソッド作成 @route("/add", method=["GET","POST"]) def add_item(): if request.method == "POST": # POSTアクセスならDBに登録する # フォームから入力されたアイテム名の取得(Python2ならrequest.POST.getunicodeを使う) item_name = request.POST.getunicode("item_name") conn = sqlite3.connect('items.db') c = conn.cursor() # 現在の最大ID取得(fetchoneの戻り値はタプル) new_id = c.execute("select max(id) + 1 from items").fetchone()[0] c.execute("insert into items values(?,?)", (new_id, item_name)) conn.commit() conn.close() return "SUCCESS" else: # GETアクセスならフォーム表示 return template("add_tmpl") app.py POST/GETで分岐 GETはフォーム出すだけ formからPOSTされた データを取得
- 49. 49 削除処理作る
- 50. 50 一覧画面のテンプレート変更し削除リンク追加 <h1>アイテム一覧</h1> <a href='/add' >新規作成</a> <table border="1"> %for item in item_list: <tr> <td>{{item["id"]}}</td> <td>{{item["name"]}}</td> <td><a href="/del/{{item['id']}}">削除</a></td> </tr> %end </table> list_tmpl.tpl ついでに新規作成つけとく 削除リンク /del/1や/del/2といった URLへリンクする
- 51. 51 削除処理を追加、URLから削除対象のID取得 # /del/100 -> item_id = 100 # /del/one -> HTTPError 404 @route("/del/<item_id:int>") def del_item(item_id): conn = sqlite3.connect('items.db') c = conn.cursor() # 指定されたitem_idを元にDBデータを削除 c.execute("delete from items where id=?", (item_id,)) conn.commit() conn.close() # 処理終了後に一覧画面に戻す return redirect("/list") app.py delの後ろに数字がくると 関数の引数として取れる 後はそれで delete文するだけ
- 55. 55 次の一歩に向けて ?参照?登録?削除ができればアプリは作れる ?見た目はCSSやJavascriptを覚える ? 参考:Bootstrap http://getbootstrap.com/ ?アプリが大きくなると各所で辛さが出る ? SQLの管理 ? ルーティングの管理 ?辛くなったらもっと高機能なWAFを覚えて見る