ポートフォリオサイトのスクリーンショット1

ポートフォリオサイト

作成日: 2025年7月4日

更新日: 2024年7月16日

使用技術

Next.js
React
TypeScript
Tailwind CSS
Vercel

概要

このサイトは、自身のプロジェクトをまとめるために制作しました。

機能

プロジェクトページ、イラストページ、ブログ、連絡先をのせています。

苦労

  1. vercelでNext.jsのフレームワークを選択するのを忘れていた!
  2. GitHub上のフォルダの大文字、小文字の間違いはローカルで正しかったとしてもpushで変更されないため、気づかないことが多かった。
  3. markdownの見出しなどの記法が適用されない問題に苦戦した。tailwindcssのプラグイン"typography"1の導入がうまくいっていなかったのが原因で、GitHubページのReadmeをちゃんと読むことを学んだ。

学んだこと

  • クリーンアーキテクチャの学習のため、domain層、useCase層、infrastructure層、presentation層に分けて制作した。小規模プロジェクトのため、圧倒的メリットを感じたわけではなかったが、設計の基礎を学べた。
  • Git LFSを導入し、サイズが大きいファイルの扱い方を学んだ。
  • SSRとSSGの違いを理解。今回はまだページが少ないので静的生成で落ち着いた。
  • Git Rebaseを初めてやってみた。コミット履歴が繋がってなかったからrebaseで履歴ごと改ざんした、というイメージでやったけど違うかもしれない。
  • Geminiは最新の情報を知らないので、エラーを吐いたらとりあえず使用しているものの最新の使い方を調べておくといい。

今後

  • キャラを歩かせてみたい

注釈

  1. https://github.com/tailwindlabs/tailwindcss-typography