[라라벨] @section('stlye')과 <style></style>의 차이

어느날 갑자기 이 차이가 궁금해졌다..!

그래서 알아보았습니다!

 

Blade의 @section을 사용할 이유
유지보수성, 확장성을 높이기 위해

 

출처 https://drawingsof.com/at-sign-symbol/

그냥 <style></style> 태그를 직접 사용해서 스타일을 작성할 수도 있습니다. 

하지만, Blade 템플릿에서 @section('style')과 같은 구조를 사용하는 이유는 유지보수성과 확장성 때문입니다. 

아래에서 이를 비교하고, 언제 각각을 사용하는 것이 적절한지 설명드리겠습니다.

레이아웃 템플릿에서 @yield('style') 위치를 미리 정의하면, 

다양한 하위 템플릿에서 해당 영역에만 필요한 스타일을 삽입할 수 있습니다.
이렇게 하면 중앙 집중적으로 관리가 가능해지고, 스타일을 관리하는 구조가 일관성 있게 유지됩니다.

 

템플릿 구조와 통합

Laravel의 Blade 템플릿은 코드와 뷰를 분리하기 위한 도구입니다. 

@section('style')은 이 구조를 유지하면서 스타일을 추가하는 데 적합합니다.
이는 큰 프로젝트에서 팀 협업 시 특히 중요합니다.

다이나믹 스타일링 가능

Blade의 @section을 사용하면, PHP 변수나 조건문을 활용해 동적으로 스타일을 조정할 수 있습니다.

@section('style')
<style>
    body {
        background-color: {{ $isDarkMode ? 'black' : 'white' }};
    }
</style>
@endsection

<style> 태그를 직접 사용할 때

직접 <style></style>을 사용하는 것이 더 간단한 경우도 있습니다:
작은 프로젝트나 단일 뷰 파일에서
템플릿 분리가 필요 없는 작은 프로젝트에서는 간단히 <style> 태그를 쓰는 것이 효율적입니다.

<style>
    body {
        background-color: lightblue;
    }
</style>

 

 

단점 비교

<style> 태그 직접 사용
- 스타일이 중구난방으로 작성될 가능성이 커지고, 유지보수가 어렵습니다.
- 다양한 템플릿에서 동일한 구조를 유지하려면 복잡해질 수 있습니다.

@section 사용
- 작은 프로젝트나 단순한 뷰 파일에서는 불필요하게 복잡해 보일 수 있습니다.
- 새로운 개발자가 Blade의 구조를 모르면 헷갈릴 수 있습니다.

 

결론

- 작은 규모 : <style></style>을 사용하면 간단하고 빠릅니다.
- 중/대규모 프로젝트 : @section('style')을 사용해 구조화된 코드를 유지하는 것이 장기적으로 효율적.
Blade의 @section은 단순히 스타일 작성 외에도 템플릿의 일관성 유지와 코드 재사용성을 위한 도구임