En este tutorial exploraremos cómo mejorar la estética de nuestras interfaces utilizando Laravel y Blade, enfocándonos en el ajuste dinámico del tamaño de elementos basado en su contenido. Aprenderemos cómo desarrollar un algoritmo personalizado combinando el uso de expresiones regulares y las colecciones de Laravel para evaluar el contenido de texto y código, ajustando su tamaño para una visualización más atractiva.

Este video aumentará tus conocimientos y tu confianza en el desarrollo de algoritmos personalizados con el framework Laravel.

Esta lección incluye un video premium

Regístrate para ver este video y cientos de lecciones exclusivas.

Mira el código en GitHub: actual, resultado, comparación.

Puedes aprender más sobre el uso de Expresiones Regulares en la documentación de PHP, o si te interesa que hablemos sobre este tema déjanos un comentario y crearemos una serie para ti.

Manejo de colecciones en Laravel

Laravel incluye una poderosa clase de colecciones Illuminate\Support\Collection con la cual podemos realizar una serie de operaciones una tras otra para obtener el resultado deseado sin depender de variables temporales, ciclos, condicionales, etc. Esta manera de trabajar se conoce como el patrón Arquitectura en Pipeline, y se acerca al uso de «Programación Funcional» en PHP.

Para aprender más sobre estos temas visita:

Repaso de los métodos de colecciones de Laravel que vimos en la lección

Contenido traducido de la documentación de Laravel.

map()

El método map itera a través de la colección y pasa cada valor a una función de retorno (callback). La función de retorno es libre de modificar el elemento y devolverlo, formando así una nueva colección de elementos modificados:

$collection = collect([1, 2, 3, 4, 5]);

$multiplied = $collection->map(function ($item, $key) {
    return $item * 2;
});

$multiplied->all();

// [2, 4, 6, 8, 10]

Como la mayoría de los otros métodos de colecciones, map devuelve una nueva instancia de colección; no modifica la colección a la que se llama. Si quieres transformar la colección original, usa el método transform.

flatMap()

El método flatMap itera a través de la colección y pasa cada valor a una función de retorno (callback). La función de retorno es libre de modificar el elemento y devolverlo, formando así una nueva colección de elementos modificados. Entonces, el arreglo se aplana a un solo nivel:

$collection = collect([
    ['name' => 'Sally'],
    ['school' => 'Arkansas'],
    ['age' => 28]
]);

$flattened = $collection->flatMap(function ($values) {
    return array_map('strtoupper', $values);
});

$flattened->all();

// ['name' => 'SALLY', 'school' => 'ARKANSAS', 'age' => '28'];

flatten()

El método flatten aplana una colección multidimensional en una colección de una sola dimensión:

$collection = collect(['name' => 'taylor', 'languages' => ['php', 'javascript']]);

$flattened = $collection->flatten();

$flattened->all();

// ['taylor', 'php', 'javascript'];

Opcionalmente, puedes pasarle a la función un argumento de «profundidad»:

$collection = collect([
    'Apple' => [
        ['name' => 'iPhone 6S', 'brand' => 'Apple'],
    ],
    'Samsung' => [
        ['name' => 'Galaxy S7', 'brand' => 'Samsung']
    ],
]);

$products = $collection->flatten(1);

$products->values()->all();

/*
    [
        ['name' => 'iPhone 6S', 'brand' => 'Apple'],
        ['name' => 'Galaxy S7', 'brand' => 'Samsung'],
    ]
*/

En este ejemplo, al llamar a flatten sin proporcionar la profundidad también se aplanarían los arreglos anidados, lo que da como resultado ['iPhone 6S', 'Apple', 'Galaxy S7', 'Samsung']. Proporcionar una profundidad te permite restringir los niveles de arreglos anidados que se aplanarán.

max()

El método max devuelve el valor máximo de una clave determinada:

$max = collect([['foo' => 10], ['foo' => 20]])->max('foo');

// 20

$max = collect([1, 2, 3, 4, 5])->max();

// 5

Aprende más sobre Laravel participando en nuestra comunidad:

Únete a nuestra comunidad en Discord y comparte con los usuarios y autores de Styde, 100% gratis.

Únete hoy

Regístrate hoy en Styde y obtén acceso a todo nuestro contenido.

Lección anterior Transformar Markdown en HTML con Laravel y Blade Lección siguiente Actualización de la aplicación a Laravel 11