Netlify

Squid と Netlify によるアプリケーションデプロイの効率化

Squid Netlify インテグレーションを使用すると、アプリケーションのビルドとデプロイを自動化できます。アプリケーションリポジトリを更新すると、frontend と Squid backend の両方の変更が自動的にデプロイされます。

利点

• Squid は、数分で任意のデータベースや API に接続し、統一されたクライアント SDK を介してそれらを管理します。
• アプリケーションはリアルタイムでの更新を受け取ります。
• アプリケーションは Server Side Rendering (SSR) の恩恵を受けます。
• Squid により、クライアント側とサーバー側の両方で制限なくアプリを拡張することが可能になります。
• ロックインを恐れることなく、どこまででも拡張可能です。Squid は設計上、柔軟かつ自由度が高くなっています。

ユースケース

• 既存の MongoDB、PostgresDB、MySQL、またはお好みの任意のデータベースを使用して、ボイラープレートやグルーコードなしでリアルタイムのフルスタック Web アプリケーションを作成します。
• 数分で POC またはプロトタイプを構築し、必要な Best of Breed リソースを使用して世界と共有します -- Squid はそれらすべてと統合できます。（必要なものが見つかりませんか？ Let us know!）

Netlify との連携

Note

以下の手順は、GitHub を通じて Netlify と連携し、Continuous Deployment を実装する方法を示しています。Squid を使用して Netlify に手動でデプロイする方法については、こちらのチュートリアルをご覧ください。

GitHub からフルスタックアプリケーションを Netlify に接続するには、以下の手順に従います:

1. GitHub 上のリポジトリにフルスタックアプリケーションをプッシュします。

2. Netlify コンソールで、GitHub リポジトリからインポートして新しいサイトを追加します。アプリの build settings を設定する際は、frontend の構成に基づいて適切なディレクトリとビルドコマンドを入力してください。例えば、Vite を使用している場合、以下の構成を使用します:

   • Base directory: "frontend"
   • Build command: "npm run build"
   • Publish directory: "frontend/dist"

   Netlify に新しいサイトを追加する方法の詳細については、Netlify ドキュメントをご覧ください。

3. Netlify コンソールで Integrations ページに移動し、Squid インテグレーションを検索します。Enable from a site をクリックし、次に対象のウェブサイトを選択します。

4. Squid アプリの Region、API key、および Environment ID を入力します。これらの値は Squid Console で確認できます。選択した環境に対応する Squid API key を使用してください。なお、dev 環境と prod 環境は別々の API key となっています。

5. Environment variable prefix には、frontend の構成に応じた任意のプレフィックスを入力します。例えば、Vite を利用している場合、「VITE_」と入力します。

6. 設定フォームの Auto-Deploy セクションで、Auto deploy enabled を Enabled に切り替えます。なお、Squid backend のデプロイは production (prod) ビルドのみがトリガーされます。この設定はいつでも無効化できます。

7. ベースディレクトリに対して相対的なパスとして、Squid backend ディレクトリへのパスを Backend directory として入力します。例えば、「../backend」となります。

8. 設定を保存します。これで、Squid と Netlify にデプロイされたフルスタックアプリケーションの準備が整いました！アプリケーションのリポジトリに変更が加えられると、Netlify が自動的に更新された frontend と Squid backend をビルドおよびデプロイします。