Statamic Laravel 13 DevContainer

This repository includes a DevContainer configuration for developing Statamic CMS with Laravel 13 using PHP 8.5.

Getting Started

Prerequisites

• DevPod or VS Code with Remote - Containers extension
• Docker or Docker Desktop

What's Included

• PHP 8.5 CLI with all Laravel-required extensions
• Composer for PHP dependency management
• Node.js & npm for frontend asset compilation
• Vite development server for hot module reloading
• SQLite support (configured for flat-file mode)
• oh-my-bash with custom aliases (ll, la)
• Vim text editor
• Git & GitHub CLI integration with your host SSH keys
• Pre-installed global tools:
  • statamic CLI for creating and managing projects
  • laravel installer
  • tinker REPL

Development Workflow

Create a New Statamic Project

statamic new my-project
cd my-project

Start Development

Run the complete dev environment with one command:

composer run dev

This starts all services concurrently:

• Laravel development server on http://localhost:8000
• Vite dev server on http://localhost:5173
• Queue listener for background jobs
• Application logs viewer (Pail)

Or run services individually:

# Terminal 1 - Laravel server
php artisan serve --host=0.0.0.0 --port=8000

# Terminal 2 - Vite dev server
npm run dev

Important Configuration Fixes

Fix 1: Accessing Dev Server from Host Machine

Problem: Laravel dev server only listens on 127.0.0.1:8000 (localhost inside container only)

Solution: Update composer.json to bind to all interfaces:

Find the dev script in composer.json and ensure the php artisan serve command includes --host=0.0.0.0:

"dev": "concurrently ... \"php artisan serve --host=0.0.0.0\" ..."

Then access at: http://localhost:8000

Fix 2: Vite Dev Server IPv6 Issues

Problem: Vite may bind to IPv6 ([::1]:5173) which doesn't work from the host

Solution: Update vite.config.js to explicitly use IPv4:

import { defineConfig } from 'vite'
import laravel from 'laravel-vite-plugin'

export default defineConfig({
  plugins: [
    laravel({
      input: ['resources/css/app.css', 'resources/js/app.js'],
      refresh: true,
    }),
  ],
  server: {
    host: '0.0.0.0',
    port: 5173,
    strictPort: false,
  },
})

Then access at: http://localhost:5173

Port Forwarding

• 8000 - Laravel development server
• 5173 - Vite development server