これを読んでいる皆さんへ…

このサイト初のブログ投稿ということで、ブログの計画とこのサイトの構築過程について簡単に書いておこうと思いました。

ブログの計画

正直なところ、このブログについては、まだ誰も語っていないようなことを記録しておく以外、特に計画はありません。開発に関することかもしれませんし、あるいは他の誰かに興味を持ってもらえるかもしれないと思う何かについて書くかもしれません。私は(特にオンラインでは)人に説教するのが好きなタイプではありません。

このサイトの作成

ポートフォリオサイトの次のバージョンアップは少し先延ばしにしていましたが、どんなデザインにするかはずっと考えていました。写真だけでなく、プロの作品も展示できるシンプルなサイトです。車輪の再発明をするつもりはなく、ただ自分が作ったものを展示するだけです。

このサイトで使用されているテクノロジーは以下の通りです。

フロントエンド

  • Next.js - ここ数年 Next.js を使い始めており、その機能が気に入っているので、特に説明することはありません。
  • Tailwind CSS - サイトのスタイル設定を迅速に行うのに役立ちました。
  • Google の Material Icons - 優れたオープンソースアイコンのコレクションです。
  • Leaflet - サイトに表示したい地図をレンダリングします。
  • SASS - 仕事で SASS を使うことに慣れているので、Tailwind に完全に依存したくありません。
  • Luxon - タイムゾーンや日付変換に伴う面倒な作業を回避します。
  • Lenis - スムーズなスクロールを実現します。

API

  • Flickr の API - Flickr の API は、画像の取得だけでなく、より多くのオプションを提供します。メタデータの読み取りに追加のライブラリは必要ありません。既にクエリ可能です。
  • Notion の API - Notion の API は、カスタムフィールドを備えたシンプルなブログや個人ウェブサイトを作成できるほど強力です。このサイトで使用した後、再び使用するようになりました。
  • Open WeatherのAPI - 現在地の天気を表示するために使用しています。
  • Map TilerのAPI - いくつかのマップタイルプロバイダーを比較した結果、マップのテーマと言語をカスタマイズしたい場合はMap Tilerが最適だと判断しました。OpenStreetMapも使いたいのですが、選択肢が少なすぎます。

バックエンド

  • Next.js - Next.jsはSSRとSSGを使用し、ミドルウェアルーティングなどのサーバー機能も備えているため、ここに追加します。
  • Next-Intl - i18nにはNext-Intlを使用しています。ページ要素を翻訳するための非常にシンプルな方法を提供しています。
  • Notionのデータベース - プロジェクト用とブログ用に2つのNotionデータベースを設定しています。これにより、コードを変更せずに簡単に投稿を更新できます。
  • NodeMailer - 連絡先メッセージを自分のメールアドレスに送信するために使用しています。
  • Flickr - 現在、写真はFlickrでホスティングしています。FlickrのAPIには便利なエンドポイントがたくさんあり、無料版のストレージ容量も十分すぎるほどです。AWS S3などでホスティングすることも考えましたが、そうすると複雑さが増してしまい、まだ検討したくありません。
  • Vercel - このサイトはVercelでホスティングしています。商用サイトや高トラフィックのウェブサイトでない限り、ホスティングを複雑にする必要はありません。

リポジトリはここから見ることができます: https://github.com/alextenczar/alextenczar.com-Three

ご質問がありましたら、お気軽にメッセージをお送りください。良い一日をお過ごしください。✌️

IMG_2670.webp