Django - MTV (Part 3.)
MTV pattern
MTV pattern Part 2.の延長線です.
前の部分と内容は少し違うかもしれませんが、全体の脈絡は一貫しています.
Part 3. MTV PatternにURLを接続する
😀 1.入力値を受信できるページを作成する(index.html)
🎈 (1) template (app/templates/index.html)
まずapp内のtemplatesにinputラベルを含むページを作成します.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
</head>
<body>
<div style="text-align: center">
<h1>사용자의 이름을 입력해주세요</h1>
<br />
<form action="">
// 나중에 이 action에 들어갈 값은 url로 지정해 줄 것이다. (이 때
urls에서 정해주었던 name만 적어줘도 그 페이지로 이동할 수 있게 된다.)
<label for="nameInput">이름 : </label>
<input id="nameInput" name="name" />
<input type="submit" value="제출" />
// type이 submit이면 click시 action에서 정해진 대로 요청된다.
</form>
</div>
</body>
</html>
🎈 (2)viewsで関数を作成する(app/views.py)
テンプレートに作成したhtmlに基づいてview関数を記述します.(以前とほぼ同じ)
def welcome(request):
return render(request, "index.html")
🎈 (3)urlsでパスを指定する(project/urls.py)
view関数を作成した場合は、プロジェクトフォルダにURLを指定します.
from myapp import views
urlpatterns = [
path('admin/', admin.site.urls),
path('', views.welcome, name="welcome"),
]
😀 2.inputの値を渡すページを作成する(hello.html)
🎈 (1) template (app/templates/hello.html)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
</head>
<body>
<div style="text-align: center">
<h1>반갑습니다 [여기에는 입력값이 들어갈 예정]님!</h1>
</div>
</body>
</html>
🎈 (2)viewsで関数を作成する(app/views.py)
テンプレートに作成したhtmlに基づいてview関数を記述します.(以前とほぼ同じ)
def hello(request):
userName = request.GET['name'] # 이러한 방식으로 Input 박스의 값을 가져올 수 있다. & 그것을 userName이라는 변수에 할당
return render(request, "hello.html", {'userName' : userName})
# 딕셔너리의 형태{key : value}로 hello.html에 데이터(userName)를 전달한다.
🎈 (3)urlsでパスを指定する(project/urls.py)
view関数を作成した場合は、プロジェクトフォルダにURLを指定します.
from myapp import views
urlpatterns = [
path('admin/', admin.site.urls),
path('', views.welcome, name="welcome"),
path('hello/', views.hello, name="hello"),
]
🎈 (4)テンプレートの修正
<form action="hello">
// 이렇게 urls에서 지정해주었던 name의 값을 넣어준다!
<label for="nameInput">이름 : </label>
<input id="nameInput" name="name" />
<input type="submit" value="제출" />
// type이 submit이면 click시 hello를 name의 속성 값으로 갖는 url로 이동한다.
// (name이라는 데이터를 가지고)
</form>
{{내용}}
<div style="text-align: center">
<h1>반갑습니다 {{userName}}님!</h1>
</div>
データ(userName)はhelloです。htmlによく惹かれる様子が見られます。
📒 Part 3の内容を整理する
Reference
この問題について(Django - MTV (Part 3.)), 我々は、より多くの情報をここで見つけました https://velog.io/@nathan29849/Django-MTV-patternPart-3テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol