React サーバーの上げ方 google books api を使った検索サイトを作った

初めてReactを触るにあたってサーバーへのアップロードに苦戦した

以下のサイトの41-43ページに解決方法記載あり

https://books.google.co.jp/books?id=2ayWDwAAQBAJ&pg=PT44&lpg=PT44&dq=react+%E3%82%B5%E3%83%BC%E3%83%90%E3%83%BC+%E3%82%A2%E3%83%83%E3%83%97%E3%83%AD%E3%83%BC%E3%83%89+%E5%BF%85%E8%A6%81%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB&source=bl&ots=AwcUMo7-21&sig=ACfU3U11IwrA6B_Wm-azAhknYmxKYbb6YA&hl=ja&sa=X&ved=2ahUKEwic58iXnNjpAhXTc3AKHV1ZB0QQ6AEwAnoECGEQAQ#v=onepage&q=react%20%E3%82%B5%E3%83%BC%E3%83%90%E3%83%BC%20%E3%82%A2%E3%83%83%E3%83%97%E3%83%AD%E3%83%BC%E3%83%89%20%E5%BF%85%E8%A6%81%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB&f=false

 

簡単にいうと

①作成したフォルダのpackage.jsonファイルを開く

そして

{
"name": "react-app3",
"version": "0.1.0",
"private": true,
"homepage": "./",

上段の方にある↑の部分に

"homepage": "./",

の記述を追加する(ここが最初は記入されていない)

②ターミナルで作成したフォルダのディレクトリへ行き

npm run build

を実行する。

これによりフォルダ内に「build」というフォルダが作成される。

このフォルダをさくらサーバーなど任意のサーバーへアップロードすればOK

 

失敗したこと

最初Reactの元々のフォルダを全てサーバーへ上げたら、膨大な処理量で一向に終わらず切断した。

次回からは今回の記事のやり方をしよう

 

apiの使い方や参考にしたサイトは以下

React x google books api の動画(全部で4パートあり)

https://www.youtube.com/watch?v=6sBqMyUOcl8

 

基本的なReactについて

https://note.com/natsukingdom/n/n2dd88d531f22