ブログを作ってみた

こんにちは。

友人がインターンシップの課題で、Deno DeployとWebsocketでしりとりゲームを作成していました。

↑こういうの

Denoは私が参加した過去のチーム開発でも使われていたが、実際に使ったことはなかったため、自分も何か作ってみたいと思いました。

（そういえば自分のサイトって今はポートフォリオしかないな）と思ったため、自分のサイトをDenoで作ってみることにします。

ということでできたのがこのブログです。

Denoのチュートリアルを見たりGeminiに助言をもらいながら何とか作成……

typescriptは初めて書いたけど、意外とできるもんですね。

ブログの裏側を少しだけ紹介

せっかくなので、このブログがどうやって動いているのか、その裏側を少しだけ紹介します。同じようにDenoで何か作ってみたいと思っている人の参考になれば嬉しいです。

記事の表示の仕組み

このブログの心臓部は、Denoの標準ライブラリといくつかの外部モジュールでできています。全体の流れはこんな感じです。

Markdownファイルの記事を準備する。
アクセスがあるたびに、Denoがそのファイルを読み込む。
読み込んだMarkdownをHTMLに変換する。
HTMLをWebページとして表示する。

……MarkdownをHTMLに変換する……？？
そういう処理は、これで嫌と言うほどやったけど、アレはPyQtだし、そんな都合のいいモジュールがあるわけ……

あった

import { render } from "https://deno.land/x/gfm/mod.ts";

// Markdownの文字列を読み込む
const markdownText = await Deno.readTextFile("./articles/my-first-post.md");

// HTMLに変換
const html = render(markdownText);

// ... これをレスポンスとして返す

gfm というモジュールが、GitHub Flavored Markdownをいい感じにHTMLにしてくれるようです。
おかげで、自分は記事の内容に集中できます。これがデカい

Deno Deployで公開

そして、このブログは Deno Deploy というサービスを使って公開しています。

GitHubにソースコードをアップロードしておくだけで、自動で世界中に公開（デプロイ）してくれる便利ちゃんです。
自分でサーバーを契約したり、難しい設定をしたりする必要は一切ありません。素敵。

これからやってみたいこと

まだ作ったばかりのブログですが、いくつかやりたいことはありますね

デザインの改善: 今はまだ最低限の見た目なので、もう少しおしゃれにしたい。
記事一覧の自動生成: トップページに、自動で記事の一覧が表示されるようにしたい。
全文検索機能: 記事が増えてきたときのために、検索機能もつけたい。
タグ付け: 記事にタグを付けてカテゴライズしたい
訪問者カウンタ: サイトを見に来た人をカウントするあれ。DenoにはDeno KVというデータベースがあるらしいのですぐ実装できそう……？

やりたいことは尽きませんが、DenoとTypeScriptの学習も兼ねて、少しずつ育てていこうと思います。

まとめ

思いつきで始めたブログ制作でしたが、楽しく作ることができました。
今後ともよろしくお願いします〜。