Laravel 의 프론트 스택 - Blade (1)

프론트엔드 로직까지 다 맡아야 하는 개발자 입장에서는 프론트에 어떤 기술을 쓰는 지도 매우 중요할 겁니다.

왜냐면 라라벨을 포함한 고전적인 서버사이드 기반 웹애플리케이션에서는 프론트와 백엔드는 밀접히 연관되어 있어 따로 분리하여 개발하기 어렵거든요.

특히 php같은 경우에는 언어 자체가 템플릿 엔진처럼 사용이 되다보니까 더욱 그런데요.

라라벨은 또 blade 라는 자신만의 템플릿 엔진을 갖고있습니다.

처음에는 php 자체가 템플릿 언어인데 뭔 또 템플릿 엔진을 따로 쓰고 있냐라고 생각할 수 있는데 사용해보니까 꽤 편하더라구요.

웹에서 템플릿 엔진이란 html 코드에 프로그래밍 언어를 삽입해서 데이터 렌더링을 하는 기술을 말합니다.

 

예를 들면 아래와 같이 php 변수를 출력할 수 있습니다.

<div>{{ $title }}</div>

출력할 때 XSS 공격을 방지하기 위해 자동으로 htmlspecialchars함수를 적용한다고 합니다.

 

그리고 우리가 자주 쓰는 for문도 있는데요.

@foreach ($list as $content)
    <p>{{ $content->title }}</p>
@endforeach

 

이렇게 보면 그냥 php 쓰는거랑 별반 다를게 없지 않냐 라고 하실 수 있는데요.

그 외에도 다른 기능들이 많이 포함되어 있습니다.

예를 들면 게시글 갯수가 0일 때는 다른 화면을 보여줘야 할 때가 있습니다.

그러면 우리는 또 조건문을 추가해서 예외처리를 해야겠죠.

그런데 blade에서는 아래와 같이 깔끔하게 작성할 수 있습니다.

 

@forelse ($list as $content)
    <p>{{ $content->title }}</p>
@empty
    <p>게시글이 없습니다.</p>
@endforelse

 

그리고 또 가끔은 반복문에서 첫 루프에서만 뭔가를 실행하고 싶을 때가 있습니다.

그러면 우리는 또 count 변수를 만들어서 카운팅을 해야겠죠.

하지만 blade에 foreach 문에서는 이를 자동으로 카운팅 해줍니다.

 

@foreach ($list as $content)
    @if ($loop->first)
        첫 루프에서만 뭔가를 하고싶습니다.
    @endif
    
    <p>{{ $content->title }}</p>
@endforeach

 

그리고 우리가 <select> 박스안에 어떤 <option>이 선택되어 있는지를 렌더링 해야 할 때 매번 조건부를 달아서 "selected"를 출력해줘야 하는데요. @selected 지시문을 이용해 간편하게 작성할 수 있습니다.

 

@foreach ($list as $content)
    <option value="{{ $content->title }}" @selected($content->title == $selectedTitle)>
        {{ $content->title }}
    </option>
@endforeach

 

그 외에도 로그인 회원에 한해 출력하도록 하는 @auth 지시문

 

@auth
   로그인 했을 경우 코드
@endauth

 등 다양한 기능들이 깨알같이 있어 공식문서에서 찾아보시면 작업에 많이 도움이 되실 겁니다.

그냥 php코드로 짜는 것보다 코드량이 많이 적어진다 이런 느낌까지는 아니지만 뭔가 더 깔끔해서 가독성이 좋고 개발자로 하여금 비지니스 로직에 더 집중할 수 있게끔 하는 것도 하나의 메리트라고 할 수 있겠네요.

 

다음 블레이드 2편에서는 컴포넌트에 대해 다뤄보겠습니다.

감사합니다.