Skip to content

Latest commit

 

History

History
31 lines (22 loc) · 3.44 KB

1-07-HTML시작하기.md

File metadata and controls

31 lines (22 loc) · 3.44 KB

1-7. HTML 시작하기

뷰에서 템플릿에 대해서 잠깐 이야기가 나왔는데, 템플릿은 뭘까?
장고 걸스 튜토리얼은 복잡한 말을 좋아하는 것 같다. 거기서 뜻을 가져오면, 서로 다른 정보를 일정한 형태로 표시하기 위해 재사용 가능한 파일 이라고 한다.
잘 안 와닿을텐데 풀어보면, 우리가 웹페이지를 만들때의 웹페이지 템플릿은, 서로 다른 복잡한 정보들을 일정한 레이아웃(디자인)의 웹페이지로 표시하기 위한 파일 이라고 할 수 있겠다.

장고에서 사용하는 템플릿은 다른 이름없이 그냥 장고 템플릿이라고 한다.
그리고 장고의 템플릿 양식은 HTML을 사용한다.

HTML

웹브라우저가 해석할 수 있는 웹문서, 이걸 브라우저가 읽어서 웹페이지로 사용자에게 표시하는 것이다.
사실 이에 대해서는 이미 공부하면서 정리해둔 것이 있기에, HTML에 대한 자세한 문법은 이 링크를 참고하자.

템플릿

템플릿도 마찬가지로, (view도 view파일을 만들어, 거기에 view를 정의하듯이) 템플릿 파일을 만들어서 그 파일안에 템플릿에 대한 모든 내용을 저장한다.
이때의 템플릿 파일은, (애플리케이션명)/templates/(애플리케이션명)/ 폴더안에 저장하게 된다.
(템플릿 파일을 (애플리케이션명)/templates/ 안에 넣지 않고, templates/폴더 밖에 템플릿 파일을 넣거나 하면 장고의 룰을 어기게 된다. (이 이유는 장고의 템플릿 로더와 관련돼있다.) 그래서 반드시 템플릿 파일은 이 위치 안에 있어야 된다. 추가로 templates폴더이름에 철자가 틀리면 안됀다.)
(왜 templates에 똑같은 애플리케이션명으로 폴더를 하나 더 만들어서 그 안에 템플릿 파일을 넣는지 의문이지만, 나중에 폴더구조가 복잡해질때 쉽게 찾을 수 있게 사용하는 관습적인 방법이라 한다.)

이제 (애플리케이션명)/templates/(애플리케이션명)/안에 템플릿 파일로, 뷰에서 렌더링 했던 html소스 파일인, post_list.html 파일을 만들어 준다. (이 html 파일안에, 간단한 html코드나 못해도 텍스트만이라도 입력해주자.)
참고로 서버가 돌아가고 있는 중에 이렇게 파일을 만들어주면, 장고서버는 이 폴더와 파일의 존재를 알 수 없다. 그래서 서버를 재시작 해줘야 템플릿 파일을 정상적으로 불러온다.
(대신에 한번 불러온 html파일에서, 그 파일을 수정하고 저장해주면, 장고서버도 실시간으로 이해해서 웹페이지를 새로고침하면 수정한 파일이 반영된다.)


이렇게 html파일을 만들고, 장고서버를 돌렸을때, 만든 html소스로 웹페이지가 표시되는 것을 성공시켰다면, 추가로 html의 태그를 활용해서 다양한 요소가 들어간 웹페이지를 만들어보도록 하자.
그리고 html파일의 기본구조도 지켜주어서 제대로된 html파일을 짜보도록 해보면 좋겠다. 아까 그 html문법 정리한 링크