静的サイトの追加

静的サイトホスティングでは、静的サイトを容易に構築・運営でき、MyKinstaアカウントをお持ちであれば、どなたでもご利用いただけます。サイトは1つの企業につき100件まで追加可能です。詳しくはこちらをご覧ください。

静的サイトの追加

新たに静的サイトを追加するには「静的サイト」ページで「サイトを追加」をクリックします。

初めて静的サイトを追加するときには、アカウントからGitサービスとリポジトリを選択する必要があります。以下のいずれか(またはすべて)から選択可能です。

Gitサービスのアカウントに接続したら、MyKinsta に戻り「静的サイトの追加」手順の続きを行います。

続いて表示されるフォームには、以下のフィールドがあります。

詳細

ブランチの選択

サポートされているGitサービスから選択することができます。

  • リポジトリ:使用するGitリポジトリを選択してください。
  • デフォルトのブランチ:コミット時または手動でデプロイするブランチを設定できます。
  • コミットに際し自動でデプロイ:上記で選択したブランチにコミットが行われるたびに、サイトを自動でデプロイするかどうかを選択します。

基本情報

  • 表示名:この名前はMyKinstaに表示されるもので、識別に利用されます。他の静的サイト、アプリケーション、またはWordPressサイトと同じ名前は使用できません。

ビルド設定

ビルド設定は静的サイトのビルド方法を決定します。サイトが自動的に検出されたフレームワークの1つを使用している場合、ビルドコマンド公開ディレクトリが自動的に設定され、フレームワークが検出されたことを伝える通知が表示されます。自動入力されフィールドの内容が正しいかどうかを確認してください。

ビルド設定

  • ビルドコマンド:(任意)静的サイトのビルドコマンドが必要な場合は、ここに入力してください。
  • Nodeのバージョン:(任意)ビルドコマンドを入力する場合は、互換性を確保し、エラーを回避するために、ビルドプロセス中に使用するNode.jsのバージョンを指定できます。
  • 公開ディレクトリ:(任意)空白の場合、リポジトリのルートフォルダがデフォルトになります。
    • 特定のサブディレクトリを使ってサイトを公開したい場合は、リポジトリルートからの相対パスを入力してください。
    • ビルドする必要のないHTMLサイトを特定のサブディレクトリから実行するには、そのディレクトリにサイトファイルを配置し、リポジトリルートからの相対パスをここに入力してください。
  • indexファイル:シングルページアプリケーション(SPA)の場合は、サイトのデフォルトページを貼り付けてください。これは通常、index.htmlという名前のHTMLファイルになります。ユーザーがサイトのURLを入力すると、サイト上のシームレスなナビゲーションを確保するため、すべてのナビゲーショントラフィックがこのindexファイルを経由します。
  • エラーファイル:シングルページアプリケーション(SPA)の場合、ナビゲーションエラーが生じた際にリダイレクトするファイルを指定することができます。

フレームワークの自動検出

package.jsonファイルで使用されている依存関係を確認し、フレームワークを自動的に検出します。以下のフレームワークのいずれかが検出された場合は、ビルドコマンド公開ディレクトリのフィールドが自動入力されます。また、リポジトリにyarn.lockファイルがあるかどうかを確認し、見つかった場合には、ビルドコマンドにはnpmコマンドではなく、同等のyarnコマンドが自動入力されます。

フレームワークビルドコマンド公開ディレクトリ
Astroyarn build
npm run build
dist
ElderJSyarn build
npm run build
public
Gatsbyyarn build
npm run build
public
Next.jsyarn build
npm run build
out
Nuxtyarn generate
npm run generate
.output/public
React (+ Create React App)yarn build
npm run build
build
React (+ Vite)yarn build
npm run build
dist

自動検出されるフレームワークに追加したいフレームワークをご利用の場合は、カスタマーサポートまでチャットにてご連絡ください。

環境変数

環境変数を使うことで、API キーなど、明確なテキストとしてコードに記述すべきでない情報をビルドプロセスに付与することができます。環境変数のキーと値のペアを追加してください。環境変数は、サイト作成後に設定ページで追加、編集、削除可能です。

最後に「サイトを作成」をクリックして、サイトのデプロイを開始します。

サイトに移動する

サイトのデプロイが完了したら、MyKinstaの「静的サイト」の一覧から該当のサイトを選択し、画面右上の「サイトに移動」をクリックすると、サイトにアクセスすることができます。

静的サイトのデプロイが完了したら、「サイトに移動」をクリックして静的サイトにアクセス
静的サイトのデプロイが完了したら、「サイトに移動」をクリックして静的サイトにアクセス
この記事は役に立ちましたか?