210818 - TIL

210818 - TIL

# 한 것

## 'Hacker News' API로 받아온 데이터를 이용해서 웹페이지 만들기

Flask, Python, Jinja

# 배운 것

## flask.render_template()

Flask configures the 'Jinja2' template engine for you automatically.

To render a template you can use the 'render_template()' method. All you have to do is provide the name of the template and the variables you want to pass to the template engine as keyword arguments.

from flask import render_template @app.route('/hello/') @app.route('/hello/') def hello(name=None): return render_template('hello.html', name=name)

https://flask.palletsprojects.com/en/2.0.x/quickstart/#rendering-templates

## Jinja2

Jinja2 is a full-featured template engine for Python. It has full unicode support, an optional integrated sandboxed execution environment, widely used and BSD licensed.

https://palletsprojects.com/p/jinja/

## Jinja2 template에서는 dictionary key의 value 값을 .(dot)으로 접근할 수 있다.

You can use a dot (.) to access attributes of a variable in addition to the standard Python __getitem__ “subscript” syntax ([]).

{{dict.key}} -> {{value}}

https://stackoverflow.com/questions/29703154/difference-between-dot-notation-and-square-brackets-in-flask-templates

## (html tag attribute)

타이틀을 클릭하여 새로운 페이지에 해당 포스트를 표시하려면 태그에 target = “_blank” 속성을 추가하면 된다.

target : 링크한 URL을 표시할 위치. 가능한 값은 브라우징 맥락으로, 즉 탭, 창, 의 이름이나 특정 키워드이다. _blank: URL을 새로운 브라우징 맥락에 표시합니다. 보통 새 탭이지만, 사용자가 브라우저 설정을 통해 새 창으로 바꿀 수 있다.

https://developer.mozilla.org/ko/docs/Web/HTML/Element/a#attr-target

https://html.com/attributes/a-target/

## safe in Jinja

{{comment.comment_text|safe}}

- Result

Before: amai: "And however difficult life may seem, there's always something you can do and succeed at."-- Stephen Hawkinghttps://www.youtube.com/watch?v=ZrVVvXOIwQc ------------------------------------------------ After: amai: "And however difficult life may seem, there's always something you can do and succeed at." -- Stephen Hawking https://www.youtube.com/watch?v=ZrVVvXOIwQc

https://flask.palletsprojects.com/en/1.1.x/templating/#controlling-autoescaping

+ (그냥 알게된 것)

html에서 태그 없이 그냥 개행 넣고 글자를 쓰면 브라우저에 출력됐을 때, 자동으로 양 옆에 공백이 생긴다.

✅ 작성한 Jinja template(python code는 '210817 - TIL'에 있음

- index.html

Refigo News | Popular Refigo News Order by: {% if popular %} Popular | New {% elif new %} Popular | New {% endif %} {% for hit in hits %} {{hit.title}} ({{hit.url}}) {{hit.points}} points | By: {{hit.author}} | {{hit.num_comments}} comments {% endfor %}

- detail.html

Refigo News | {{info.title}} {{info.title}} {{info.points}} points | By {{info.author}} | {{info.url}} {% for comment in comments %} {% if not comment.author %} [deleted] {% else %} {{comment.author}}: {{comment.comment_text|safe}} {% endif %} {% endfor %}

from http://refigo.tistory.com/25 by ccl(A) rewrite - 2021-08-20 21:00:52