こんにちは。フリーランス・コンサルタント＆エンジニアの九保すこひです。

X（Twitter）やってます！
九保すこひ＠フリーランスエンジニア｜累計300万PVのブログ運営中

さてさて、まだまだマーケティング勉強の余韻が残っている今日この頃です。
こういった勉強をすると、日常から「あ、これってアレに使えるんじゃない？？」って思ったりします。

そして、そんな中思いついたのが、

カレンダー連携できるメール

です。

どういうことかと言うと、メールに.icsファイルを添付しておいて
メールを開いたときにカレンダーに登録をさせるようにするわけです。

例えば、商品やサービス、セミナーの日時って
忘れられてしまったりしますが、これを予防するための機能です。

流れはこんなカンジです。

イベント参加フォームから送信
完了メールを送信
ics が添付しているので以下のようにカレンダー登録できる

※ これは、gmailの例です。

そこで❗

今回はLaravelでこのicsファイル付きメールを送信し、
「少しでも参加人数を増やす」というマーケティングに関連した実装をしてみます。

ぜひ何かの参考になりましたら嬉しいです。😊✨

「ツイッター教材を買ったので、
投稿するツイートを大量生産してます！」

開発環境： Laravel 11.x

1 パッケージをインストールする
2 コントローラーをつくる
3 ビューをつくる
4 メール送信部分をつくる
5 ルートをつくる
6 テストしてみる
7 企業様へのご提案
8 おわりに

パッケージをインストールする

.icsを作成するためのパッケージをSpatieさんが提供していますので、
これをインストールしておきましょう。（いつもありがとうございます❗）

composer require spatie/icalendar-generator

これで準備は完了です。
ここからは実際にコードを書いていきましょう😊

コントローラーをつくる

では、今回はDB周りは不要なので、
いきなりコントローラーからつくっていきます。

以下のコマンドを実行してください。

php artisan make:controller ApplicationController

するとファイルが作成されるので、
中身を以下のようにします。

app/Http/Controllers/ApplicationController.php

<?php

namespace App\Http\Controllers;

use App\Mail\EventApplied;
use Carbon\Carbon;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Mail;
use Spatie\IcalendarGenerator\Components\Calendar;
use Spatie\IcalendarGenerator\Components\Event;
use Spatie\IcalendarGenerator\Properties\TextProperty;

class ApplicationController extends Controller
{
    private $event;

    public function __construct()
    {
        $dt = Carbon::now();
        $start_dt = $dt->addDays(7)->setTime(19, 0, 0); // 1週間後の19時からイベント開始
        $end_dt = $start_dt->copy()->addHours(2); // 開始から2時間後にイベント終了

        $this->event = [
            'name' => '新サービス「Console dot Log」参加説明会',
            'description' => '新サービス「Console dot Log」の参加説明会です。',
            'location' => [
                'address' => '東京都●●区丸●●１−２−３４',
                'address_name' => 'SUKOHI タワービル ２７階',
                'coordinates' => [
                    'lat' => 35.123456,
                    'lng' => 139.123456,
                ],
            ],
            'organizer' => [
                'name' => '株式会社 九保すこひ',
                'email' => 'sukohi@example.com',
            ],
            'start_dt' => $start_dt,
            'end_dt' => $end_dt,
        ];
    }

    public function create()
    {
        return view('application.create', [
            'event' => $this->event,
        ]);
    }

    public function store(Request $request)
    {
        // 注： バリデーションは省略してます

        // 本来はここでデータベースに保存する処理を書く

        // ics データを作成
        $ics_event = Event::create()
            ->name($this->event['name'])
            ->description($this->event['description'])
            ->startsAt($this->event['start_dt'])
            ->endsAt($this->event['end_dt'])
            ->address($this->event['location']['address'])
            ->addressName($this->event['location']['address_name'])
            ->coordinates(
                $this->event['location']['coordinates']['lat'],
                $this->event['location']['coordinates']['lng'],
            )
            ->organizer(
                $this->event['organizer']['email'],
                $this->event['organizer']['name'],
            );

        $ics_calendar = Calendar::create()
            ->appendProperty(
                TextProperty::create('METHOD', 'REQUEST')
            )
            ->event($ics_event);
        $ics_content = $ics_calendar->get();

        // メール送信
        Mail::to($request->email)->send(
            new EventApplied(
                event: $this->event,
                ics_content: $ics_content,
            )
        );

        return '申し込みが完了しました！';
    }
}

