pythonanywhere에 접속하여 Files 페이지로 이동한다. 그리고 web/web 디렉토리로 이동한다. 만약 사용자명이 anpigon이고 프로젝트명이 web이면 전체 디렉토리 경로는 /home/anpigon/web/web/ 가 된다. 디렉토리를 정확하게 잘 찾아들어갔다면 아래와 같은 화면을 볼 수 있다.
urls.py 파일을 클릭하여 편집화면으로 이동한다. 그리고 코드 내용을 아래와 같이 수정한다.
1 2 3 4 5
from django.urls import path, include
urlpatterns = [ path('', include('blog.urls')) ]
여기서 path('', include('blog.urls')) 코드는 URL로 접속하는 모든 요청을 blog.urls 에서 처리하겠다는 의미이다.
실제 편집화면의 스크린 캡처을 바로 아래에 넣었다.
편집화면 상단에 있는 새로고침 버튼 을 클릭하면 수정된 내용이 서버에 바로 반영된다.
Save 버튼을 클릭하여 저장한다. 그리고 새로고침 버튼을 클릭해보자. 그리고 블로그 주소(예: anpigon.pythonanywhere.com)로 접속하면 아래와 같은 화면을 볼 수 있다.
이렇게 화면에 오류 내용이 보이는 것이 정상이다. 왜냐하면 아직 blog를 구현하지 않았기 때문이다.
이제 본격 블로그를 개발해보자.
블로그 글 목록 URL 생성하기
방금 수정한 urls.py 파일이 있는 디렉토리에서 상위 디렉토리로 이동한다. 그리고 blog 디렉토리를 생성한다. blog가 생성된 전체 경로는 /home/anpigon/web/blog 이다. 아래 화면을 참고하여 생성된 디렉토리 경로를 확인하자.
blog/ 디렉토리에 들어가서 urls.py 파일을 신규 생성한다.
생성된 blog/urls.py 파일을 클릭하여 편집화면으로 이동한다. 편집창에 아래 코드를 입력하고 저장한다.
1 2 3 4 5 6
from django.urls import re_path from . import views
re_path('^$', views.post_list, name='post_list') 코드를 설명하면 ^$ URL에 글 목록을 보여줄 뷰(View) views.post_list를 맵핑하였다. 여기서 정규식 ^$은 아무 문자열이 없을 경우라는 의미이다. 아직은 정규식에 대해서 공부할 필요가 없다. 마지막으로 name='post_list'은 URL을 식별하기 위해 붙인 이름이다.
이 부분이 잘 이해가 안 되면 그냥 넘어가도 된다. 시간이 지난 뒤에 나중에 다시 보면 이해가 될 것이다.
블로그 글 목록 View 생성하기
여기서부터는 난이도가 조금 올라간다. 하지만 걱정할 필요가 없다. 천천히 따라하면 쉽게 할 수 있다. 참고로 이 글에서는 steemit에서 제공하는 파이썬 sdk를 사용하지 않았다.
방금 blog/urls.py 파일을 생성한 디렉토리에서 views.py 파일을 신규 생성한다. 그리고 views.py 파일을 클릭하여 편집화면으로 이동한다. 그리고 아래 설명서를 보면서 코드를 천천히 입력해보자. 코드 양을 보고 겁낼 필요가 없다.
우선 글 목록 뷰에 필요한 파이썬 모듈들을 임포트(import) 한다.
1 2 3 4 5
from django.shortcuts import render # 장고 View 렌더러 모듈 from datetime import datetime # 날짜시간 모듈 import markdown # 마크다운 HTML 변환 모듈 import requests # 서버 API 요청 모듈 import json # json 파싱 모듈
해당 모듈에 대한 설명은 간략하게 주석(#)을 달아놓았다.
마크다운 문서를 HTML로 변환하기 위한 모듈인 Markdown객체를 생성하여 md 변수에 담는다. 나는 마크다운 문서가 HTML로 잘 변환되길 바라면서 확장 기능 두개를 같이 포함하여 Markdown객체를 생성하였다.
여기서 사용한 Markdown의 확장 기능을 설명하면, 'markdown.extensions.extra'는 마크다운의 확장 문법을 파싱하는데 도움을 준다. 그리고 'markdown.extensions.codehilite' 는 Syntax highlighting를 적용하는데 매우 유용하다. Syntax highlighting가 궁금하신 분은 https://highlightjs.org를 방문해보면 무슨 뜻인지 이해될 것이다.
다음 라인에는 parse_time 함수를 구현한다. parse_time 함수는 날짜 텍스트를 파싱하는데 사용할 것이다. 참고로 파이썬에서 **def**로 시작하면 무조건 함수라고 보면 된다.
# 스팀잇 글 목록 가져오기 defpost_list(request, limit=20): # 스팀잇 API 요청하여 글을 가져온다. data = '''｛ "jsonrpc": "2.0", "method": "follow_api.get_blog", "params": ｛"account": "％s", "start_entry_id": ％i, "limit": ％i｝, "id": 1 ｝''' ％ (USERNAME, 0, limit) response = requests.post(URL, data=data)
# 스팀잇 글 목록을 담을 변수 posts = [] # 응답이 성공이라면 다음 로직을 진행한다. if response.status_code == 200: # JSON 텍스트를 파싱한다. data = json.loads(response.text) # 파싱한 JSON 데이터에서 blog 정보를 꺼내온다. blogs = data['result']['blog'] # 반복문을 돌면서 필요한 정보를 받아오자. for blog in blogs: blog = blog['comment']
# 마크다운을 HTML로 변환 html = md.convert(blog['body']) post = ｛ 'title': blog['title'], # 제목 'author': blog['author'], # 작성자 'permlink': blog['permlink'], # 고유식별ID 'created': parse_time(blog['created']), # 작성일 'body': html[:200], # 본문내용 200글자로 자르기 ｝ posts.append(post) # 템플릿에 데이터 전달 return render(request, 'blog/post_list.html', ｛'posts': posts｝)
위 코드 내용을 설명하면 post_list 함수는 스팀잇 API 서버에서 게시글을 가져와 화면에 출력한다. 한 번에 가져와서 보여줄 글 수는 limit=20으로 설정했다. md.convert() 함수는 마크다운으로 작성된 텍스트를 HTML로 변환해준다. 그리고 목록 페이지에는 본문의 전체 내용이 필요 없기 때문에 html[:200]를 사용하여 본문 내용을 200 글자로 잘랐다. 마지막으로 작성일은 앞에서 구현한 parse_time 함수를 이용하여 날짜로 변환하였다. 참고로 위 코드 내용을 이해하지 못해서 괜찮다.
디자인 템플릿 적용하기
디자인 템플릿 파일을 사용하기 위해서는 템플릿 파일 경로를 설정해야 한다. web/web/settings.py 파일을 찾아서 편집한다. 57번 라인의 DIRS에 os.path.join(BASE_DIR, 'templates')를 추가한다. 아래 화면을 참고하자.
이렇게 설정하면 이제 템플릿 파일이 위치한 경로는 /home/anpigon/web/templates가 된다.
web/ 디렉토리에 templates/blog 디렉토리를 생성한다. templates/blog 디렉토리에 디자인 템플릿 html 파일을 생성할 것이다.
## 기본 템플릿 html 생성
기본 템플릿은 모든 페이지에 확장되어 사용되는 템플릿이다. 앞으로 구현할 글 목록 페이지와 글 상세 페이지는 기본 템플릿을 베이스로 사용한다.
web/templates/blog 디렉토리에 base.html 파일을 생성한다. 그리고 base.html 파일에 아래 내용을 복사&붙여넣기 한다. 아래 코드는 Clean Blog 템플릿 파일을 장고에서 사용할 수 있게 수정하였다.
위 내용 중에서 중간쯤을 살펴보면 ｛％ block content ％｝ ｛％ endblock ％｝ 코드가 있다. 이 ｛％ block ％｝ 영역은 base.html을 확장하여 다른 템플릿에 사용할 수 있게 구멍을 뚫어 놓은 거라고 보면 된다. 참고로 ｛％ ％｝은 장고에서 사용할 수 있는 템플릿 태그라고 한다.
## 블로그 글 목록 템플릿 html 생성
이제 실제로 글 목록을 보여줄 템플릿 html를 만들자. 템플릿 디렉토리 templates/blog에 post_list.html 파일을 신규 생성한다. 그리고 post_list.html 파일에 아래 내용을 복사&붙여넣기 한다.
위 코드에서 ｛％ extends 'blog/base.html' ％｝ 는 blog/base.html 템플릿을 확장해서 사용하겠다는 선언이다. 그리고 ｛％ block content ％｝와 ｛％ endblock ％｝ 사이에 있는 코드 내용이 위에서 설명한 기본 템플릿에 뚫어놓은 구멍인 ｛％ block content ％｝ ｛％ endblock ％｝ 영역에 들어갈 것이다.
그리고 ｛｛ post.body|striptags|truncatechars:50 ｝｝코드에서 사용한 striptags 필터는 HTML태그를 제거해준다. 그리고 truncatechars 필터는 문자열을 원하는 길이(50)로 잘라낸 다음 끝에 … 을 붙여준다.
을 클릭하면 수정된 내용이 서버에 바로 반영된다.
