Tag: gatsby

GatsbyでHello, worldからサイトを作ってみる(4) データの条件付き取得と詳細ページの作成

2019.6.8 12:00#gatsby

概要一覧ページは一つあれば良かったので一覧ページを修正したが、詳細はそもそもポートフォリオの数だけページが必要になるため、ページからして自動で生成する必要が出てくる。そこで、今回はページが自動生成されるようにする方法を紹介したい。Gatsby Node APIを使うGatsbyでは、ページを作成す…

GatsbyでHello, worldからサイトを作ってみる(3) データの取得と一覧ページの作成

2019.6.1 12:00#gatsby

概要ポートフォリオの一覧ページを、ポートフォリオが増えるごとにいちいち手直ししていては、とても大変である。なので、一箇所でデータを定義したら、それに沿っていろんなページが自動的に構成されるようにできれば便利である。そこで、今回はその第一歩として一覧ページが自動的に構成されるようにしたい。必要なプラ…

GatsbyでHello, worldからサイトを作ってみる(2) レイアウトの作成

2019.5.25 12:00#gatsby

概要サイトのページにおいては、例えば「見た目の統一感を出すために各ページで同じレイアウトにする」といったように、どのページでも同じ部分、つまり共通部分というものが出てくる。なにも考えずにページをコピペし続けていると、共通部分がいろいろなページに書かれてしまい、いざレイアウトの変更をしようとしても気…

GatsbyでHello, worldからサイトを作ってみる

2019.5.18 12:00#gatsby

概要Gatsbyは、ホームページ・ビルダーやDreamweaverと同じく、ユーザが作成したコンテンツを組み合わせパブリッシュを行うことで、最終的にHTMLやJS、CSSのWebサイト用データを出力する、静的サイトジェネレータというソフトウェアである。出来上がったファイルはFTPサイトなりGith…