テーマ開発において困ること

Movable Type （一般的なCMSも）のテーマ開発において、困ることは管理画面を工程に組み込まないといけないという問題です。

また、HTMLやCSSの技術をどのように担保するのか？の答えとして私の中では AstroJS が第一候補として上がってきたのは嬉しいことでした。

それでも、MTテンプレートを組みながらCSSを書き換えるのはたいへん

これを

1. SCSSやらなんやらの技術を集結してタスクランナー（AstroJSがよきかな？）を作って、結果、静的HTMLを作成する
2. MTテンプレートに落とし込む
3. Movable Type でテーマ設定する
4. 再構築する
5. 確認する
6. css を調整したくなって、タスクランナーを起動して、静的HTMLを作り直す
7. MTテンプレートに落とし込む
8. Movable Type でテーマ設定する
9. 再構築する
10. 確認する

問題があれば 6〜10 を繰り返す

こうしたい

1. SCSSやらなんやらの技術を集結してタスクランナー（Storybook だといいんじゃ？）を作って、結果、静的HTMLを作成する
2. MTテンプレートに落とし込む
3. Storybook で MTテンプレート をHTMLのテンプレートとして呼び出し、ごにょごにょ（技術的な事なので割愛する）する
4. Storybook で（いつでも）確認する
5. SCSSを調整したくなって書き換える
6. Storybook で（いつでも）確認する

で、Storybook で作ってみました

PoC-storybook-movabletype

説明

プレビューした感じ

• ブロックタグが水色
• ファンクションタグが緑色
• その他が赤

とりあえず、MTテンプレートとCSSでなんとなくの見た目を変更できるようにはなったかな。と思います。

技術

• node.js
• Storybook
• テンプレート（MTテンプレート）
• Java Sctript
• SCSS（CSS）

所感

作っていくうちに、閃いた????DataAPI で記事を引っ張ったりしたらもっと見栄えが良くなるんじゃね？的な事を考えたけど、

結論、Movable Type の管理画面で、VScode のようにコードを書けて git にコミットできちゃったりなんかしゃったりしたらいいんじゃないか？と辿り着いたので、これ以上は機能を実装しないかもです。