๐ฉโ๐ป Learn programming
[๋๋ง์ ๋จ์ด์ฅ] 8. ๋ชฉ๋กํ์ด์ง - ๋จ์ด ๋ชฉ๋ก ๊ฐ์ ธ์ค๊ธฐ
๋ฐ๊ตฅ์
2022. 5. 4. 14:24
๋ฐ์ํ
jinja2๋ก ๋จ์ด ๋ชฉ๋ก ํ ์ด๋ธ
- DB์ ์ ์ฅ๋ ๋จ์ด ๋ชฉ๋ก์ ๊ฐ์ ธ์ ํ ์ด๋ธ์ ์ฑ์.
โ app.py - words ์ปฌ๋ ์ ์ ๋จ์ด๋ค์ ๊ฐ์ ธ์ ๋๊ฒจ์ค.
@app.route('/')
def main():
# DB์์ ์ ์ฅ๋ ๋จ์ด ์ฐพ์์ HTML์ ๋ํ๋ด๊ธฐ
words = list(db.words.find({}, {"_id": False}))
# list ์์ db.words.find๋ก ์กฐ๊ฑด ์๋ ๋ชจ๋ ๋จ์ด {}๋ฅผ ์ฐพ์. ์ฆ, words๋ ๋ด db์ ์ ์ฅ๋ ๋ชจ๋ ๋จ์ด๋ค์ ๋ฆฌ์คํธ.
# _id๋ mongodb์์ ์๋์ผ๋ก ๋ง๋ค์ด์ฃผ๋ id์ธ๋ฐ ์๋ฃํ์ด ํน์ดํด์ _id๊ฐ ๋ค์ด์๋ ๋ฆฌ์คํธ๋ฅผ render_template์ ๋ฃ์ผ๋ฉด ์๋ฌ ๋ฐ์ํ๊ธฐ ๋๋ฌธ์ False.
return render_template("index.html", words=words)
โ index.html - ๊ฐ ๋จ์ด๋ง๋ค ํ ์ด๋ธ์ ํ ์ค์ด ๋๋๋ก ๋ฃ์ด์ค
<tbody id="tbody-box">
{% for word in words %} <!--ํ๋์ ๋จ์ด์ ๋ํด์ tr ํ๋๋ฅผ ๋ง๋ค๊ธฐ ๋๋ฌธ์ for ๋ฐ๋ณต๋ฌธ ์ฌ์ฉ-->
<tr id="word-{{ word.word }}">
<td><a href="/detail/{{ word.word }}?status_give=old">{{ word.word }}</a></td>
<!-- ๋ชฉ๋ก์ ๋จ์ด๋ฅผ ํด๋ฆญํ๋ฉด ํด๋นํ๋ ์์ธ ํ์ด์ง๋ก ์ด๋, ๋จ์ด์ฅ์ ์ ์ฅ๋์ด ์๋ ๋จ์ด์ด๋ฏ๋ก status๋ old -->
<td>
{{ word.definition|safe }} <!-- word ๋ฆฌ์คํธ์ definition key -->
</td>
</tr>
{% endfor %}
</tbody>
- words ๋์ ๋๋ฆฌ ์์ word ๋ฆฌ์คํธ ์์ word, definition์ key๊ฐ ์์.
- {{ word.word }} : word ๋ฆฌ์คํธ ์์ word ํค๋ฅผ ๊ฐ๋ฆฌํด
- ์๋ฅผ ๋ค์ด,
- words = [{ โwordโ : โgoodโ , โdefinitionโ : โto be desired or approved of.โ }] ๋ผ๋ฉด,
- ์์ด๋ word-{{ word.word }} ๋ word-good ์ด ์์ด๋๊ฐ ๋จ.
๋ฐ์ํ