๐Ÿ“
ํ”„๋ก ํŠธ์—”๋“œ ์Šค์ฟจ ๊ต์•ˆ(1๊ธฐ)/
๐Ÿ“
Node/
๐Ÿ“
14. template_engine/
๐Ÿ“
010_template_engine\template
๐Ÿ“

010_template_engine\template

ํŒŒ์ผ์ด๋ฆ„ : 010_template_engine\template\base.html

<!DOCTYPE html><html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <p>๋ฉ”๋‰ด</p>
    {#
        ๋ณดํ†ต์€ block style, block content, block script๋กœ ๋‚˜๋ˆ  ์ž‘์„ฑ
    #}
    {% block content %}
    {% endblock %}<p>ํ‘ธํ„ฐ</p>
</body>
</html>
ํŒŒ์ผ์ด๋ฆ„ : 010_template_engine\template\test1.html

<!DOCTYPE html><html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>hello world</h1>
    <p>{{ name }}</p>
    <p>{{ age }}</p>
</body>
</html>
ํŒŒ์ผ์ด๋ฆ„ : 010_template_engine\template\test2.html

<!DOCTYPE html><html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>hello world</h1>
    {% for i in ์˜ˆ๊ธˆ %}
        <h1>{{ i.์€ํ–‰๋ช… }}</h1>
        <p>{{ i.๊ณ„์ขŒ๋ฒˆํ˜ธ }}</p>
        <p>{{ i.๊ธˆ์•ก }}</p>
    {% endfor %}{% for i, j in ์Šต๋“์—ฐ๋„ %}
    <h1>{{ i }}, {{ j }}</h1>
{% endfor %}
</body>
</html>
ํŒŒ์ผ์ด๋ฆ„ : 010_template_engine\template\test3.html

<!DOCTYPE html><html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    {# ์ฃผ์„, ์กฐ๊ฑด๋ฌธ, ๋ณ€์ˆ˜, ํ•„ํ„ฐ, ์‚ฌ์ „์‹์ •๋ ฌ #}
    <h1>hello world</h1>
    {#
        Comparisons :
        ==
        ===
        !=
        !==
        >
        >=
        <
        <=    Logic : 
    and
    or
    not
#}
{% for i in ์˜ˆ๊ธˆ %}
    {% if i.๊ธˆ์•ก <= 100 %}
        <h1 style="color:red;">{{ i.์€ํ–‰๋ช… }}</h1>
        <p>{{ i.๊ณ„์ขŒ๋ฒˆํ˜ธ }}</p>
        <p>{{ i.๊ธˆ์•ก }}</p>
    {% elif i.๊ธˆ์•ก <= 200 %}
        <h1 style="color:green;">{{ i.์€ํ–‰๋ช… }}</h1>
        <p>{{ i.๊ณ„์ขŒ๋ฒˆํ˜ธ }}</p>
        <p>{{ i.๊ธˆ์•ก }}</p>
    {% else %}
        <h1 style="color:blue;">{{ i.์€ํ–‰๋ช… }}</h1>
        <p>{{ i.๊ณ„์ขŒ๋ฒˆํ˜ธ }}</p>
        <p>{{ i.๊ธˆ์•ก }}</p>
    {% endif %}
{% endfor %}

<hr>

{% set x = 10 %}
{% set y = 10 %}
{{ x + y }}
{#
    Addition: +
    Subtraction: -
    Division: /
    Division and integer truncation: //
    Division remainder: %
    Multiplication: *
    Power: **
#}
<hr>

{# ์šฐ๋ฆฌ๊ฐ€ true๋กœ ์„ค์ •ํ•ด Autoescaping์ด ๋ฉ๋‹ˆ๋‹ค. #}
{{ text }} 
{{ text | safe }}
{{ text | escape }}
{{ -x | abs }}

<hr>
<p>์•„๋ž˜์™€ ๊ฐ™์€ ๊ฒƒ ๋ง๊ณ ๋„ join, reverse ๊ฐ™์€ ๊ฒƒ์„ ์ง€์›ํ•ฉ๋‹ˆ๋‹ค. ๊ฒŒ์‹œํŒ์— ๊ฒŒ์‹œ๋ฌผ ์ •๋ ฌํ•˜๊ธฐ ์ข‹๊ฒ ์ฃ .</p>
{% set items = {
    'ae': 1,
    'ad': 2,
    'ac': 3,
    'ba': 4,
    'bf': 5,
    'bb': 6
} %}
{% for item in items | dictsort %}
    {{ item }}
{% endfor %}
</body>
</html>
ํŒŒ์ผ์ด๋ฆ„ : 010_template_engine\template\test4.html

{% extends 'base.html' %}

{% block content %}

<p>๋‚ด์šฉ</p>
<p>๋‚ด์šฉ</p>
<p>๋‚ด์šฉ</p>
<p>๋‚ด์šฉ</p>
<p>๋‚ด์šฉ</p>
<p>๋‚ด์šฉ</p>
{% endblock %}