1. はじめに
どこかでVercelでもNext.js以外のアプリをデプロイできるという噂を聞いて、本当かなと思いつつ試してました。
結論、動きます! Laravelで実装したCRUD機能を含む管理画面をVercelにデプロイして実際に運用できています。
ただし、DBはVercelとは別に用意する必要があります。無料で長く使えるNeonというPostgreSQLサービスと組み合わせることで、コスト効率の良い構成を実現しました！
この組み合わせにより、Laravelアプリケーションを無料で運用できる環境を構築できます。
（ただし、後述する制限があります）
2. 対象読者
- Laravelを使う方
- Vercelでアプリケーションをホスティングしたい方
- RDBを使用したい方
- Neonに興味がある方
- 無料または低コストでLaravelアプリケーションをデプロイしたい方
3. 目次
4. 環境
本記事で紹介する環境は以下の通りです：
-
アプリ側
- PHP: 8.2
- Laravel: 10.x
-
ホスティング
- Vercel
-
データベース
- Neon
5. サービスの紹介
5-1. Vercelとは
Vercelは、モダンなウェブアプリのためのクラウドプラットフォームです。
元々はNext.jsなどのJSフレームワーク向けだったらしいですが、今はPHPも使えるようになっています！
PHPだけではなく、GOやRubyなども使えるそうで、ランタイムという機能を利用してサーバレス関数に変換しているそうです。
5-2. Neonとは
Neonは最近登場したサーバーレスPostgreSQLサービスです!
類似サービスで有名なのがSupabaseがあると思いますが、制限がSupabaseの方が厳しい印象でした。
そのため、今回はNeonを使うことに決めました。
比較に関してはこちらのサイトを参考にしました！
6. 本編
6-1. Laravel側のデプロイ準備
Vercelのサーバーレス関数のエントリーポイントとして機能するためのファイルapi/index.phpを作成します。
<?php
/**
* Here is the serverless function entry
* for deployment with Vercel.
*/
require __DIR__.'/../public/index.php';
次にVercelの設定ファイルvercel.jsonを作成します。
{
"version": 2,
"regions": [
"hnd1"
],
"builds": [
{
"src": "api/index.php",
"use": "vercel-php@0.6.2"
},
{
"src": "public/**",
"use": "vercel-php@0.6.2"
}
],
"routes": [
{
"src": "/build/(.*)",
"dest": "/public/build/$1"
},
{
"src": "/(.*)",
"dest": "api/index.php"
}
],
"env": {
"APP_NAME": "Laravel Vercel",
"APP_DEBUG": "false",
"APP_ENV": "production",
"APP_URL": <VercelのURL>,
"SESSION_SECURE_COOKIE": "true",
"SANCTUM_STATEFUL_DOMAINS": <Vercelのドメイン>,
"APP_CONFIG_CACHE": "/tmp/config.php",
"APP_EVENTS_CACHE": "/tmp/events.php",
"APP_PACKAGES_CACHE": "/tmp/packages.php",
"APP_ROUTES_CACHE": "/tmp/routes.php",
"APP_SERVICES_CACHE": "/tmp/services.php",
"CACHE_DRIVER": "array",
"CACHE_STORE": "array",
"LOG_CHANNEL": "stderr",
"SESSION_DRIVER": "cookie",
"VIEW_COMPILED_PATH": "/tmp"
}
}
この設定ファイルでは以下の内容を指定しています。
-
regions: デプロイするリージョン（この例では東京リージョンhnd1） -
builds: ビルド対象のファイル-
api/index.php: サーバーレス関数のエントリーポイント -
public/**: 静的ファイル（CSS、JavaScript、画像など）
-
-
routes: リクエストのルーティング設定- 静的ファイルへのリクエストは
publicディレクトリにルーティング - その他のリクエストはすべて
api/index.phpにルーティング
- 静的ファイルへのリクエストは
-
env: 環境変数の設定- サーバーレス環境向けの最適化設定が含まれています
なお、データベース接続情報などの機密情報はVercelのダッシュボードで環境変数として設定しています。
また、Vercelにデプロイしないファイルやディレクトリを.vercelignoreに設定します。
/vendor
/node_modules
/.env
このファイルでは、Vercelにアップロードしないファイルやディレクトリを指定します。
6-2. Neonデータベースの接続情報
Neonデータベースを構築する手順については省略します。
Neonデータベースに接続する下記の情報をVercelの環境変数に設定します。
- ホスト名
- データベース名
- ユーザー名
- パスワード
6-3. Vercelの設定
ここでは、VercelとGitHubを連携する手順については省略します。
プロジェクト設定と環境変数はLaravelに合わせる必要があるため、説明します。
まず、プロジェクト設定は下記としてください。
- Project Name: 任意の名前を入力
- Framework Preset: 「Other」を選択
- Root Directory: Laravelプロジェクトのルートディレクトリを指定
- Build Command: (空白)
次に、環境変数を設定します。
基本的にはLaravelプロジェクトの.envを入力します。
Neonデータベースに関連する情報は下記のように設定します。
DB_CONNECTION=pgsql
DB_HOST=<Neonホスト名>
DB_PORT=5432
DB_DATABASE=<Neonデータベース名>
DB_USERNAME=<Neonユーザ名>
DB_PASSWORD=<Neonパスワード>
また、他に下記の設定も必要です。
APP_KEY=<ローカルで生成したキーで問題なし>
6-4. Neonのマイグレーション実行
Vercelのサーバーレス環境では直接コマンドを実行できないため、以下の方法で対応しています。
(他に良い方法を知っている方がいれば教えてほしいです)
ローカル環境からNeonデータベースに接続するように .env ファイルを一時的に変更して、下記を実行します。
$ php artisan migrate
$ php artisan db:seed
以上で、VercelにデプロイしたLaravelアプリが動作します！！🎉
6-5. 注意点
Vercelにはサーバーレス関数の実行時間には制限があります。そのため、時間のかかる処理(例えば生成AIのAPIを利用する)は別のサービスを利用する、もしくは課金プランの利用を検討する必要があります。
また、無料プランの場合にはスケジュールタスクが1日1回だけしか利用できないことにも注意が必要です。
7. さいごに
やはり個人開発は無料でできることを重視しています。
無料で素晴らしいサービスを利用できることに感謝しています！
いくつか制限はありますが、個人で使用する分には十分すぎる性能だと思っています。