라라벨 - 뷰: 초보자 가이드

안녕하세요, 미래의 라라벨 개발자 여러분! 오늘은 라라벨의 가장 흥미로운 부분 중 하나인 뷰에 대해 배울 것입니다. 코드를 작성한 적이 없어도 걱정하지 마세요; 단계별로 안내해 드리겠습니다. 이 튜토리얼이 끝나면, 프로처럼 아름다운 웹 페이지를 만들 수 있을 것입니다!

Laravel - Views

뷰는 무엇인가요?

라라벨의 뷰는 애플리케이션의 예쁜 얼굴과도 같습니다. 사용자가 웹사이트를 방문할 때 실제로 보는 부분을 담당합니다. 뷰를 HTML 템플릿으로 생각해 보세요. 데이터를 사용자 친화적인 방식으로 표시하는 역할을 합니다.

첫 번째 뷰 만들기

간단한 예제로 시작해 보겠습니다. 웹사이트에 환영 페이지를 만들고 싶다고 가정해 봅시다. 이렇게 하면 됩니다:

  1. 라라벨 프로젝트의 resources/views 디렉토리로 이동합니다.
  2. welcome.blade.php라는 새 파일을 생성합니다.
  3. 다음 코드를 추가합니다:
<!DOCTYPE html>
<html>
<head>
<title>Welcome to My Site</title>
</head>
<body>
<h1>Hello, World!</h1>
<p>Welcome to my awesome Laravel website.</p>
</body>
</html>

이것은 기본적인 HTML 구조와 따뜻한 환영 메시지입니다. .blade.php 확장자는 라라벨이 블레이드 템플릿 엔진을 사용하도록 알립니다. 나중에 블레이드에 대해 더 깊이 탐구해 보겠습니다.

뷰 렌더링

이제 뷰가 준비되었으니, 누군가가 우리 웹사이트를 방문할 때 이를 표시하도록 합시다. routes/web.php 파일에 다음 코드를 추가합니다:

Route::get('/', function () {
return view('welcome');
});

이 코드는 "누군가가 홈페이지를 방문할 때 'welcome' 뷰를 표시하라"고 라라벨에게 알립니다.

뷰에 데이터 전달

뷰는 좋지만, 데이터를 동적으로 삽입할 수 있을 때 진정으로 강력해집니다. 어떻게 하는지 살펴보겠습니다.

간단한 데이터 전달

환영 메시지를 개인화하고 싶다면 이렇게 데이터를 전달할 수 있습니다:

Route::get('/', function () {
$name = "Sarah";
return view('welcome', ['name' => $name]);
});

이제 welcome.blade.php 파일을 업데이트하여 데이터를 사용합니다:

<!DOCTYPE html>
<html>
<head>
<title>Welcome to My Site</title>
</head>
<body>
<h1>Hello, {{ $name }}!</h1>
<p>Welcome to my awesome Laravel website.</p>
</body>
</html>

{{ $name }} 문법은 블레이드가 데이터를 출력하는 방식입니다. 이제 페이지를 방문하면 "Hello, Sarah!" 대신 "Hello, World!"가 표시됩니다.

여러 변수 전달

필요한 만큼 많은 변수를 전달할 수 있습니다. 몇 가지 더 추가해 보겠습니다:

Route::get('/', function () {
$data = [
'name' => "Sarah",
'age' => 28,
'hobbies' => ['reading', 'coding', 'hiking']
];
return view('welcome', $data);
});

그리고 뷰를 업데이트합니다:

<!DOCTYPE html>
<html>
<head>
<title>Welcome to My Site</title>
</head>
<body>
<h1>Hello, {{ $name }}!</h1>
<p>Welcome to my awesome Laravel website.</p>
<p>You are {{ $age }} years old.</p>
<p>Your hobbies are:</p>
<ul>
@foreach($hobbies as $hobby)
<li>{{ $hobby }}</li>
@endforeach
</ul>
</body>
</html>

여기서 @foreach 블레이드 디렉티브를 사용하여 호비 배열을 반복합니다. 블레이드는 데이터를 뷰에서 매우 쉽게 처리할 수 있도록 도와줍니다!

모든 뷰에 데이터 공유

때로는 애플리케이션의 모든 뷰에서 특정 데이터를 공유하고 싶을 수 있습니다. 예를 들어, 각 페이지의 네비게이션 바에 현재 사용자의 이름을 표시하고 싶을 수 있습니다.

뷰 컴포저 사용

라라벨은 이러한 목적으로 뷰 컴포저 기능을 제공합니다. 다음과 같이 사용합니다:

  1. app/Providers/ViewServiceProvider.php 파일을 생성합니다 (기존에 존재하지 않는 경우).
  2. 다음 코드를 추가합니다:
<?php

namespace App\Providers;

use Illuminate\Support\ServiceProvider;
use Illuminate\Support\Facades\View;

class ViewServiceProvider extends ServiceProvider
{
public function boot()
{
View::composer('*', function ($view) {
$view->with('currentUser', 'John Doe');
});
}
}
  1. config/app.php 파일에서 이 провайд러를 등록합니다:
'providers' => [
// 다른 provivers...
App\Providers\ViewServiceProvider::class,
],

이제 $currentUser는 모든 뷰에서 사용할 수 있습니다!

결론

뷰는 라라벨 애플리케이션의 사용자 인터페이스의 핵심입니다. 뷰를 사용하면 프레젠테이션 로직을 비즈니스 로직에서 분리하여 코드를 깨끗하고 유지보수하기 쉽게 만들 수 있습니다. 연습이 완벽을 만들어 준다는 것을 기억하고, 다양한 레이아웃과 데이터 전달 기법을 실험해 보지 마세요!

이제 우리가 다루었던 메서드의 빠른 참조 표입니다:

메서드 설명
view('name') 뷰를 반환합니다
view('name', ['key' => 'value']) 데이터를 포함한 뷰를 반환합니다
View::composer('*', function) 모든 뷰에 데이터를 공유합니다

기쁜 코딩을 하세요, 그리고 뷰가 항상 장관이 되길 바랍니다! ?

Credits: Image by storyset