見出し画像

Kotlin製の静的サイトジェネレーターKraftを自作してみた

鈴木俊吾（すずしん）@マルチコンテンツクリエイター💻🎮🎤📝

こんにちは、鈴木俊吾（すずしん）です。

先日、私はnote記事で今月の目標について書きました。
その中で、自作ブログの作成を目指していたんですよね。

対象の記事はこちら。
どんな事を書いたのか気になる方はチェックしてみてください。

そこで、今月は黙々とプログラミングに邁進しまして…。
とりあえず、形になるところまでは来ました。

今回は、自作の静的サイトジェネレーターKraftについて簡単に紹介します。
そして、このKraftを使って作成した、実際のブログも見せますよ！


静的サイトジェネレーターKraftとは？

Kraftというのは、今回私が自作したKotlin製の静的サイトジェネレーター。

テンプレートとマークダウンファイルから、HTMLファイルを自動生成。
基本的に、扱うのは静的ファイルのみになるので…。
ブログの表示速度は爆速になります！

「WordPressでブログを運営するほど、高度な機能は要らない！」
「セキュリティ的に安全なブログにしたい！」
「軽量で高速に動作するブログを自作したい！」
「プログラミングスキルの向上をしたい！」

そんな個人的なニーズを満たすべく…。
今回、自分で開発をしてみることにしたのです。

Kraftの基本機能

Kraftでは、以下の機能を実装しています。

  • FreeMarkerのテンプレート（.ftl）とマークダウンファイル（.md）からHTMLファイル（.html）を自動生成。

  • 静的ファイル（images/js/css）をコピー

  • タグ毎の記事一覧ページを自動生成

  • サイトマップ自動生成

  • RSS自動生成

静的サイトジェネレーターとして必要になりそうな基本機能は実装済み。
他にあると良さそうな機能については、後日アップデートで追加していく予定です。

基本的な構想を練った後は、ChatGPTで大まかなコードを出力してもらい、適宜修正を加えるという形で作りました。
AIをフル活用すると、だいぶプログラミング作業が楽になりますね！
もし、1から自分でフルスクラッチだと、もっと作成に時間がかかっていると思います。

Kraftを使ったブログ作成の流れ

Kraftは、あくまでHTMLファイルの自動作成がメイン。
実際にブログを作るためには、テンプレートと必要なファイルを全て自作する必要があります。

今回の私のブログ『スズシンラボ』を作るために、結構な数のファイルを作りましたね…。
意外と手間はかかっています。
とは言え、テンプレートが使えるので、だいぶ制作のコストは下がっていますよ。

ブログ作成の流れとしては以下のようになります。

  1. 必要なテンプレートファイル（.ftl）を作成

  2. 各記事に対応するマークダウンファイル（.md）を作成

  3. ブログの見た目を決めるCSSファイル（.css）を作成

  4. 必要に応じてJavaScriptファイル（.js）を作成

  5. KraftでHTMLファイル（.html）に変換。

私のブログ『スズシンラボ』について

今回作成した私のブログ。
その名も『スズシンラボ』と言います。

古本をイメージしたデザインにしています。
個人的には、結構気に入っていますよ♪
なかなか良い感じでしょう？

このブログでは、私が人生大逆転を目指していく過程をまとめていきます。
様々なことに挑戦しながら、日々成長していきますので…。
ぜひあなたも『スズシンラボ』をチェックしてみてくださいね。

ちなみに、ブログのスピードがどの程度か気になったので…。
PageSpeed Insightsというサイトで計測してみました。
その結果がこちら。

ポストの動画を観てもらえれば分かりますが…。
スマホのパフォーマンスを除けば、他の項目は100点満点！？
予想以上にハイスコアを叩き出しました！
これは頑張って作った甲斐がありますね〜。

Kraftの公開については検討中

今回作成した静的サイトジェネレーターKraftは、あくまで自分用に作成したものです。
基本的には、自分で使うためだけの用途なのですが…。
もし、需要がありそうなら公開も考えています。
使いたいという方がもしいたら、前向きに検討したいですね。

まとめ

今回の記事では、Kotlin製の静的サイトジェネレーターKraftを自作して…。
私のブログ『スズシンラボ』を制作したという話をしてみました。

サクッと作れるとは思ってなかったですが…。
でも、予想以上に制作には時間がかかりましたね。
「あーでもない、こーでもない」と、試行錯誤を繰り返しましたよ。

でも、そのぶん…。
プログラミングスキルは上がったような気がしています。
実際に作ってみて良かったと思っていますよ♪
非常に勉強になりました！

この後は、Kraftの更新もしつつ…。
『スズシンラボ』の記事作成を頑張っていきたいです。
ブログの運営が当初の目的でしたからっ！
だいぶ遠回りしましたが、ここからは飛ばしていきますよ〜。

このnoteはもちろん…。
『スズシンラボ』の方もチェックしてもらえたら嬉しいです。
今後ともよろしくお願いしますね。

▼イチオシのリンク


この記事が参加している募集

#仕事について話そう

115,030件

この記事が気に入ったらサポートをしてみませんか？