Gatsby.jsを用いたHPの作り方

Question

この度、好奇心よりGatsby.jsを用いてHPを作ってみようと思っています。

しかし、いかんせん知識量が乏しく、これから始めるにあたって手順の確認兼相談をさせていただきたいです。

以下の手順を考えているのですが、おかしなところがあれば教えてください。尚、HP作成が初めてとなり、やや回りくどい手順を踏もうと考えています。それについても意見をいただけますと幸いです。
※デプロイ前の段階までを記しています。

①HTMLとCSSを用いてHPの土台を作る
②Gatsby.jsを用いて、それぞれを置き換える

とても愚かな質問だということは承知しているのですが、HP作成におけるアドバイスなどいただけますと助かります。

よろしくお願いいたします。

Comments

[kuma_kuma_]

それ以前に作ったHPを公開(他の人が見れる)状態にすることの知識はありますか(サーバ設定等)？

Answer 1

まず土台を作る、というのは良いことだと思います

ただ、Gatsby の場合は通常の HTML と CSS とはかなり違う実装方法となるので
置き換えるというより、作り直すのに近くなる可能性があります

作るなら、本当に簡素なもので、概要の設計を行う程度にとどめておく方が良いと思います

Gatsby の公式チュートリアルはこちらです
Set Up Your Development Environment | Gatsby

僕は公式のチュートリアルをやってみて理解が進みましたのでお奨めしますが、
かなり広範な知識が要求されると思いますので、
わからないことが出てきたら都度検索して調べることが必要となると思います
ちなみに僕のつい最近やって、確か丸 4 日かかったと思います
(他にもっとすばらしいトレーニングがある可能性も否定しません)

もし Gatsby で何ができるかを大体知っているのであれば、
個人的にはページを作り込むより先にデプロイを試しておくと
ページの作り込みに集中できて良いのではないかと思います

Gatsby の主なデプロイ先の候補とその説明や手順は次の記事にまとまっています

Deploying and Hosting | Gatsby

Gatsby を手元で動かすことに成功したら、
内容は Hello World 状態のままでいいので一度デプロイしてみることをお奨めします

ぜひ頑張ってください

Comments

[sorajiro]

ありがとうございます！！とても助かりました！
チュートリアルから始めてみようと思います！