It's surprisingly easy to touch the bottle for the time being, it's easy. I think that is a framework that you can feel.
After all it is easy and I think that it is good to use the API so that you feel like you made it as it is.
This time, I will use bottle to create a Twitter search client.
index.py
#!/user/bin/env python
# -*- coding: utf-8 -*-
from bottle import route, run, template, request, static_file, url, get, post, response, error
from requests_oauthlib import OAuth1Session
import json
import sys, codecs
sys.stdout = codecs.getwriter("utf-8")(sys.stdout)
@route("/")
def html_index():
return template("index")
@route("/static/<filepath:path>", name="static_file")
def static(filepath):
return static_file(filepath, root="./static")
@route("/show", method="GET")
def search_twitter():
search_words = request.query.search_words
C_KEY = "*****************************"
C_SECRET = "*****************************"
A_KEY = "*****************************"
A_SECRET = "*****************************"
url = "https://api.twitter.com/1.1/search/tweets.json?"
params = {
"q": (search_words, "utf-8"),
"lang": "ja",
"result_type": "mixed",
"count": "100"
}
tw = OAuth1Session(C_KEY,C_SECRET,A_KEY,A_SECRET)
req = tw.get(url, params = params)
tweets = json.loads(req.text)
if req.status_code == 200:
for tweet in tweets["statuses"]:
created_at = (tweet["created_at"])
User = (tweet["user"]["screen_name"].encode("utf-8"))
U_Name = (tweet["user"]["name"].encode("utf-8"))
U_img = (tweet["user"]["profile_image_url"])
Text = (tweet["text"].encode("utf-8"))
return template("show",
Text=Text,
User=User,
U_Name=U_Name,
U_img=U_img,
created_at=created_at,
url=url
)
run(host="localhost", port=8000, debug=True, reloader=True)
Next, create files index.html and show.html in the views folder.
index.html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<link href="../static/css/style.css" type="text/css" rel="stylesheet" />
<title>Twitter TL</title>
</head>
<body>
<div id="content">
<div class="area">
<form method="GET" action="/show">
<p>Twitter search: <input type="text" name="search_words"> <input type="submit" value="Send"></p>
</form>
</div><!-- area -->
</div><!-- content -->
</body>
</html>
show.html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<link href="../static/css/style.css" type="text/css" rel="stylesheet" />
<title>Twitter TL</title>
</head>
<body>
<div id="content">
<div class="area">
<p><img src="{{U_img}}"></p>
<p>{{User}}:{{U_Name}}</p>
<p>TEXT: {{Text}}</p>
<p>{{created_at}}</p>
<p><input type="button" value="Reload this page" onclick="location.reload();" /></p>
</div><!-- area -->
</div><!-- content -->
</body>
</html>
This alone makes me sad, so CSS creates a static folder in the same hierarchy as the views folder and inserts it in the / CSS folder.
style.css
@charset "UTF-8";
* {
margin: 0;
padding: 0;
}
body {
margin:0;
padding:0;
}
#content {
margin-right:auto;
margin-left:auto;
width:800px;
}
.area{
margin: 80px 0 0 0;
}
ul li {
list-style:none;
margin:0;
padding:0;
}
input[type=text]{
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-o-border-radius: 5px;
-ms-border-radius: 5px;
border:#a9a9a9 1px solid;
-moz-box-shadow: inset 0 0 5px rgba(0,0,0,0.2),0 0 2px rgba(0,0,0,0.3);
-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2),0 0 2px rgba(0,0,0,0.3);
box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2),0 0 2px rgba(0,0,0,0.3);
width:50%;
height:30px;
padding:0 3px;
}
input[type=text]:focus {
border:solid 1px #20b2aa;
}
input[type=text], select {
outline: none;
}
input[type=submit]{
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-o-border-radius: 5px;
-ms-border-radius: 5px;
border:#a9a9a9 1px solid;
-moz-box-shadow: inset 0 0 5px rgba(0,0,0,0.2),0 0 2px rgba(0,0,0,0.3);
-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2),0 0 2px rgba(0,0,0,0.3);
box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2),0 0 2px rgba(0,0,0,0.3);
width:100px;
margin-left:auto;
margin-right:auto;
height:40px;
padding:0 3px;
cursor:pointer;
color:#333;
font-weight:bold;
background:#f5f5f5;
text-shadow:1px 1px 0px #fff;
text-align:center;
}
input[type=button]{
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-o-border-radius: 5px;
-ms-border-radius: 5px;
border:#a9a9a9 1px solid;
-moz-box-shadow: inset 0 0 5px rgba(0,0,0,0.2),0 0 2px rgba(0,0,0,0.3);
-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2),0 0 2px rgba(0,0,0,0.3);
box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2),0 0 2px rgba(0,0,0,0.3);
width:150px;
margin-left:auto;
margin-right:auto;
height:40px;
padding:0 3px;
cursor:pointer;
color:#333;
font-weight:bold;
background:#f5f5f5;
text-shadow:1px 1px 0px #fff;
text-align:center;
}
Now you can search for tweets from Twitter by moving index.py. If you write with% for ~ in show.html, you can display all the acquired tweets.
Recommended Posts