はじめに
Qiitaの記事をSlackへ自動投稿するBotを運用している中で、投稿フォーマットが見づらいなーって思うことがしばしばありました。
特に、QiitaのMarkdown記法やHTMLタグがそのまま表示されることがあり、記事の概要が読みにくい状態でした。
そこで、Slackでの見やすさを向上させるために、フォーマットの改善を行いました。本記事では、その実装手順についてまとめます。
関連記事
概要
現在のBotは、QiitaのAPIを利用して特定のタグを持つ最新の記事を取得し、Slackへ通知する仕組みになっています。
しかし、記事の概要部分にQiita特有の記法（Markdown、HTMLタグ、カスタムブロックなど）が含まれており、そのままではSlack上で見づらくなっていました。
そこで、以下の3点を改善しました。
- QiitaのMarkdownやHTMLタグを適切に整形（HTMLタグ削除、Markdownの整形）
- Slackの見やすいフォーマットへ変換（リスト記号変換、余計な改行削除、見出しを角括弧で囲む）
- スレッド機能を活用し、整理された投稿にする
改善手順
1. Qiita APIのレスポンスを確認
Qiita APIで取得できる記事データには、以下のような情報が含まれています。
{
"title": "記事タイトル",
"url": "https://qiita.com/example",
"body": "この記事では〜",
"likes_count": 15,
"user": {
"id": "username",
"profile_image_url": "https://qiita-user-icon.com/icon.png"
}
}
この body フィールドにはMarkdownやHTMLタグが含まれているため、Slackへそのまま投稿すると視認性が悪くなります。
2. QiitaのMarkdownやHTMLタグを整形
処理内容
-
HTMLタグの削除（
<dl>,<dt>など） -
Markdownの整形（
# 見出し → [*見出し*]、- リスト → • リスト） - Qiita特有のカスタムブロック（
:::note warnなど）の削除 - 余計な改行の削除
実装コード
import re
from bs4 import BeautifulSoup
def clean_text(markdown_text):
"""QiitaのMarkdownをSlack用に整形"""
# Qiitaのカスタムブロックのラベル（:::note warn など）を削除し、内容は保持
markdown_text = re.sub(r":::\s*\w+\s*\n", "", markdown_text, flags=re.DOTALL)
markdown_text = re.sub(r":::", "", markdown_text) # 閉じタグの削除
# HTMLタグを除去（BeautifulSoupを使用）
soup = BeautifulSoup(markdown_text, "html.parser")
text = soup.get_text()
# Markdownの余計な記号を削除
text = re.sub(r"^#+\s*(.*)", r"[*\1*]", text, flags=re.MULTILINE) # 見出し（# 1. → 1.）
text = re.sub(r"\*\*(.*?)\*\*", r"*\1*", text) # 強調（**bold** → bold）
text = re.sub(r":メモ:", "", text) # `:メモ:` の削除
text = re.sub(r"^\s*[-*]\s+", "• ", text, flags=re.MULTILINE) # 残ったHTMLタグの削除（<dl>, <dt>など）
# 余計な改行を整理
text = re.sub(r"\n{2,}", "\n", text) # 2つ以上の改行を1つに統一
# 最初の200文字のみ取得
return text[:200]
この関数をQiita APIから取得した body に適用することで、記事概要をSlackで読みやすく整形します。
3. Slackのメッセージフォーマットを改善
改善後のフォーマット
親スレッド
📢 最新のQiita記事まとめ
子スレッド
"text": f"📌 *タイトル : * {title}\n"
f"🔗 *URL : * {url}\n"
f"👍 *LGTM数 : * {likes}\n"
f"📝 *概要 : * \n{description}...\n"
まとめ
本記事では、Slack通知のフォーマットを改善するために下記の3つを行いました。
- QiitaのMarkdownやHTMLを適切に整形する処理を実装
- Slackのメッセージフォーマットを見やすく変更
- スレッド機能を活用し、通知を整理
これにより、SlackでのQiita記事通知が格段に見やすくなりました！
今後も改善点があれば、さらに調整していきます。