個人ブログを開発しました

「開発」という単語がふさわしいのか不明です。

• 開発
• 作成
• 制作

開発というと大げさな気がします。作成というと軽い気がする。 制作は工作とか美術っぽい。

CMS 使わずにフルスクラッチなので開発でいいでしょう。

stin's blog を支える技術

「〇〇を支える技術」っていう言い回しを使ってみたかっただけです。

• TypeScript

  必須ですね。 2021 年にもなって生の JavaScript を書く人なんて居ません(過激派)。

• React

  Next.js の習作なのでもちろん入っています。

• Next.js

  メインフレームワークです。React で SSG(Static Site Generation)させるのめっちゃ簡単にしてくれるやつ。

• Vercel

  デプロイ先です。

開発中の雑記は Zenn.dev のスクラップに書き連ねています。

Next.js の習作として適当に作ってみるかぁと思っていたんですが、やり始めたらちゃんと作りたくなってしまい、 Adobe XD を持ち出してデザインしたり配色を真剣に考えてみたりしました。 おかげで Adobe XD の使い方を完全に理解しました (エンジニアが言うタイプの「完全理解」です)。

デザイン頑張ったけど肝心なマークダウンをレンダリングする記事部分は微妙です。なんとかブラッシュアップしていきたい。

Next.js も完全に理解できました。基本的な使い方はとてもかんたんでとっつきやすい印象でした。 create-react-app で React 書き慣れているならすぐに静的サイトくらいなら作れそうです。 僕はこのブログ作るのに２ヶ月かかりました(ゲームしていました)。

レンダリングテスト

さて、マークダウンのレンダリングやその結果のスタイリングも試行錯誤で自力で行ったので、表示の確認をします。

import React from "react";

export const App: React.VFC = () => {
  return <div>Hello stin's blog!</div>;
};

いい感じです。

終わりに

Qiita と Zenn にもアカウントを持っていて、２つ合わせても月に１度記事を書く程度なので、ちゃんと書いていくのか不安です。

Qiita と Zenn も記事の内容で書き分けていけたらいいかなと思っています。