【Python】Flask+SQLAlchemyを使って、「ひとこと掲示板」を作る

Flaskの基本的な使い方

<シリーズ記事一覧>

flaskによるWebアプリ開発①~簡単なWebページを表示させてみる

flaskによるWebアプリ開発②~テンプレートエンジン(Jinja2)を使って動的Webページを作る

flaskによるWebアプリ開発③~GETとPOSTとformタグでのデータの送受信

flaskによるWebアプリ開発④~sqlalchemyを使ってデータベースと連動させる

Flaskで一言掲示板を作ってみる

f:id:oruka199665:20190521135931p:plain

Flaskを使って、インターネット掲示板を作るうえでまず必要なのは、書き込んだ内容を保存するデータベース、そして最近の投稿内容のデータをテンプレートに渡すjinja2になります。

<今回使うもの>

・Flask

・jinja2

・SQLALCHEMY

pyファイル側

from flask import Flask, request, render_template
from datetime import datetime
from flask_sqlalchemy import SQLAlchemy
app = Flask(__name__)
SQLALCHEMY_TRACK_MODIFICATIONS = False
app.config[‘SQLALCHEMY_TRACK_MODIFICATIONS’] = False
#SQLAlchemyでデータベースに接続する
db_uri = ‘sqlite:///test.db’
app.config[‘SQLALCHEMY_DATABASE_URI’] = db_uri
db = SQLAlchemy(app)
#データベースの仕様をクラスで定義する
class Article(db.Model):
id = db.Column(db.Integer, primary_key=True, autoincrement=True)
pub_date = db.Column(db.DateTime, nullable=False,
default=datetime.utcnow)
name = db.Column(db.Text())
article = db.Column(db.Text())
def __init__(self, pub_date, name, article):
self.pub_date = pub_date
self.name = name
self.article = article
db.create_all()

from flask import Flask, request, render_template
from datetime import datetime
from flask_sqlalchemy import SQLAlchemy
app = Flask(__name__)
db_uri = ‘sqlite:///test.db’
app.config[‘SQLALCHEMY_DATABASE_URI’] = db_uri
db = SQLAlchemy(app)
class Article(db.Model):
id = db.Column(db.Integer, primary_key=True, autoincrement=True)
pub_date = db.Column(db.DateTime, nullable=False,
default=datetime.utcnow)
name = db.Column(db.Text())
article = db.Column(db.Text())
def __init__(self, pub_date, name, article):
self.pub_date = pub_date
self.name = name
self.article = article
@app.route(“/”)
def bbs():
text = Article.query.all()
return render_template(“index.html”, lines = text)
@app.route(“/result”, methods=[“POST”])
def result():
date = datetime.now()
article = request.form[“article”]
name = request.form[“name”]
admin = Article(pub_date=date, name=name, article=article)
db.session.add(admin)
db.session.commit()
return render_template(“result.html”, article=article, name=name, now=date)
if __name__ == “__main__”:
app.run(debug=True)

HTML側

<index.html>

<!DOCTYPE html>
  <html lang=“ja”>
 
<head>
 
<meta charset=“utf-8”>
 
<meta name=“viewport” content=“width=device-width, initial-scale=1, shrink-to-fit=no”>
  <title>Flask掲示板</title>
   
 
<link rel=“stylesheet” href=“https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css”
integrity=“sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO” crossorigin=“anonymous”>
   
 
<!– <style>body {padding: 10px;}</style> –>
  </head>
 
<body>
   
  <h1>掲示板へようこそ!</h1>
   
  <form action=“/result” method=“post”>
  <input type=“hidden” name=“thread” value=“hogehoge”>
  <label for=“article”>投稿</label>
 
<!– <input type=”text” name=”article”> –>
  <textarea name=“article” rows=“6” cols=“100”></textarea>
  <p></p>
  <label for=“name”>名前</label>
  <input type=“text” name=“name”>
  <button type=“submit”>送信する</button>
  </form>
   
  <h2>投稿一覧</h2>
   
  {% block body %}
  <form method=“post” action=“”>
 <table class=“table”>
  <thead class=“thead-dark”>
  <tr>
  <th>日付</th>
  <th>名前</th>
  <th>投稿内容</th>
  </tr>
  </thead>
  <tbody>
  {% for th in lines %}
  <tr>
  <td>{{ th.pub_date }}</td>
  <td>{{ th.name }}</td>
  <td>{{ th.article }}</td>
  </tr>
   
  {% endfor %}
  </tbody>
  </table>
  </form>
  {% endblock %}
   
 <p></p>
   
 
<script src=“https://code.jquery.com/jquery-3.3.1.slim.min.js”
integrity=“sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo”
crossorigin=“anonymous”></script>
 
