はじめに

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記事通知が格段に見やすくなりました！

今後も改善点があれば、さらに調整していきます。