一般社団法人 全国個人事業主支援協会

COLUMN コラム

とあるアプリのハリボテを作成するためにGatsbyを使いました。

選択した理由は、

・SEO関係ない(SSR考慮しない)

・アクセス負荷が高くなさそうだったので、クラウドストレージにのせればいいじゃん

といった理由からです。

とはいえ、使用したことがなかったので、
Quick Startから始めたわけなのですが、
まぁこれが簡単。

僕が苦手なバンドラに関してはGatsbyが吸収してくれるだけでなく、
Reactに精通していれば、とっつきにくい記述も特になし。

静的ファイルを出力してさえしまえば、
とりあえずクラウドストレージに配置して
動作も確認できる。

create-react-appするより楽なのでは・・。

CSS in JSも色々選べるようで、emotionが使えるのもとても良かったです。

みんな知っている事実かもしれませんが今更ながら・・

Gatsby最高!

さらっと動かした時にちょっとつまづいたのは、
静的ファイルを出力するたびに、差分しか更新してくれなさそうな感じ。

すでに削除されたファイルに関する、
トランスパイルされたファイルが残っていたため、
静的ファイルが出力されるディレクトリの中身をまるっと消したのですが、
それでアプリが起動しなくなってしまいました。

キャッシュに関するディレクトリが残っているとダメな模様で、
package.jsonに以下の記述を足しました。


"scripts": {
"develop": "rm -Rf ./.cache ; rm -f ./public/* ; gatsby develop",
"start": "rm -Rf ./.cache ; rm -f ./public/* ; gatsby develop",
"build": "rm -Rf ./.cache ; rm -f ./public/* ; gatsby build",

新しいFWは可能な限り全部試したいですが、
当面何かあったときはGatsbyでいいや・・ってなりそう。

(snowpackは以前使用した時、若干の制限があったけどその辺はどうなったんだろう)

The following two tabs change content below.

江尻 翔

フリーでSEをしています。 バックエンドから逃げて、 現在はフロントエンドメインでお仕事中。

最新記事 by 江尻 翔 (全て見る)

この記事をシェアする

  • Twitterでシェア
  • Facebookでシェア
  • LINEでシェア