Starter Kits
Introduction
새로운 Laravel 애플리케이션을 빠르게 시작할 수 있도록, Laravel은 인증 및 애플리케이션 스타터 키트를 제공합니다. 이 키트들은 회원가입과 인증에 필요한 라우트, 컨트롤러, 뷰 등을 자동으로 프로젝트에 구성해 줍니다.
물론 이 스타터 키트들은 사용이 필수는 아닙니다. 깔끔하게 Laravel을 설치해서 처음부터 직접 애플리케이션을 만들어도 좋습니다. 어떤 방법을 선택하든, 멋진 결과를 만들어내실 거라 믿습니다!
Laravel Breeze
Laravel Breeze는 Laravel의 authentication features 전반(로그인, 회원가입, 비밀번호 재설정, 이메일 인증, 비밀번호 확인 등)을 간단하고 최소한의 형태로 구현한 스타터 키트입니다. 또한 Breeze에는 사용자가 이름, 이메일 주소, 비밀번호를 수정할 수 있는 "프로필" 페이지도 포함되어 있습니다.
Laravel Breeze의 기본 뷰 레이어는 간단한 Blade templates로 구성되며, Tailwind CSS로 스타일링되어 있습니다. 또한, Breeze는 Livewire 또는 Inertia를 기반으로 Vue 혹은 React를 사용할 수 있는 다양한 스캐폴딩 옵션도 제공합니다.
Laravel Bootcamp
Laravel이 처음이라면 Laravel Bootcamp에 바로 도전해 보십시오. Laravel Bootcamp는 Breeze를 활용해 처음으로 Laravel 애플리케이션을 만드는 과정을 단계별로 안내합니다. Laravel과 Breeze의 핵심 기능을 한눈에 살펴볼 수 있는 좋은 방법입니다.
Installation
먼저, create a new Laravel application하고 데이터베이스를 설정한 뒤, database migrations을 실행해야 합니다. 새로운 Laravel 애플리케이션을 준비했다면, Composer를 이용해 Laravel Breeze를 설치할 수 있습니다:
composer require laravel/breeze --dev
Composer로 Laravel Breeze 패키지를 설치한 후에는 breeze:install 아티즌 명령어를 실행할 수 있습니다. 이 명령어는 인증 뷰, 라우트, 컨트롤러 등 여러 리소스를 애플리케이션에 퍼블리시합니다. Breeze는 모든 코드를 여러분의 프로젝트로 복사하기 때문에, 기능과 구현을 완전히 직접 관리하고 확인할 수 있습니다.
breeze:install 명령어를 실행하면, 선호하는 프론트엔드 스택과 테스트 프레임워크를 선택하라는 안내가 표시됩니다:
php artisan breeze:install
php artisan migrate
npm install
npm run dev
Breeze and Blade
Breeze의 기본 "스택"은 Blade 스택으로, Blade templates을 이용해 프론트엔드를 렌더링합니다. 단순하게 breeze:install 명령어를 아무 인자 없이 실행하고 Blade 프론트엔드 스택을 선택하면 설치할 수 있습니다. Breeze의 스캐폴딩을 마친 후에는 프론트엔드 에셋도 반드시 컴파일해야 합니다:
php artisan breeze:install
php artisan migrate
npm install
npm run dev
이제 웹 브라우저에서 /login 또는 /register URL로 이동해 직접 Breeze에서 제공하는 인증 페이지들을 확인할 수 있습니다. Breeze의 모든 라우트는 routes/auth.php 파일에 정의되어 있습니다.
애플리케이션의 CSS 및 JavaScript를 컴파일하는 방법에 대해 더 알고 싶으시다면, Laravel의 Vite documentation를 참고하세요.
Breeze and Livewire
Laravel Breeze는 Livewire 스캐폴딩도 제공합니다. Livewire는 순수 PHP만으로 동적이고 반응형인 프론트엔드 UI를 쉽게 개발할 수 있는 강력한 도구입니다.
Livewire는 주로 Blade 템플릿을 사용하는 팀이, Vue나 React 같은 자바스크립트 기반 SPA 프레임워크보다 더 단순한 대안을 찾을 때 특히 잘 어울립니다.
Livewire 스택을 선택하려면 breeze:install 아티즌 명령어를 실행할 때 Livewire 프론트엔드 스택을 선택하면 됩니다. 스캐폴딩이 완료된 후엔 데이터베이스 마이그레이션을 진행해야 합니다:
php artisan breeze:install
php artisan migrate
Breeze and React / Vue
Laravel Breeze는 Inertia 프론트엔드 구현을 통해 React 및 Vue 기반 스캐폴딩도 지원합니다. Inertia를 활용하면, 익숙한 서버 사이드 라우팅과 컨트롤러 방식 그대로, 최신의 싱글 페이지 React 또는 Vue 애플리케이션을 개발할 수 있습니다.
Inertia를 통해 React, Vue의 프론트엔드 개발 효율성과 Laravel의 강력한 백엔드, 그리고 Vite로 인한 빠른 컴파일 속도를 동시에 누릴 수 있습니다. Inertia 스택을 사용하려면 breeze:install을 실행할 때 Vue 또는 React 프론트엔드 스택을 선택하면 됩니다.
Vue나 React를 선택하면 Breeze 설치기는 Inertia SSR이나 TypeScript 지원 여부도 함께 설정할 수 있도록 안내합니다. 스캐폴딩이 마무리되면 프론트엔드 에셋도 반드시 컴파일해야 합니다:
php artisan breeze:install
php artisan migrate
npm install
npm run dev
이후 웹 브라우저에서 /login 또는 /register 페이지로 접속하시면 됩니다. Breeze에서 정의된 모든 라우트는 routes/auth.php 파일에 있습니다.
Breeze and Next.js / API
Laravel Breeze는 Next, Nuxt 등과 같은 현대적인 자바스크립트 애플리케이션에서 인증할 수 있는 API 스캐폴딩도 제공합니다. 시작하려면 breeze:install 명령어를 실행할 때 원하는 스택으로 API 스택을 선택해 주세요:
php artisan breeze:install
php artisan migrate
설치 과정에서 Breeze는 애플리케이션의 .env 파일에 FRONTEND_URL 환경 변수를 추가합니다. 이 URL에는 여러분이 사용 중인 자바스크립트 애플리케이션의 주소를 입력해야 합니다. 보통 로컬 개발 환경에서는 http://localhost:3000이 될 것입니다. 또한, APP_URL이 http://localhost:8000으로 설정되어 있는지 반드시 확인하세요. 이는 serve 아티즌 명령어가 사용하는 기본 URL입니다.
Next.js Reference Implementation
이제 백엔드와 원하는 프론트엔드를 연동할 준비가 끝났습니다. Breeze 프론트엔드의 Next.js 레퍼런스 구현체는 available on GitHub. 이 프론트엔드는 Laravel에서 공식적으로 관리하며, 기존의 Blade 및 Inertia 스택과 동일한 사용자 인터페이스를 제공합니다.
Laravel Jetstream
Laravel Breeze가 간단하고 최소한의 프로젝트 시작점을 제공한다면, Jetstream은 여기에 더 강력한 여러 기능과 다양한 프론트엔드 스택을 결합해줍니다. Laravel을 처음 접하셨다면, 먼저 Laravel Breeze로 입문하시고 이후에 Jetstream을 활용해보는 것을 추천합니다.
Jetstream은 멋지게 디자인된 애플리케이션 스캐폴딩을 제공하며, 로그인, 회원가입, 이메일 인증, 2단계 인증, 세션 관리, Laravel Sanctum을 통한 API 지원, 팀 관리(선택적) 등 다양한 기능을 포함합니다. Jetstream은 Tailwind CSS를 활용해 디자인되었으며, Livewire 혹은 Inertia 기반 프론트엔드 스캐폴딩 중에서 선택할 수 있습니다.
Laravel Jetstream의 설치에 관한 자세한 안내는 official Jetstream documentation에서 확인할 수 있습니다.