<script src=“https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js”
integrity=“sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49”
crossorigin=“anonymous”></script>
 
<script src=“https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js”
integrity=“sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy”
crossorigin=“anonymous”></script>
  </body>
 
</html>

<result.html>

<!DOCTYPE html>
<html lang=“ja”>
<head>
<meta charset=“utf-8”>
<meta name=“viewport” content=“width=device-width, initial-scale=1, shrink-to-fit=no”>
<title>BBS</title>
<link rel=“stylesheet” href=“https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css”
integrity=“sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO” crossorigin=“anonymous”>
<!– <style>body {padding: 10px;}</style> –>
</head>
<body>
 
<h1>書き込みました</h1>
<br>
 
<form action=“/” method=“get”>
<button type=“submit”>戻る</button>
</form>
<script src=“https://code.jquery.com/jquery-3.3.1.slim.min.js”
integrity=“sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo”
crossorigin=“anonymous”></script>
<script src=“https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js”
integrity=“sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49”
crossorigin=“anonymous”></script>
<script src=“https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js”
integrity=“sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy”
crossorigin=“anonymous”></script>
</body>
</html>

終わり

ここではこれまでやってきたFlaskでWebアプリ―ケーションを作るにあたって必要な知識を組み合わせて簡単なアプリケーションを作りました。

Flaskはこんな感じで簡単なアプリケーションであればさっと作ることができますが、大規模化には向いておらずそういった場合はDjangoというPythonのWebフレームワークを使用することになります。

Pythonでのアプリ開発の案件数は日本ではまだ多くありませんが、YoutubeやインスタグラムはPythonで作られておりそのスペックは十分にあります。MITでもプログラミングの入門にPythonを進めていますし、いずれ日本にも本格的なPythonの波がやってくると思うので、その時に生かせると思います。

プログラミングの独学はとても難しい


プログラミングは小学校の義務教育にも導入され始めており、これから社会人として生きていく上でプログラミングはもはや出来て当たり前、出来なれば論外というエクセルレベルの必須スキルになりつつあります。そしてそういう話を聞いて参考書なりを購入して独学でプログラミング勉強しようと思っている人も少なくないでしょう。しかしプログラミングを独学で勉強し始めようと思うものの



・「分からない箇所で詰まって挫折してしまった」

・「勉強する時間が足りない」

・「ネットの記事だと情報が断片的でよくわからない」

・「コードのエラーの原因が分からない」



という壁にぶち当たって、プログラミングの勉強を止めてしまう方が少なくありません。独学でプログラミングを勉強してる時間のほとんどはつまづいている時間です。実際僕も最初のころ独学でプログラミングを勉強していた頃はエラーの原因が分からず丸1日を不意にしてしまった・・・そんな苦い経験がありました。



それで僕は一度はプログラミングの学習を諦めてしまいましたが、就活で現実を知る中で「プログラミングを勉強して、いずれフリーランスとして自由な生き方がしたい」「エンジニアとして若いうちから高収入を得たい」という気持ちから一念発起して「侍エンジニアのwebサービスコース」に申し込み、プロのエンジニアの方に対面でマンツーマンでPythonによるWebサービス作り方とWeb技術の基本を教えてもらい、ようやくプログラミングが理解でき、今ではエンジニアとしてそこそこの暮らしができるようになりました。





侍エンジニアでは、とりあえずプログラミングやインターネットの基本を知っておきたい人から、HTML・cssなどでWebサイトやWebアプリを作ってみたい人やPythonを勉強してデータサイエンティストやAIエンジニアになりたい人まで幅広いニーズに応えた様々なコースが用意されています。



IT業界と言ってもエンジニアの仕事はプログラミング言語次第でサーバーから機械学習・ディープラーニングまで多種多様ですし、侍エンジニアの無料レッスン(カウンセリング)を受けてみて、自分のやりたいITの仕事は何なのか?を見つけるのがエンジニアへの第一歩になります。ちなみに今侍エンジニアの無料レッスンを受けると1000円分のAmazonギフト券がもらえるので、試しに受けてみるだけもお得です。


自分は半端に独学やオンラインスクールで勉強して金と時間を無駄にするくらいなら、リアルのプログラミングスクールに通ってしっかりプログラミングを勉強した方がいいと思います。ちなみに今、侍エンジニアに申し込むと、25歳以下の学生の方であれば、受講料が20%OFFになるので超お得です。


そして、プログラミングは大勢で授業を受けたり漫然とオンライン学習をするよりも自分が分からない箇所をピンポイントでプロの講師に直接質問して、ちゃんと納得するというスタイルの方がお金は確かに少し掛かりますが、独学で学ぶよりも絶対にモノになります。


シェアする

  • このエントリーをはてなブックマークに追加

フォローする