PHP + Laravel + Vite + Node.js 개발환경 완전 설정 가이드

1. PHP 8.2 설치

Windows 환경에서 가장 권장되는 방법은 Laravel Herd (무료 버전) 또는 XAMPP를 사용하는 것입니다.

방법 A: Laravel Herd (권장)

Herd는 PHP, Nginx, Node.js, Composer를 한 번에 설치해주는 macOS/Windows 전용 도구입니다.

1. https://herd.laravel.com 에서 설치
2. PHP 버전 선택: Herd → Settings → PHP → 8.2
3. 자동으로 PATH에 php, composer, laravel 명령어가 추가됨

# 확인
php --version     # PHP 8.2.x
composer --version  # 2.x.x

방법 B: XAMPP + Composer 수동 설치

# 1. XAMPP 8.2.x 설치 후 PHP 경로를 환경 변수에 추가
set PATH=%PATH%;C:\xampp\php

# 2. Composer 설치 (https://getcomposer.org/Composer-Setup.exe)
# PHP 경로: C:\xampp\php\php.exe

# 3. 설치 확인
php --version
composer --version

2. Composer 핵심 명령어

composer install          # composer.lock 기준 설치
composer update           # 최신 버전으로 업데이트
composer require [패키지]   # 패키지 추가
composer dump-autoload    # autoload 재생성 (클래스 못 찾을 때)
composer clear-cache      # 캐시 초기화

3. Laravel 프로젝트 생성

# 최신 Laravel 설치
composer create-project laravel/laravel myproject
cd myproject

# 또는 Laravel Installer 사용 (Herd에 포함)
laravel new myproject

# 개발 서버 시작
php artisan serve
# → http://localhost:8000

# 자주 쓰는 artisan 명령어
php artisan route:list          # 라우트 목록
php artisan config:clear        # 설정 캐시 초기화
php artisan cache:clear         # 애플리케이션 캐시 초기화
php artisan view:clear          # 뷰 캐시 초기화
php artisan optimize:clear      # 전체 캐시 초기화

4. Node.js & Vite 설정

Laravel의 프론트엔드 빌드는 Vite가 담당합니다. Node.js 20 LTS 이상을 설치합니다.

# Node.js 설치 확인
node --version    # 20.x 이상
npm --version     # 10.x 이상

# 패키지 설치
npm install

# 개발 서버 (변경사항 자동 반영)
npm run dev

# 프로덕션 빌드
npm run build

# vite.config.js 기본 구조
import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';

export default defineConfig({
    plugins: [
        laravel({
            input: ['resources/scss/app.scss', 'resources/js/app.js'],
            refresh: true,
        }),
    ],
    css: {
        preprocessorOptions: {
            scss: {
                // SCSS 전역 변수 자동 주입
                additionalData: '@use "resources/scss/_variables.scss" as *;'
            }
        }
    }
});

5. 로컬 도메인 설정 (예: myapp.test)

Herd를 사용한다면 프로젝트 폴더를 ~/Herd 안에 넣으면 자동으로 폴더명.test 도메인이 생성됩니다.

# Herd 사용 시 (자동 설정)
~/Herd/myproject → http://myproject.test (자동)

# 수동 설정 (hosts 파일)
# C:\Windows\System32\drivers\etc\hosts
127.0.0.1  myproject.test

# Nginx 가상 호스트 설정
server {
    listen 80;
    server_name myproject.test;
    root /path/to/myproject/public;
    index index.php;
    location / { try_files $uri $uri/ /index.php?$query_string; }
    location ~ \.php$ { fastcgi_pass 127.0.0.1:9000; include fastcgi_params; }
}

6. .env 핵심 설정

APP_NAME=MyProject
APP_ENV=local
APP_KEY=   # php artisan key:generate 로 자동 생성
APP_DEBUG=true
APP_URL=http://myproject.test

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=mydb
DB_USERNAME=root
DB_PASSWORD=

# 메일 (로컬 테스트용)
MAIL_MAILER=log
# 실서비스: smtp, MAIL_HOST=smtp.gmail.com 등

# 캐시/세션 (로컬)
CACHE_STORE=file
SESSION_DRIVER=file

# 프로덕션에서는 반드시 변경
APP_ENV=production
APP_DEBUG=false
CACHE_STORE=redis
SESSION_DRIVER=redis