06. Curso de Laravel

06.-Laravel Tutorial en Español [blade avanzado] ¡¡En tiempo récord⚡!!

INTRODUCCIÓN

En este curso vamos a utilizar funciones avanzadas de blade

PROCEDIMIENTOS

1.- En el archivo routes/web.php agregaremos este código:

// Dentro de la ruta lista podemos recibir opcionalmente el parametro nombre
Route::get('lista/{nombre?}', function ($nombre=null) {
 // Arreglo de productos
 $productos=['mesas','sillas','manteles'];
 //Llamamos a la vista productos y le pasamos los parametros productos y nombre
 return view('lista',array('productos' => $productos,'nombre' => $nombre ));
})->name('lista');

2.- En la carpeta resources/views  creamos el archivo master.blade.php  (Si no lo hemos creado) donde colocamos este codigo:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <meta name="description" content=""/>
    <meta name="author" content=""/>
    <title>Starter Template for Bootstrap</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css"/>
    <style> body {padding-top: 50px;} .starter-template {padding: 40px 15px;text-align: center;} </style>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <!-- blade sustituye esto por todo lo que este en @ section('titulo') -->
            <a class="navbar-brand" href="#">@yield('titulo')</a>
            
        </div>
        <div class="collapse navbar-collapse">
            <ul class="nav navbar-nav">
                <li class="active"><a href="#">Home</a></li>
                <!-- blade genera un link hacia las rutas -->
                <li><a href="{{ route('noticias') }}">Noticias</a></li>
                <li><a href="{{ route('blog') }}">Blog</a></li>
            </ul>
        </div>
    </div>
</nav>
<div class="container">
    <div class="row">
        <div class="starter-template">
            @yield('contenido')
            <p><a href="http://getbootstrap.com/getting-started/">http://getbootstrap.com/getting-started/</a></p>
        </div>
    </div>
</div>
<script src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
</body>
</html>

3.- En la carpeta resources/views creamos el archivo lista.blade.php al que el vamos a poner este codigo:

<!-- Jalamos la plantilla master.blade.php -->
@extends('master')
<!-- Sustituimos @ yield('titulo') por este contenido -->
@section('titulo')
 Lista
@endsection

<!-- Sustituimos @ yield('contenido') por este contenido -->
@section('contenido')
 <!-- Ciclo que lee la lista de productos y los muestra en un link -->
 @foreach($productos as $producto)
  <a href="{{ route('lista',$producto) }}" class="btn btn-primary">{{ $producto }}</a>
 @endforeach
 <!-- Si el nombre del producto no esta vacio -->
 @if(!empty($nombre))
  <!-- Muestra un texto con el nombre de ese producto -->
  @switch($nombre)
   @case($nombre=='mesas')
    <h1>Caracteristicas de {{ $nombre }} </h1>
    <p>     
     <strong>{{ $nombre }}</strong>Fusce fermentum odio nec arcu. Etiam sollicitudin, ipsum eu pulvinar rutrum, tellus ipsum laoreet sapien, quis venenatis ante odio sit amet eros. Aenean tellus metus, bibendum sed, posuere ac, mattis non, nunc.
     Donec orci lectus, aliquam ut, faucibus non, euismod id, nulla. Phasellus accumsan cursus velit. Cras non dolor.
     Aenean viverra rhoncus pede. Aenean massa. Cras varius.
    </p>
    @break
   @case($nombre=='sillas')
    <h1>Caracteristicas de {{ $nombre }} </h1>
    <p>     
     <strong>{{ $nombre }}</strong>Fusce fermentum odio nec arcu. Etiam sollicitudin, ipsum eu pulvinar rutrum, tellus ipsum laoreet sapien, quis venenatis ante odio sit amet eros. Aenean tellus metus, bibendum sed, posuere ac, mattis non, nunc.
     Donec orci lectus, aliquam ut, faucibus non, euismod id, nulla. Phasellus accumsan cursus velit. Cras non dolor.
     Aenean viverra rhoncus pede. Aenean massa. Cras varius.
    </p>
    @break
   @case($nombre=='manteles')
    <h1>Caracteristicas de {{ $nombre }} </h1>
    <p>     
     <strong>{{ $nombre }}</strong> Fusce fermentum odio nec arcu. Etiam sollicitudin, ipsum eu pulvinar rutrum, tellus ipsum laoreet sapien, quis venenatis ante odio sit amet eros. Aenean tellus metus, bibendum sed, posuere ac, mattis non, nunc.
     Donec orci lectus, aliquam ut, faucibus non, euismod id, nulla. Phasellus accumsan cursus velit. Cras non dolor.
     Aenean viverra rhoncus pede. Aenean massa. Cras varius.
    </p>
    @break
  @endswitch
 @endif

@endsection

Una respuesta a “06.-Laravel Tutorial en Español [blade avanzado] ¡¡En tiempo récord⚡!!”

  1. Alex dice:

    Siguiendo tu tutorial, muchas gracias por compartir

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Salir de la versión móvil