Views no Laravel

Tempo de leitura: 4 minutos

Views no Laravel: As Views no Laravel representam a camada de apresentação da sua aplicação (o “V” do MVC). Elas são responsáveis por gerar a interface HTML que o usuário final verá no navegador. O Laravel utiliza o Blade, um poderoso e elegante motor de templates, para permitir que você misture HTML puro com lógica de apresentação de forma segura e eficiente.

Neste artigo, exploraremos como criar Views, passar dados para elas, e como usar as principais funcionalidades do motor Blade, incluindo layouts e Componentes.

1. 📂 Criando e Localizando Views

Todas as Views do Laravel são armazenadas no diretório resources/views. Os arquivos de View devem ter a extensão .blade.php, indicando ao Laravel que o motor Blade deve processá-los.

View	Caminho do Arquivo
`welcome`	`resources/views/welcome.blade.php`
`posts.index`	`resources/views/posts/index.blade.php`

Passando Dados para a View

O Controller é o responsável por buscar os dados e enviá-los para a View.

PHP

// Controller
public function showPost()
{
    $title = 'Laravel Views';
    $version = 12;
    
    // Forma mais comum e limpa: Usando a função compact()
    return view('post.single', compact('title', 'version'));
    
    // Alternativa: Usando o array explícito
    // return view('post.single', ['title' => $title, 'version' => $version]);
}

Exibindo Dados na View (Blade)

No arquivo post/single.blade.php, você acessa as variáveis usando a sintaxe de chaves duplas:

HTML

<h1>{{ $title }}</h1>
<p>Desenvolvido na versão {{ $version }}.</p>

2. ⚙️ O Motor de Templates Blade

O Blade introduz diretivas que tornam o código de apresentação muito mais legível que o PHP puro.

A. Estruturas de Controle

Diretiva	Função	Exemplo
`@if`, `@else`, `@endif`	Condicionais	`@if ($user->isAdmin()) <h1>Admin</h1>` `@endif`
`@unless`	Condicional inversa (se não for…)	`@unless (Auth::check()) Faça Login` `@endunless`
`@foreach`, `@endforeach`	Iteração (Loops)	`@foreach ($posts as $post)` `<li>{{ $post->title }}</li>` `@endforeach`
`@empty`	Verifica se uma coleção está vazia (dentro de `@foreach`)	`@empty($posts)` `Nenhum post encontrado.` `@endempty`

B. Inclusão de Views

A diretiva @include permite reutilizar pequenos trechos de HTML.

HTML

<header>
    @include('layouts.partials.navbar')
</header>

3. 🖼️ Layouts e Herança de Templates

A Herança de Templates do Blade permite definir um Layout Mestre (estrutura da página) e estender esse layout nas Views filhas.

A. Layout Mestre (`master.blade.php`)

O layout mestre define os “espaços” que as views filhas podem preencher usando as diretivas @yield e @show.

HTML

<!DOCTYPE html>
<html>
<head>
    <title>Minha Aplicação - @yield('title', 'Padrão')</title>
</head>
<body>
    <div class="content">
        @yield('content') 
    </div>
</body>
</html>

B. View Filha (`home.blade.php`)

A View filha usa @extends para herdar o layout e @section para preencher os espaços.

HTML

@extends('layouts.master')

@section('title')
    <title>HOME | Página Inicial</title>
@endsection

@section('content')
    <h1>Bem-vindo!</h1>
    <p>Este é o conteúdo principal da página.</p>
@endsection

4. 🧩 Componentes Blade (Melhor Prática)

Componentes Blade são a forma moderna e poderosa de criar elementos de interface reutilizáveis (como botões, alertas, ou formulários complexos).

A. Criando um Componente Simples

Gere o Componente:
Bash
php artisan make:component Alert # Cria a view em resources/views/components/alert.blade.php
Defina a Estrutura (View):
HTML
<div class="alert alert-info" role="alert"> {{ $slot }} </div>

B. Usando o Componente

O componente é chamado usando a sintaxe <x-nome-do-componente>:

HTML

@section('content')
    <x-alert>
        Sua conta foi criada com sucesso!
    </x-alert>
@endsection

5. 📎 Inclusão de Assets (CSS/JS)

Seus arquivos de Assets (CSS, JavaScript, Imagens) devem ser colocados no diretório public. Para referenciá-los de forma segura e dinâmica no seu layout mestre, use a função auxiliar asset().

HTML

<link rel="stylesheet" href="{{ asset('assets/css/style.css') }}"/>

<script src="{{ asset('assets/js/script.js') }}"></script>

Nota: Usar asset() garante que o caminho base do seu projeto seja sempre referenciado corretamente, mesmo que sua aplicação esteja em um subdiretório do servidor.

✅ Conclusão Views no Laravel

Views no Laravel: As Views são a camada visual essencial no Laravel. Com o motor Blade, você pode criar interfaces dinâmicas usando estruturas de controle PHP de forma limpa e segura, graças à escapagem automática de HTML. A utilização estratégica de Herança de Templates e Componentes Blade é a melhor prática para desenvolver um front-end organizado, modular e altamente reutilizável.

Mas antes de dominar o Laravel, se for o seu caso, toda jornada tem um início. Vamos entender quais são os conhecimentos básicos necessários para aproveitar ao máximo este poderoso framework. Para iniciar seus estudos no Laravel, você precisará dominar as seguintes tecnologias: