![[Laravel] blade의 기본 구조](/title-images/[Laravel] blade의 기본 구조.jpg)
[Laravel] blade의 기본 구조
라라벨 blade의 기본 구조
라라벨은 @extends 를 다양한 템플릿을 쉽게 구현할 수 있다.
php 개발자라면 include 를 사용하여 미리 정의된 top, left, right, bottom 페이지를 불러 들인 것을 기억할 것이다.
라라벨의 blade에서도 유사한 개념을 사용한다.
기본 구조
- welcome.blade.php를 보자
@extends 와 @section으로 이루진 것이 가장 기본 적인 구조이다.
php의 include의 기능이 @extends 와 유사하다.
그런데 @section이 무엇을 의미하는가 ?
먼저 @extends가 가르키는 layouts/app 파일을 보면 이해가 빠를 것인다.
@extends('layouts/app') <!--layouts/app 파일을 불러들임 -->
@section('title', 'HOME') <!--layouts/app 의 title에 값 전송 -->
@section('content')<!--layouts/app 의 content에 값 전송 -->
<div>
hellow laravel blade world..
</div>
@endsection
- layouts/app.blade.php
app.blade.php는 흔히 말하는 html의 기본적인 구조가 위치한다.
<!DOCTYPE html>
<html lang="en">
<head>
<title>@yield('title')</title><!-- welcome.blade 에서 정의한 title이 이곳에 들어 옮 -->
</head>
<body>
@yield('content') <!-- welcome.blade 에서 정의한 content가 이곳에 들어 옮 -->
</body>
</html>
카테고리별 다른 텝플릿 사용하기
기본 구조를 이해하였다면 카테고리별로 다른 텝플릿을 사용하는 것도 어렵지 않다.
현재페이지 > 카테고리 템플릿 > app.blade 를 차례로 불러오는 방식이면 족하다.
- welcome.blade.php
@extends('layouts/mycategory') <!--layouts/app 파일을 직접 호출하지 말고 mycategory 라는 blade를 불러 들이자 -->
@section('title', 'HOME')
@section('subcontent')<!--subcontent 이름을 바꾸자.. -->
<div>
hellow laravel blade world..
</div>
@endsection
- mycategory.blade.php
@extends('layouts/app') <!--layouts/app 파일을 불러들임 -->
@section('content')<!--layouts/app 의 content에 값 전송 -->
@yield('subcontent') <!-- welcome.blade.php 에서 보낸 값을 출력 -->
@endsection
- layouts/app.blade.php
기존과 동일하게 사용
이렇게 함으로서 우리는 카테고리별 레이아웃이 다르다고 해도 쉽게 템플릿을 만들어 재 사용이 가능하다.
기타 사용가능 한 주요 기능
@include
@include는 php의 인클루드와 거의 유사하게 사용가능하다.
@include('navigation')
@include('navigation', [navigation에 전송할 파라미터])
@parent
@parent를 설명하기 전에 style 이나 script에 대해 먼저 말씀을 드려야 겠네요.
- welcome.blade.php
@extends('layouts/app')
..........
@section ('styles')
<style></style> <!-- page 별 style 추가 -->
@endsection
@section ('scripts')
<script></script> <!-- page 별 script 추가 -->
@endsection
- app.blade.php
<!DOCTYPE html>
<html lang="en">
<head>
<title>@yield('title')</title>
@yield('styles') <!-- styles 출력 -->
</head>
<body>
@yield('content')
</body>
@yield('scripts') <!-- scripts 출력 -->
</html>
위처럼 하면 welcom.blade에서 정의한 style이나 script가 app.blade.php에 출력되게됩니다.
그런데 앞선 3단 예제에서 각 페이지에도 style과 script가 있고 각 category template에도 style과 script가 있을 경우 는 어떨까요.
가장 먼저 정의된 페이지별 style과 script는 적용되고 category template에 정의한 것은 무시됩니다.
이 때 부모페이지(category template)에 정의된 style과 script도 같이 출력한다는 의미로 @parent를 사용합니다.
- welcome.blade.php
@extends('layouts/app')
..........
@section ('styles')
@parent <!-- 상위 style 도 상속 받겠다 -->
<style></style>
@endsection
@section ('scripts')
@parent
<script></script> <!-- 상위 script 도 상속 받겠다 -->
@endsection