templates

Shin Woohyun·2021년 7월 7일
0

html로 보여주기 - index

views.py

def index(request):
    return render(request, "hello/index.html")

hello 폴더 내에 templates/hello 폴더를 만들고, index.html 파일을 작성한다.
앱이 많을 경우 index.html도 많을 테니까 헷갈리지 않게끔.

/hello로 들어가면 html을 볼 수 있다.

value 전달하기 - greet

view.py

def greet(request, name):
    return render(request, "hello/greet.html", {
        "name": name.capitalize()
    })

greet.html

<h1>Hello, {{ name }}!</h1>

/hello/ron -> Hello, RON!

1월 1일이면 Yes 보여주기 - newyear

python manage.py startapp newyear
newyear라는 앱을 하나 만들고,
setting.py에 앱 추가하고,
urls.py에 newyear/ path면 newyears/urls로 가게끔 url추가하고,

views.py
datetime을 사용해서 now에 현재 시간을 넣고, 1월 1일인지 boolean을 전달한다.

from django.shortcuts import render
import datetime

def index(request):
    now = datetime.datetime.now()
    return render(request, "newyear/index.html", {
        "newyear": now.month == 1 and now.day == 1
    })

index.html

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>Is it New Year's?</title>
    </head>
    <body>
        {% if newyear %}
            <h1>YES</h1>
        {% else %}
            <h1>NO</h1>
        {% endif %}
    </body>
</html>

static CSS 연결하기

static한 css를 위해 newyear 폴더 안에 static/newyear폴더를 만들고, styles.css파일을 만든다.
styles.css

h1 {
  font-family: sans-serif;
  font-size: 90px;
  text-align: center;
}

index.html에 {% load static %}하고 link의 href에 {% static 'newyear/styles.css' %}를 넣어서 연결시킨다.

{% load static %}

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>Is it New Year's?</title>
        <link rel="stylesheet" href="{% static 'newyear/styles.css' %}">
    </head>
    <body>
        {% if newyear %}
            <h1>YES</h1>
        {% else %}
            <h1>NO</h1>
        {% endif %}
    </body>
</html>

강의 보면서 따라하는 중 https://youtu.be/w8q0C-C1js4

0개의 댓글