🚀

Amazon Lightsail で Laravel アプリリモート開発環境構築

2022/12/18に公開

AWS

目標

スマホアプリ用からアクセスするAPIを開発したいとのですが、サーバ側の環境構築に手間かけたくない、ローカルに環境を作成したくないと思い、労力、情報量を考えLightsailでサーバを構築しLaravelで開発することとしました。
Amazon Lightsail上の開発環境にLaravelプロジェクトを作成しVSCodeから直接リモート接続してアプリ(API)開発を行うための環境を構築します。

前提

AWS のアカウントは保有していて、ある程度の操作はできることを前提とします。

Amazon Lightsailサーバを立ち上げる

Lightsail のトップページに遷移

Lightsaileメニュー

Lightsail インスタンスの作成

インスタンスの作成をスタートします。

OSを選択します。

サーバを選択します。
一番最小の構成だとプロジェクトの構築に必要なリソースが不足するようなので、2番目に小さい構成を選択しました。

適当に名前を決めて、作成しましょう。

作成中の間はインスタンスがグレーアウトされて表示されます。

インスタンスの作成が終わるとこのようになります。

SSH接続可能にする

固定IPを設定

VSCodeからSSH接続して開発するので、固定IPの設定をします。

キーをダウンロード

SSH接続するための秘密鍵を取得します。

デフォルトの秘密鍵をダウンロードします。これで、繰り返しサーバを構築してもこのキーで接続できます。
（ただし、固定IPを再利用する場合は、known_hostsファイルの内容に注意）

VSCodeから接続

VSCodeにRemote-SSHをインストール

VSCodeのRemote - SSHエクステンションをインストールします。

SSH設定ファイルを記述

VSCodeの左下の><をクリック、Remote-SSh:Open Configuration File...を選択し設定ファイルを開きます。

接続先の情報を登録します。

Host lightsail-LAMP_PHP_8-1(任意の名前)
    HostName パブリックIP
    User bitnami
    IdentityFile /Users/xxxx/.ssh/LightsailDefaultKey-ap-northeast-1.pem（先ほどダウンロードした秘密鍵のパス）

接続

Laravelアプリ作成

Laravelアプリ作成を実施

VSCode のターミナルからコマンドを入力し、プロジェクトを作成します。
ここではプロジェクト名は"example-app"としています。

bitnami@ip-xxx-xx-xx-xx:~$ composer create-project laravel/laravel example-app
Creating a "laravel/laravel" project at "./example-app"
Info from https://repo.packagist.org: #StandWithUkraine
Installing laravel/laravel (v9.4.0)
以下略

Apacheの設定

ドキュメントルートを設定します。
vhostの設定ファイルを作成します。

sudo vi /opt/bitnami/apache2/conf/vhosts/example-app.conf

ファイルに以下を記述して保存します。

  <VirtualHost 127.0.0.1:80 _default_:80>
    ServerAlias *
    DocumentRoot /opt/bitnami/example-app/public
    <Directory "/opt/bitnami/example-app/public">
      Options -Indexes +FollowSymLinks -MultiViews
      AllowOverride All
      Require all granted
    </Directory>
  </VirtualHost>

ちなみに、エディタでの設定ファイルの編集もVSCodeからできてしまいます。
（SSH接続用のアプリやブラウザで動作するターミナルを起動なども不要です。）

必要な書き込み権限を与えて、Apacheを再起動します。

sudo chmod -R 0777 bootstrap
sudo chmod -R 0777 storage
sudo /opt/bitnami/ctlscript.sh restart apache

早速アクセスしてみる

ブラウザでアクセスしてみます。

これで、Laravelのインストールと設定まで終了です。

VSCodeでLaravelアプリのフォルダをオープンする

VSCodeでプロジェクトのフォルダをオープンして、コード編集可能にして行きます。
まずはフォルダーオープン指定します。

オープンしたいフォルダとしてLaravelアプリのフォルダを指定します。

信頼します。

これでVSCodeからコード編集が可能になりました。

MariaDBに接続

データベースの作成

まず、パスワードを調べます。パスワードはホームディレクトリにあるファイル"bitnami_application_password"に格納されています。
確認したらデータベースクライアントを起動します。パスワードはあらかじめ確認したパスワードを入力します。

$ cat ~/bitnami_application_password
$ mysql -uroot -p

データベースの作成を実行。
この例では文字コードを設定しています。

MariaDB [(none)]> CREATE DATABASE `example-app` CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci;

この時は、VSCodeで複数のターミナルを起動すると便利です。

データベースの接続情報の設定

プロジェクトフォルダにある".env"ファイルにデータベースの接続情報を設定します。
パスワードは、"~/bitnami_application_password"ファイルに記載されているパスワードを記載します。

マイグレーションしてみる

php artisan migrate

phpMyAdminを使いたい場合

SSHトンネリングを行なってブラウザからアクセスします。

SSHトンネリング

ターミナルを立ち上げて、以下のコマンドを入力します。
pemファイルとIPアドレスはそれぞれ、ダウンロードしたファイルとLightsailサーバのIPアドレスに書き換えてください。

ssh -N -L 8888:127.0.0.1:80 -i /Users/xxxx/.ssh/LightsailDefaultKey-ap-northeast-1.pem bitnami@xxx.xxx.xxx.xxx

phpMyAdminにアクセスする

ユーザ名はroot、パスワードは、"~/bitnami_application_password"ファイルに記載されているパスワードを記載します。

Githubにプロジェクトを登録

リポジトリの作成

Gitの設定

git config --global user.name "名前を指定"
git config --global user.email "メールアドレス"
git init
git remote add origin https://github.com/H-E-Systems/example-app.git
git branch -M main

最後にプッシュして完成です。

目標

前提