Django - Category 모델을 위한 view 와 template 만들기

Django - Category 모델을 위한 view 와 template 만들기 

 

이전 포스트에서 Category 와 Product 에 대한 모델을 만들어봤습니다. 이번 포스트에서는 생성된 category 연동을 위한 view 와 이를 화면에 보여주기 위한 HTML template 을 만들어 보겠습니다. 

 

이른 위한 준비과정으로 shop app 폴더 아래에 templetes > shop 폴더를 생성해 준다. 

shop app > templates

templates > shop

위에서 생성한 templates 폴더를 프로젝트 settings.py 에 등록해준다. 

 

이제 부터 html template 파일을 작성해 보자. 실제 코드를 작성하기 전에 django 에서 다음과 같은 tags 를 정의 하고 있다. 이 tags 들은 html 내에서 데이터를 컨트롤하거나 프로그램을 위한 용도로 사용된다. 자세한 내용은 실제 코드를 보면서 하나씩 적용해 보겠다. 

 

Django tags

그럼 base.html 코드부터 작성해보자. base.html 에서는 전체적인 구조에 대해서 정의하고 나머지 부분들은 각각의 html 에서 코드로 작성된다. 기본 html 들은 모든 app 에 적용되는 부분이라 templates 폴더 아래에 작성해 주면된다. 

 

다음은 header.html 파일, 

header.html

화면에 필요한 모든 이미지들은 project > static > img 폴더 밑에 미리 복사해주어야 한다. 

 

다음으로 navbar.html 파일, 

navbar.html

 

footer.html

 

html templates 에 대한 부분은 끝이다. 이제 모델의 데이터를 연동하는 category view 를 생성해 보자. 

다음은 shop app 에 대한 urls.py 파일을 생성한다. 

다음은 project 폴더에 있는 urls.py 에 다음과 같이 shop url 을 추가해준다. 

 

 

지금부터 category templates 작성한다. category 는 shop에 관련되 부분이라 templates > shop 폴더에 생성해주면된다.

 

이제 서버를 재구동한다. 

 

 

모든 Product 에 대한 이미지와 가격 정보가 보인다. 

 

Cotton Cushions 에 대한 Product 이미지와 가격 정보만 보임. 

 

이번에는 개별 category 에 대한 링크를 만들어 추가해보자. 새로운 function 생성을 위해서 context_processors.py 파일을 만들고 shop 폴더 아래 저장한다. 여기서 만들 함수는 shop app 에서 사용가능하다. 

 

context_processors.py

다시 shop 에 대한 settings.py 로 가서 context_processors.py 를 등록해준다. 

이제 navbar.html 에 개별 category 링크를 추가해 준다. 

 

   url 정보를 위해서 category 모델에 get_url 함수를 추가해준다. 

서버를 재구동하고 navbar 부분을 확인해 보면 다음과 같이 변경된것을 확인할 수 있다. 

 

한가지 더하자면,  product 이미지를 클릭했을때, 연동되는 link 추가.. 

 

 

끝..  

 

PS 다음은 Product view & html  templates.