GatsbyJSでブログサイトを構築する

まとめ

参照ページを見ながらそのまま作ってみました。

環境構築だけなら参照ページを見ながら進めればよいので簡単でした。

前提

• 開発環境: Windows 10
• IDE: VScode
• Node.jsはインストール済み (v16.14.0)

参照サイト

Javascript、Reactは一通り勉強したものの初心者です。

ここを参照しながら作ってみます。

reffect.co.jp

やってみます

1. gatsbyJSのインストール

$ yarn global add gatsby-cli

yarn global v1.22.17
[1/4] Resolving packages...
[2/4] Fetching packages...
[3/4] Linking dependencies...
[4/4] Building fresh packages...
success Installed "gatsby-cli@4.7.0" with binaries:
      - gatsby
Done in 7.62s.

できました。

2. サイト作成

空のサイトを作りたいので、参照サイトに言われたまま作ります。

$ gatsby new <これから作るサイト名> https://github.com/gatsbyjs/gatsby-starter-hello-world

You can now view gatsby-starter-hello-world in the browser.                                               http://localhost:8000/                                          

できました。

3. 起動確認

$ cd gatsby-site/
$ gatsby develop

できました。

4. 動作確認

参照サイトに書いていることを実際にやってみます。

できました。