Netlify
Squid と Netlify でアプリケーションのデプロイを効率化
Squid の Netlify integration を使用すると、アプリケーションのビルドとデプロイを自動化できます。アプリケーションのリポジトリを更新すると、frontend と Squid backend の両方の変更が自動的にデプロイされます。
メリット
- Squid は数分で任意の database や API に接続し、統一された client SDK を通じてそれらをすべて管理します。
- アプリケーションは更新をリアルタイムで反映できます。
- アプリケーションは Server Side Rendering (SSR) の恩恵を受けられます。
- Squid を使うことで、client と server の両方で制限なくアプリを拡張できます。
- ロックインを恐れず、必要なところまで深く使えます。Squid は柔軟で、設計上 unopinionated です。
ユースケース
- 既存の MongoDB、PostgresDB、MySQL、または好みの任意の database を使って、ボイラープレートやグルーコードなしでリアルタイムなフルスタック web アプリケーションを作成する。
- 数分で POC やプロトタイプを構築し、必要な best of breed のリソースを使って世界に共有する -- Squid はそれらすべてと統合できます。（必要なものが見当たりませんか？お問い合わせください！）
Netlify と統合する
以下の手順では、GitHub 経由で Netlify と統合し Continuous Deployment を実装する方法を説明します。Netlify 上で Squid を手動デプロイする方法については、このチュートリアルをご覧ください。
GitHub からフルスタックアプリケーションを Netlify に接続するには、次の手順に従ってください。
-
フルスタックアプリケーションを GitHub のリポジトリに push します。
-
Netlify console で、GitHub リポジトリから import して新しい site を追加します。アプリの build settings を設定する際は、frontend の構成に基づいて適切な directory と build command を入力してください。たとえば Vite を使用している場合、次の設定を使用します。
- Base directory: "frontend"
- Build command: "npm run build"
- Publish directory: "frontend/dist"
Netlify に新しい site を追加する方法の詳細は、Netlify documentation をご覧ください。
-
Netlify console で Integrations ページに移動し、Squid integration を検索します。Enable from a site をクリックし、次にあなたの web site を選択します。
-
Squid app の Region、API key、Environment ID を入力します。これらの値は Squid Console で確認できます。dev と prod の environment では API key が別々になっているため、選択した environment に対応する Squid API key であることを確認してください。
-
Environment variable prefix には、frontend 構成に応じて必要な任意の prefix を入力します。たとえば Vite を使用している場合、envar prefix として “VITE_” を入力します。
-
設定フォームの Auto-Deploy セクションで、Auto deploy enabled を Enabled に切り替えます。production (
prod) ビルドのみが Squid backend のデプロイをトリガーする点に注意してください。この設定はいつでも無効化できます。 -
Squid backend directory のパスを、base directory からの相対パスとして Backend directory に入力します。例: “../backend”。
-
設定を保存します。これで Squid と Netlify にデプロイされたフルスタックアプリケーションが稼働します！アプリケーションのリポジトリに変更が加えられるたびに、Netlify が更新された frontend と Squid backend を自動的にビルドおよびデプロイします。