[Flask] 3-13 마크다운 기능 적용하기

질문이나 답변을 작성할 때 일반적인 텍스트 외에 글자를 진하게 표시하거나

링크를 추가하고 싶을 수도 있다

 '마크다운'이라는 글쓰기 도구를 이용하면

이런 것들을 쉽고 간단하게 표현할 수 있다

마크다운을 적용해 보자

 

리스트

목록을 표시하기 위해 다음처럼 작성한다

위 문자열을 마크다운 해석기가 HTML로 변환하면 실제 화면에서는 아래와 같이 보인다

순서가 있는 목록을 표시하려면 아래처 작성한다

결과는 아래와 같다

 

강조

작성한 글자를 강조 표시하려면 강조할 텍스트 양쪽에 **를 넣어 감싼다

결과는 아래와 같다

 

링크

HTML 링크는 다음처럼 [링크명](링크주소) 규칙을 적용하여 생성한다

결과는 아래 같다

 

소스코드

소스코드는 백쿼트 ` 3개를 연이어 붙여 위아래로 감싸면 생성할 수 있다

결과는 아래 같다

 

인용

인용을 표시하려면 다음처럼 >를 문장 맨 앞에 입력하고 1칸 띄어쓰기를 한 다음 인용구를 입력한다

결과는 아래와 같다

 

마크다운 설치

마크다운 기능을 추가하려면 마크다운 모듈을 설치해야 한다

pip install flask-markdown으로 마크다운을 설치하자

 

마크다운 등록

마크다운을 사용하려면 __init__.py 파일에서 app에 등록해야 한다

 

마크다운 적용

Flask-Markdown이 동작하도록 템플릿을 수정해 보자

질문이 표시되는 HTML 부분만 약간 수정하면 된다

[파일명: projects\myproject\pybo\templates\question\question_detail.html] Copy

기존의 style="white-space: pre-line;"은 삭제하고

{{ question.content|markdown }}과 같이 markdown 필터를 적용했다

 

답변에도 마크다운을 적용해보자

[파일명: projects\myproject\pybo\templates\question\question_detail.html] Copy

 

마크다운 확인

이제 질문 또는 답변을 마크다운 문법으로 작성하면

웹 브라우저에서 어떻게 보이는지 확인해 보자

아래의 내용으로 질문을 작성해 보자

그러면 작성한 내용이 아처럼 보일 것이다

 

정상 동작 확인