posted on October 22nd, 2020

ポートフォリオについて

制作のポリシー

このポートフォリオサイトを作る際に意識したことは、「とりあえずやってみる」ということです。

プログラミングでの挫折の原因は、降りかかる赤いエラーの雨だとよく聞きます。その障壁に立ち向かい、様々な解決策を試してみる。これはまるで、ゲームの途中に出てくる敵を、あの手この手で倒すのに似ています。私はそれがとても面白く感じました。

新しい技術、知識を学ぶことに躊躇せず、進んでみました。

GatsbyJS

Gatsby Icon

GatsbyJS は React ベースの静的サイトジェネレーターです。

もともと React にすごい興味があったので、Progate を終えてすぐに React の学習をしています。

GatsbyJS を知ったのは、静的サイトジェネレーター(SSG)の一覧表を見ていた時です。 ドキュメントの充実さ、コミュニティの大きさ(特に海外勢)が印象的でした。また、GraphQL が標準搭載されており、ブログ作成、管理が容易ということもあり、GatsbyJS を選びました。

Tailwind によるスタイリング

最初は styled-component や Emotion を使ってスタイリングしていました。後に Tailwind を知り(CSS フレームワークというものを知り)、一度 Tailwind を使って スタイリングしてみたところ、こちらを採用しました。Tailwind の書き方や機能などを実際に書いて使ってみたかったからです。

CSS の自由が効かない分、やはり素早くスタイリングできました。レスポンシブも簡単に設定、適応できるので便利です。

スタイリングに特にこだわりはないけど、かっこよくしたいというときに使えるなと感じました。

Netlify で自動ホスティング

Netlify Icon

Netlify では github と連帯できるので、git にプッシュするだけで自動的に Netlify を介して配信されます。 通常利用では無料、初期設定も簡単なので Netlify にしました。

更新作業がそんなにないブログとかだと、これで十分かなと思います。

あとは、Gatsby 自体のビルドが重いので、それも少し改善されると良いなと思います。

GitHubのレポジトリ

リポジトリはこちら

制作したサイトのソースは GitHub に公開してあります。

このポートフォリオサイトは、これからもっと良くなるように改善していく予定です。

    ©2021 Near Closer