1. 블로그 제출 양식
# vim app/forms.py
# ...
# 블로그 제출 양식
class PostForm(FlaskForm):
post = TextAreaField('Say something', validators=[
DataRequired(), Length(min=1, max=140)])
submit = SubmitField('Submit')
2. index 템플릿으로 제출 양식 게시
<!-- vim app/templates/index.html -->
{% extends "base.html" %}
{% block content %}
<h1>Hi, {{ current_user.username }}!</h1>
<!-- 색인 템플릿으로 제출 양식 게시 -- >
<form action="" method="post">
{{ form.hidden_tag() }}
<p>
{{ form.post.label }}<br>
{{ form.post(cols=32, rows=4) }}<br>
{% for error in form.post.errors %}
<span style="color: red;">[{{ error }}]</span>
{% endfor %}
</p>
<p>{{ form.submit() }}</p>
</form>
{% for post in posts %}
<div><p>{{ post.author.username }} says: <b>{{ post.body }}</b></p></div>
{% endfor %}
{% endblock %}
3. 인덱스 보기 기능으로 제출 양식을 게시함
# vim app/routes.py
# ...
from app.forms import PostForm
from app.models import Post
# 해당 뷰 함수는 이제 양식 데이터를 수신하기 때문에 요청 외에도 뷰 함수 POST와 관련된 두 경로의 요청을 수락함
@app.route('/', methods=['GET', 'POST'])
@app.route('/index', methods=['GET', 'POST'])
@login_required # 이 라인 바로 위 링크는 인증된 사용자만 접근 가능하도록 하는 설정
# 인덱스 보기 기능으로 제출 양식을 게시
def index():
# PostForm 클래스 가져오기
form = PostForm()
if form.validate_on_submit():
# Post 클래스 가져오기
post = Post(body=form.post.data, author=current_user)
# 양식 처리 논리 Post는 데이터베이스에 새 레코드 삽입
db.session.add(post)
db.session.commit()
flash('Your post is now live!')
return redirect(url_for('index'))
posts = [
{
'author': {'username': 'John'},
'body': 'Beautiful day in Portland!'
},
{
'author': {'username': 'Susan'},
'body': 'The Avengers movie was so cool!'
}
]
# 템플릿 form은 텍스트 필드를 렌더링할 수 있도록 개체를 추가 인수로 받음
return render_template("index.html", title='Home Page', form=form,
posts=posts)
# ...웹 양식을 제출한 후 사용자가 실수로 페이지를 새로고칠 때 중복으로 게시물이 삽입되지 않도록 하기 위해 redirection을 진행해줌 -> Post / Redirect / Get 패턴이라고 함
4. home에서 내 게시글들 보이도록 기능 추가
# vim app/routes.py
# ...
def index():
# ...
posts = current_user.followed_posts().all()
return render_template("index.html", title='Home Page', form=form,
posts=posts)
5. 검색 전용 웹페이지 링크 버튼 활성화
# vm app/routes.py
# ...
# 검색 전용 페이지 - Post 테이블의 데이터를 시간순서대로 가져옴
@app.route('/explore')
@login_required
def explore():
posts = Post.query.order_by(Post.timestamp.desc()).all()
return render_template('index.html', title='Explore', posts=posts)
# ...
6. index 템플릿으로 제출 양식 게시하도록 해줌
<!-- vim app/templates/index.html -->
{% extends "base.html" %}
{% block content %}
<h1>Hi, {{ current_user.username }}!</h1>
<!-- 블로그 제출 양식을 선택사항으로 만들어줌 -->
{% if form %}
<!-- 색인 템플릿으로 제출 양식 게시 -->
<form action="" method="post">
...
</form>
{% endif %}
...
{% endblock %}
7. 검색페이지 버튼 추가
<!-- vim app/templates/base.html -->
<!-- ... -->
{% else %}
<a href="{{ url_for('user', username=current_user.username) }}">Profile</a>
<a href="{{ url_for('logout') }}">Logout</a>
<a href="{{ url_for('explore') }}">Explore</a>
{% endif %}
<!-- ... -->
8. 블로그 게시물에 작성자의 블로그 링크 표시 기능 추가
<!-- vim app/templates/base.html -->
<!-- 포스트 서브 템플릿 생성 -->
<table>
<tr valign="top">
<td><img src="{{ post.author.avatar(36) }}"></td>
<!-- 블로그 게시물에 작성자 링크 표시 -->
<td>
<a href="{{ url_for('user', username=post.author.username) }}">
{{ post.author.username }}
</a>
says:<br>{{ post.body }}
</td>
</tr>
</table>
9. 블로그 게시물 하위 템플릿인 _post.html을 불러와 사용
<!-- vim app/templates/index.html -->
<!-- ... -->
{% for post in posts %}
{% include '_post.html' %} <!-- 블로그 게시물 하위 템플릿 사용 -->
<!-- <div><p>{{ post.author.username }} says: <b>{{ post.body }}</b></p></div> -->
{% endfor %}
<!-- ... -->