M2N - Hugo/MarkdownブログをNAVERブログに簡単変換

背景

Hugoで技術ブログを運営している中で、NAVERブログにもコンテンツを共有したいと考えました。
既存のMarkdown to HTML変換ツールも試してみましたが、NAVERブログの特殊なエディタ環境ではうまく動作しませんでした。

コードブロックが崩れたり
画像レイアウトが乱れたり
不要なスタイルが挿入されたり

結局、NAVERブログに最適化された変換ツールが必要になり、自分で作りました。

主な機能

NAVERブログ最適化: NAVERエディタに貼り付けるだけですぐ使えるHTMLを生成
Hugo/Jekyll Markdown対応: Front Matterを自動削除し、コードブロックを正確に変換
コードシンタックスハイライト: highlight.jsベースの見やすいコードブロックレンダリング
高速変換: クライアントサイドで即時処理
シンプルなUI: 複雑な設定なしでテキスト貼り付け → 変換 → コピー

技術スタック

フロントエンド

React 18.3.1 + TypeScript 5.6.2
Vite 6.0.5

スタイリング

Tailwind CSS 3.4.17
PostCSS + Autoprefixer

Markdown処理

marked 16.3.0（パース）
DOMPurify 3.2.7（HTMLサニタイズ）
highlight.js 11.11.1（コードシンタックスハイライト）

デプロイ

Cloudflare Pages

サイト: https://m2n.coderred.com
同じ問題に悩んでいる方の助けになれば幸いです。
お問い合わせ: https://coderred.com または Telegram @coderredlab