-
Django MTV 패턴, Templates 작성Django 2024. 8. 12. 10:54
저번에 flask로 가위바위보 게임 웹페이지를 만들어보기도 했지만.. 웹 브라우저에서 열리니까 웹 페이지 맞긴한데..
근데 왜 네이버나 구글은 진짜 웹 사이트 같은데 내가 만든 건 왜.. 진짜 같지가 않지?🤔 하는 궁금증이 있었다.
그 궁금증에 대한 답은 바로 정적 웹페이지와 동적 웹페이지의 차이였다.
정적 웹페이지(Static Web Page)
- 작성한 상태를 그대로 제공하는 웹 페이지
- 모든 상황에서 동일한 내용을 전달한다.
- 우리가 작성한 HTML을 말한다.
동적 웹페이지(Dynamic Web Page)
- 요청에 따라 보여주는 모습이 달라지는(수정되어 보여지는) 웹 페이지
- 예를 들어, A유저가 로그인했을 때와 B유저가 로그인했을 때의 화면이 다름 (받은 메일의 개수, 가입한 카페…)
- 누군가가 수정해줘야 한다는 의미.
→ 즉, 요청을 받아서 적절한 응답을 만들어주는 주체가 필요하다. 그게 바로 Django!
장고를 배우고 나면 우리도 이제 동적 웹페이지를 만들 수 있다😊
cs를 공부하다보면 디자인 패턴이라는 게 나온다.
디자인 패턴은 자주 사용되는 소프트웨어의 구조를 마치 건축 공법처럼 일반화해둔 것을 말하는데, 이렇게 패턴을 만들어놓으면 뭐가 좋을까? 특정 구조에 대해 빠른 설계를 할 수 있고 공통적으로 발생하는 문제에 대해서도 빠른 해결이 가능하다.
달리 말하면, 어떤 소프트웨어에 적용된 디자인패턴을 알면, 그 소프트웨어의 구조와 작동 방식에 대해 더 잘 이해할 수 있게 된다는 뜻이다.
그렇다면 Django의 디자인 패턴은 뭘까? 🤔
Django에는 MVC패턴을 변형한 MTV 디자인패턴이 적용되어 있다.
MVC 패턴은 또 뭔데..🫠
MVC 디자인 패턴은 '데이터와 논리 구조를 제어하는 설계'로 널리 사용되는 디자인 패턴 중 하나로,
하나의 큰 소프트웨어를 나눠서 생각해보기 위해서 등장한 패턴이다. Model - View - Controller 3파트로 나누어져 있다.
- Model : 데이터와 관련된 로직을 관리
- View : 레이아웃과 관련된 화면을 처리
- Controller : Model과 View를 연결하는 로직을 처리
그럼 이렇게 분리하는 이유가 뭘까?
📌 각 부분을 독립적으로 개발할 수 있어서 생산성이 증가하고 유지보수가 쉬워진다.
📌 다수의 멤버가 동시에 개발하기에 용이하다.
그럼.. Django의 MTV 패턴은?
사실 거의 똑같고 이름만 다름..🤭
MVC MTV Model Model View Template Controller View MVC의 View의 기능을 MTV의 Template이, MVC의 Controller의 기능을 MTV의 View가 수행한다.
응?🫠
둘 다 view가 있어서 좀 헷갈리는데..ㅎㅎ
암튼, 장고의 MTV 패턴은
- 데이터와 관련된 로직은 → Model이 처리하고
- 보여지는 부분인 레이아웃이나 화면상의 로직은 → Template이 처리하고
- 메인 비즈니스 로직, 이것 저것 요청받고 응답 보내는 일은 → View가 처리한다
View는 데이터가 필요하면 Model한테 요청해서 받고, 화면상의 뭔가가 필요하면 Template한테 요청해서 받고, 클라이언트한테서 요청이 오면 그 요청도 처리하고 외부로 응답도 보내고.. 암튼 이것 저것 다 하는 애다.
그럼 Django가 요청을 받고 응답을 하는 과정을 실습을 통해 알아보자.
[순서]
요청(Request)이 들어오면 → URL(urls.py) 처리 → View(views.py) 처리 → Template(html) 처리 → 응답(Response) 전달
URL
일단 urls.py 파일을 열어보자. 여기는 어떤 url 패턴을 어디의 뷰로 보낼지 설정해주는 곳이다.
urlpattern 내부에 정의해주면 된다.
기존 코드에
from articles import views 이것과 path("index/", views.index), 를 추가해준다.
# my_first_pjt/my_first_pjt/urls.py from django.contrib import admin from django.urls import path from articles import views urlpatterns = [ path("admin/", admin.site.urls), path("index/", views.index), ]
View
views.py
그 다음, url에서 보내진 요청을 처리하는 index 함수를 view 안에 작성한다.
articles 폴더의 views.py 파일을 열어서 작성해주면 된다.
from django.http import HttpResponse def index(request): response = HttpResponse("<h1>Hello, Django!</h1>") return response
자, 저장하고 다시 서버 실행시켜보자
python manage.py runserver내 로켓 어디갔어.. 🫨
아, 우리가 정의한 경로가 index/ 였으니까, http://127.0.0.1:8000/index/ 으로 입력해서 다시 들어가보면
잘 나오는 걸 볼 수 있다!
무슨 일이 있어난 걸까? 🤔
Chrome → HttpRequest → urls.py → views.py → HttpResponse → Chrome
이 흐름을 거쳐 동작해서 “Hello, Django!”을 볼 수 있게 된 것이다.
Django Template
그럼 본격적으로, HTML파일을 작성하고 뷰로 사용해보자.
자, 일단 아까 views.py 에 작성했던 코드는 다 지우고, 앞으로 사용할 방식대로 다시 입력
# my_first_pjt/articles/views.py from django.shortcuts import render def index(request): return render(request, "index.html")
자, 이제 articles 폴더 안에 templates 폴더 하나 만들어준다. templates → 오타없이 만들어야 한다.
자, 그 다음, templates 폴더 안에 내가 만들어줄 템플릿 이름 index.html 을 만들어준다.
그리고 코드를 작성해주면 된다. html 코드.. 직접 작성해도 되지만.. ! + tab 하면 자동완성 된다.
<body> 태그 안에 아까 만들었던 Hello, Django! 입력한다.
터미널에서 ctrl + c 로 종료한 다음 다시 서버 연결해보면 잘 나옴!
아까랑 똑같아서 제대로 되는지 잘 모르겠으면 <h1>태그 안의 문구를 바꿔서 해봐도 됨.
Hello, my first Django! 로 바꿈
잘 나온다.
[우재튜터님 예제]
만약, users/ 라는 경로로 들어오면 users.html 을 렌더링해서 보여주는 로직을 작성해보자.
음..
일단, urls.py 열어서 path("users/", view.users), 추가하고
urlpatterns = [ path('admin/', admin.site.urls), path("index/", views.index), path("users/", views.users), ]
그리고 views.py 열어서 users(request) 함수 작성한다.
def users(request): return render(request, "users.html")
그리고,
templates 폴더 안에 uesrs.html 파일 만들고 내용을 작성한다. 난 그냥 body 태그 안에 h1 태그 안에 Good night! 을 입력했다.
<body> <h1>Good night!</h1> </body>
과연 맞을까..? 🤔
runserver 해서 열어보면 잘 나오긴 하는데..
다시 강의 플레이..
우왕 맞음ㅎㅎ 행복🫢
다행히 맥북이 새로 오고 나서는 파이참을 썼고 vscod는 얼마 전에 새로 깔아서 그런지 자동완성 기능이 없다. 비활성화 되어있는건지..
튜터님이 걱정하실 일은 없겠다.
'Django' 카테고리의 다른 글
Django Model, Migration, ORM, Database API (0) 2024.08.16 Django HTTP Form (0) 2024.08.14 Django Template System (DTL 문법, 템플릿 상속) (0) 2024.08.13 django 프로젝트 생성, 서버 연결, App 생성 & 등록 (0) 2024.08.10 Django 장고 설치, 가상환경, 프로젝트 생성 (1) 2024.08.09