なお、icsデータの最後の部分で「METHOD:REQUEST」を追加していますが、これは以下のような選択ボタンを表示するためのものです。

※ 実際の内容はこんなカンジになります。

BEGIN:VCALENDAR
VERSION:2.0
PRODID:spatie/icalendar-generator
METHOD:REQUEST <---ここ
...

なお、もし「METHOD:REQUEST」をつけない場合だと、
以下のように「カレンダーに追加」リンクが表示されますが、
あまり目立たないので、よりカレンダー登録を訴求したい場合はセットしておくほうがいいでしょう。

ビューをつくる

次にコントローラー内でセットしたビューをつくります。
コマンドを実行して下さい。

php artisan make:view application.create

すると、ビューファイルが作成されるので、
中身を以下のようにします。

resources/views/application/create.blade.php

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title>{{ $event['name'] }}</title>
    <script src="https://cdn.tailwindcss.com/3.4.3"></script>
</head>
<body class="bg-gray-100 flex justify-center items-center h-screen">
<div class="w-full max-w-md p-8 bg-white shadow-lg rounded-lg">
    <h2 class="text-md font-bold text-center mb-6">{{ $event['name'] }}<br>登録フォーム</h2>
    <form action="{{ route('application.store') }}" method="POST" class="space-y-6">
        @csrf
        <input type="text" name="name" placeholder="お名前" class="w-full p-2 border border-gray-300 rounded-md">
        <input type="email" name="email" placeholder="メールアドレス" class="w-full p-2 border border-gray-300 rounded-md">
        <button type="submit" class="w-full p-2 bg-blue-500 text-white rounded-md hover:bg-blue-600">送信</button>
    </form>
</div>
</body>
</html>

メール送信部分をつくる

では、こちらもコントローラー内でセットした
Mailableをつくっていきます。

コマンドを実行して下さい。

php artisan make:mail EventApplied

するとMailableファイルが作成されるので、
中身を以下のようにします。

app/Mail/EventApplied.php

<?php

namespace App\Mail;

use Illuminate\Bus\Queueable;
use Illuminate\Contracts\Queue\ShouldQueue;
use Illuminate\Mail\Mailable;
use Illuminate\Mail\Mailables\Content;
use Illuminate\Mail\Mailables\Envelope;
use Illuminate\Queue\SerializesModels;
use Illuminate\Mail\Mailables\Attachment;

class EventApplied extends Mailable
{
    use Queueable, SerializesModels;

    /**
     * Create a new message instance.
     */
    public function __construct(
        private array $event,
        private string $ics_content
    ){}

    /**
     * Get the message envelope.
     */
    public function envelope(): Envelope
    {
        return new Envelope(
            subject: '参加申し込みありがとうございます！',
        );
    }

    /**
     * Get the message content definition.
     */
    public function content(): Content
    {
        return new Content(
            view: 'emails.event_applied',
            with: [
                'event' => $this->event,
            ],
        );
    }

    /**
     * Get the attachments for the message.
     *
     * @return array<int, \Illuminate\Mail\Mailables\Attachment>
     */
    public function attachments(): array
    {
        return [
            Attachment::fromData(fn() => $this->ics_content, 'event.ics', 'text/calendar')
        ];
    }
}

この中で重要なのは、添付ファイルをデータからつくっているところです。
fromData()で実装できます。

resources/views/emails/event_applied.blade.php

php artisan make:view emails.event_applied

ビューが作成されるので中身を変更します。

resources/views/emails/event_applied.blade.php

この度は、{{ $event['name'] }} への参加申し込みをいただき、<br>誠にありがとうございます。<br><br>
以下の内容で申し込みを受け付けました。<br><br>

詳細は以下の通りです。<br>
時間：{{ $event['start_dt']->format('Y年m月d日') }} （{{ $event['start_dt']->format('H:i') }}〜 {{ $event['end_dt']->format('H:i') }}）<br>
場所： {{ $event['location']['address_name'] }}<br><br>

当日お会いできるのを楽しみにしております。<br>
ぜひカレンダーへの予定の追加をお願いいたします。<br><br>

{{ $event['organizer']['name'] }}

ルートをつくる

では、最後にルートです。

routes/web.php

// 省略

use App\Http\Controllers\ApplicationController;

// 省略

Route::prefix('application')->group(function () {
    Route::get('/create', [ApplicationController::class, 'create'])->name('application.create');
    Route::post('/', [ApplicationController::class, 'store'])->name('application.store');
});

これで作業は完了です。
お疲れ様でした😊✨