初めに

初めまして.くおんるりなのです.
初投稿となるこの記事では,このブログでの目標であったり,このブログを動かす技術について書いていこうと思う.
実はあまり書くことが無いのだが,何も記事がないとレイアウトが壊れてしまう欠陥ブログなので,急いで書いているらしい...

このブログの目的

さて,このブログではサイバーセキュリティの,特に技術者に向けた情報を発信していきたい.つまり,既にセキュリティの知識を持った方々への情報提供を目指すということだ.一般の方々へのセキュリティ意識の啓発も大切だと思っているので,それはまた別の方法で達成してみたいものである.
さて,技術者に向けた記事ということで,できるだけ自ら調査/研究した情報を書けると嬉しい.執筆時点で具体的な案がある訳ではないので,ゆっくりと見つけたい.

ブログの技術

ここからはこのブログ制作の技術について書いていこう.
なお,このブログのソースコードは公開していない.(一般的なブログと同じような機能しかなく,わざわざ読みたい人がいるとは思えないので...)

全体について

フロントエンドにはNext.jsを利用している.特段これを選んだ理由はなく,Web技術を何も知らなかった頃から名前を聞いたことがあったので選んだ.
ちなみにこのブログを制作するまで,HTMLすらほぼ書いたことが無かったらしい...

ダークモードの実装には,next-themesを利用した.初めは自力で実装していたのだが,これを利用するとcssにライト/ダークそれぞれの色を書くだけで良く,本質的な部分に集中できて良きだった.

目次にはTocbotを利用した.これももともと自前実装しようとしていたのだが,開いているセクションのハイライト/ヘッダの深さによるインデントなど欲かった機能が全部乗っていて,すばらしいライブラリだ.

Open Graph用の画像の自動生成も実装した.あらかじめテンプレートHTMLを作っておいて,それに対してタイトルなどの情報を流し込み,それをPuppeteerを利用してスクリーンショットを撮っている.APIを利用するのではなく,ビルド時に書き出し,保存している. 実は,この記事を書く時間が無くなった原因はPuppeteerだったりする.Vercel上だと,ビルド前にcd ./node_modules/puppeteer && npm installをしないと動かないのだ.

記事について

ブログはMarkdownで書くことができる.これにはreact-markdownを利用した.またMarkdownにはシンタックスハイライト

#include<bits/stdc++.h>

int main() {
    int n;
    cin >> n;
}

があったり,KaTex

が使えたり,

• GitHub Flavored Markdown

が利用できたりする.

終わりに

初投稿であるのに執筆に時間が取れず,やっつけ仕事になったしまった...
コンスタントに記事を投稿できるように頑張っていきたい.