ウェブサイトや API をホストする方法

はじめに

Square Cloud 上でウェブサイトと API をホスティングするには、適切な設定手順に従い、必要な技術的前提条件を満たすことが不可欠です。この包括的なガイドでは、プロフェッショナルな実装プロセス全体を紹介します。

技術的前提条件

Square Cloud アカウント: サインアップページからメールアドレスを使ってアカウントを作成してください。
有効なプラン: 十分なリソースと最適化されたパフォーマンスを確保するには、有効なプランが必要です。利用可能なプランを確認し、ニーズに最も適したものを選んでください。

Square Cloud 設定ファイル

詳しく学ぶ: Square Cloud 用の設定ファイルの作成方法。

squarecloud.app ファイルは、Square Cloud 上でアプリケーションを設定するために使用される重要な設定ファイルです。名前、説明、バージョン、メインファイルなど、基本的な設定を定義します。

ウェブサイトに必須のパラメータ

サーバーはポート 80 とホスト 0.0.0.0 (すべてのネットワークインターフェース) でリッスンする必要があります。Square Cloud はサブドメインへのトラフィックをそこに届けます。Square Cloud は環境変数 PORT (80) と HOST (0.0.0.0) を設定するため、ポートは PORT から読み込み、フォールバックとして 80 を残しておいてください。

const port = Number(process.env.PORT) || 80;
app.listen(port, "0.0.0.0");

import os

port = int(os.environ.get("PORT", 80))
app.run(host="0.0.0.0", port=port)

Next.js や Nuxt など、多くのフレームワークはすでに自動で PORT を読み込みます。静的ウェブサイトには、サーバーも START パラメータもまったく必要ありません。 squarecloud.app 設定ファイルの主なパラメータ:

SUBDOMAIN: ウェブサイトのホスティングでは、このパラメータに希望のサブドメインを設定します。初回のアップロード時に設定してください。サブドメインなしでアップロードしたアプリケーションには、後から設定できません。
START: カスタム起動コマンド (必要な場合)。
MEMORY: アプリケーションに割り当てる RAM（メガバイト単位）。ウェブサイトと API には最低 512 が必要です。なぜ最小値があるのか気になる方は、RAM の最小値が存在する理由を参照してください。

ウェブサイトの URL は次のようになります: my-subdomain-parameter.squareweb.app

設定例

例 1: カスタム起動コマンドのない静的ウェブサイト

MAIN=index.html
MEMORY=512
VERSION=recommended
DISPLAY_NAME=My simple static website!
SUBDOMAIN=mysite-simple-website

例 2: カスタム起動コマンドを使う Next.js ウェブサイト

RUNTIME=nodejs
MEMORY=1024
VERSION=recommended
DISPLAY_NAME=My simple Next.js website!
SUBDOMAIN=mysite-nextjs-website
START=npm run start

先に手元のマシンで npm run build を実行し、.next フォルダーを zip に含めてください。Square Cloud は devDependencies をインストールしないため、サーバー上ではビルドできません。START コマンドを使う場合、RUNTIME=nodejs で Node.js ランタイムが選択され、MAIN ファイルは不要です。フレームワーク固有の詳細については、Next.js ガイドを参照してください。

カスタムドメイン

mysite.squareweb.app の代わりに独自ドメイン (例: mysite.com) からウェブサイトを配信するには、Standard プラン以上が必要です。ヘルプセンターの独自ドメインの設定方法に従ってください。

複数の技術のサポート

Square Cloud は、さまざまなウェブ開発技術を幅広くサポートしており、プロジェクトに最も適した技術スタックを柔軟に選択できます。

React

Square Cloud で React ウェブサイトをホスティングする方法を学びましょう。

Next.js

Square Cloud で Next.js ウェブサイトをホスティングする方法を学びましょう。

NestJs

Square Cloud で NestJs アプリケーションをホスティングする方法を学びましょう。

Vite

Square Cloud で Vite ウェブサイトをホスティングする方法を学びましょう。

Vue

Square Cloud で Vue ウェブサイトをホスティングする方法を学びましょう。

Express

Square Cloud で Express API をホスティングする方法を学びましょう。

Flask

Square Cloud で Flask アプリケーションをホスティングする方法を学びましょう。

Django

Square Cloud で Django アプリケーションをホスティングする方法を学びましょう。

FastAPI

Square Cloud で FastAPI アプリケーションをホスティングする方法を学びましょう。

Lavalink

Lavalink サーバーをホスティングして、Discord ボットに高品質な音楽をストリーミングする方法を学びましょう。

次のステップ

アプリが起動しない

ポートの競合、モジュールの不足などの起動エラーを修正します。

環境変数

API キーや接続文字列をコードから切り離します。

マネージドデータベース

ウェブサイトや API 用のデータベースを作成します。

お問い合わせ

技術的な問題が解決しない場合は、専門のサポートチームがお手伝いします。お問い合わせいただければ、どのような問題でも喜んで解決をサポートいたします。サポートの質の高さも、開発者が Google と Trustpilot で Square Cloud に402 件のレビューで 4.9/5という評価をつけている理由の 1 つです。

Bots