質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
React Native

React Nativeは、ネイティブモバイルアプリ(iOS/Android)を作成できるJavaScriptフレームワークです。Reactと同じ設計のため、宣言的なコンポーネントでリッチなUIを開発することが可能です。

Next.js

Next.jsは、Reactを用いたサーバサイドレンダリングなどを行う軽量なフレームワークです。Zeit社が開発しており、nextコマンドでプロジェクトを作成することにより、開発環境整備が整った環境が即時に作成できます。

Q&A

解決済

1回答

928閲覧

Next.jsとReact、microCMSを使用したホームページをレンタルサーバ(xserver)にアップしたい

TakahitoSugiura

総合スコア13

React Native

React Nativeは、ネイティブモバイルアプリ(iOS/Android)を作成できるJavaScriptフレームワークです。Reactと同じ設計のため、宣言的なコンポーネントでリッチなUIを開発することが可能です。

Next.js

Next.jsは、Reactを用いたサーバサイドレンダリングなどを行う軽量なフレームワークです。Zeit社が開発しており、nextコマンドでプロジェクトを作成することにより、開発環境整備が整った環境が即時に作成できます。

0グッド

0クリップ

投稿2023/04/28 08:23

編集2023/04/28 08:29

作成したサイトをvercelでブラウザ確認できましたが、レンタルサーバーで公開して確認したいです。
こちらの教材を参考にして作成したサイトです。
https://book.mynavi.jp/supportsite/detail/9784839980177.html

next buildを行ったら「.next」の中にいろいろとファイルが生成されました。
イメージ説明

以下の情報を参考にすると「build」や「dist」のディレクトリができてそれをアップすれば良さそうなのですが、私のケースではそれが当てはまってそうにないです。
https://gadgelaun.com/?p=29917
https://lpeg.info/react/react_install.html

全てアップしたり部分的にアップしたり試してみましたが、そもそもビルドのやり方?とか何か間違っているのでしょうか?

他に何の情報があればいいか分かりませんが、package.jsonの中身も置いといきます。

"name": "blog", "version": "0.1.0", "private": true, "scripts": { "dev": "next dev", "build": "next build", "start": "next start", "lint": "next lint" }, "dependencies": { "@fortawesome/fontawesome-svg-core": "^6.4.0", "@fortawesome/free-brands-svg-icons": "^6.4.0", "@fortawesome/free-regular-svg-icons": "^6.4.0", "@fortawesome/free-solid-svg-icons": "^6.4.0", "@fortawesome/react-fontawesome": "^0.2.0", "@types/node": "18.15.11", "@types/react": "18.0.37", "@types/react-dom": "18.0.11", "autoprefixer": "10.4.14", "date-fns": "^2.29.3", "eslint": "8.38.0", "eslint-config-next": "13.3.0", "html-react-parser": "^3.0.15", "html-to-text": "^9.0.5", "microcms-js-sdk": "^2.3.3", "next": "13.3.0", "plaiceholder": "^2.5.0", "postcss": "8.4.22", "react": "18.2.0", "react-dom": "18.2.0", "sass": "^1.62.0", "sharp": "^0.32.0", "tailwindcss": "3.3.1", "typescript": "5.0.4" } }

もし分かる方いましたらご教授いただけましたら幸いです。

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

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

通常、Next.jsにはサーバサイドも含まれますので、レンタルサーバなどNode.jsの動かない環境で使う場合にはそれに応じたビルド設定へ切り替えて、単純なHTMLとJavaScriptだけにする必要があります。

投稿2023/04/28 08:58

maisumakun

総合スコア145184

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

TakahitoSugiura

2023/04/28 10:53

なるほど。 とても分かりやすくありがとうございました! バックエンドの事知識がなかったので助かりました。 案件にもよるとは思いますが、gitと連携してクラウドサーバで動かすのが主流なのでしょうか?
maisumakun

2023/04/28 12:37

そうですね、サーバサイドを使わないということは、Next.jsの値打ちの何割かを捨てることになってしまいます。
TakahitoSugiura

2023/04/28 15:23

確かにそうですね。 とても参考になりました。 ありがとうございました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問