megumitorii.tk

このウェブサイト

megumitorii.tk

  • 開発環境: Gatsby + Netlify CMS
  • 期間 2018.10 -

解説

React.js製の静的サイトを作れるライブラリGatsby.js(速いことで有名)製のウェブサイトを、Netlifyに設置。

Netlify CMSを使用しているので、ブログやWordpressみたいにブラウザ上からエントリーを足していける。

このサイトを見に来る人は私のことを知りたくて来ているのであって、クールなJavascriptテクニックを見に来ているわけではないだろうから、デザインはシンプルに。インターネット育ちらしく100の質問も設置。

デザインは写真集っぽい余白をがっつり使った形に。アクセントの青は個人的に大好きな色の電気青 #00f です。

Adobe XDで簡単にデザインを作った後、Reactでコンポーネントをゴリゴリ書いた。その後、ブラウザ上でウィンドウサイズを変えたときの動きを見ながら細かく修正していきました。