블로그 메인 컨텐츠 구성
- 메인 컨텐츠 기능은 크게 3가지로 구성할 것입니다.
- 먼저, 블로그의 가장 기본이 되는 기능은 [글쓰기]일 것입니다.
- 또한 아무나 글을 쓰면 안되기 때문에 권한 확인을 위해 [로그인]과 [로그아웃] 기능을 넣을 것입니다.
- 이에 맞게 페이지 링크 이름을 변경하여 봅시다.
index.html 수정
- 수정하기 전에 블로그에 들어올 때마다 주소에 계속 [http://127.0.0.1:8000/blogMain/]을 쳐서 들어오는 것은 번거롭기 때문에 이것을 먼저 건드려봅시다.
- 저는 가운데 [Learn more] 버튼을 누르면 메인 화면으로 넘어가도록 구성하겠습니다.
- [index.html] 문서를 열고 다음과 같이 수정합니다.
1 | <a href="{% url 'blogMain' %}" class="btn btn-lg btn-secondary">Learn more</a> |
- 장고 템플릿 url은 이와 같이 사용합니다.
이렇게하면 링크가 걸립니다.
1 | {% url 'urls.py에서 지정한 이름' %} |
- 제대로 작동하는지 테스트해봅시다.
1 2 | [Shift]+[F9]를 눌러 디버그 모드를 실행합니다.버튼을 누르면 [blogMain]화면으로 넘어가면 성공입니다. |
blogMain.html 수정
- 위에서 장고 템플릿 url을 사용하여 링크를 건 방식과 같이 [blogMain.html]도 수정하면 됩니다.
- 저는 다음과 같이 [navbar]를 수정할 것입니다.
- 1. [Fixed navbar]를 누르면 블로그 홈 화면으로 이동
- 2. [Home]을 누르면 블로그 메인 화면으로 이동
- 3. [글쓰기] navbar 추가
- 4. [로그인], [로그아웃] navbar 추가
- 저는 다음과 같이 수정하였습니다.
- Fixed navbar - url 수정
1 | <a class="navbar-brand" href="{% url 'index' %}">Fixed navbar</a> |
- Home - url 수정
1 | <a class="nav-link" href="{% url 'blogMain' %}">Home <span class="sr-only">(current)</span></a> |
- 글쓰기, 로그인, 로그아웃 - navbar 추가
1 2 3 4 5 6 7 8 9 | <li class="nav-item"> <a class="nav-link" href="#">글쓰기</a></li><li class="nav-item"> <a class="nav-link" href="#">로그인</a></li><li class="nav-item"> <a class="nav-link" href="#">로그아웃</a></li> |
- 글쓰기, 로그인, 로그아웃의 url은 후에 기능 구현 후에 지정해주도록 하겠습니다.
- 정상적으로 작동되는지 확인합니다.
