Posicionar elementos en un Grid Layout usando áreas

En esta lección te enseñaré una manera más intuitiva de posicionar los elementos en nuestras GRID Layout, sin necesidad de indicar los números de las líneas del GRID.

Regístrate para ver ésta y cientos de lecciones exclusivas.

Cómo posicionar elementos en un Grid Layout

En esta lección te enseñaré cómo crear un Grid Layout y posicionar elementos contenidos dentro de éste, con las propiedades que nos brinda CSS Grid.

Regístrate para ver ésta y cientos de lecciones exclusivas.

Paquete laravel/ui en Laravel 6

Uno de los primeros pasos que frecuentemente hacemos cuando instalamos un proyecto de Laravel es configurar el frontend para el registro y autenticación de usuarios de la aplicación, usando lo que viene por defecto en el framework. Sin embargo, en Laravel 6 cuando ejecutamos el comando php artisan make:auth nos dice que el comando no está definido (Command «make:auth» is not defined). Así que en este tutorial hablaremos con detalle de este cambio en el framework y cómo podemos volver a tener esta funcionalidad en la aplicación.
Ver post

Cómo instalar paquetes con npm en Laravel

npm

Cuando trabajamos con JavaScript existen diversas formas de incorporar paquetes en nuestro proyecto, por ejemplo utilizando un CDN, descargando la librería y agregándola a nuestra plantilla o compilando los archivos CSS y JS directamente en nuestros archivos principales dentro de la plantilla. De esta última alternativa trataremos en este tutorial.

Ver post

Personalizar Bootstrap 4 en Laravel con Sass y npm

Banner Personalizar Bootstrap

Continuando con la personalización de Bootstrap dentro de Laravel quisiera mostrarles una segunda forma de hacerlo, la cual requiere tener conocimientos en el manejo de Sass ya que Bootstrap 4 lo utiliza como preprocesador CSS. Existen numerosas ventajas al utilizar esta herramienta como por ejemplo la re-utilización de código y la mejor organización de las hojas de estilo lo que permite que nuestro proyecto escale de mejor forma. Veamos cómo trabajar de esta manera:

Ver post

Browsersync, una herramienta para mejorar el flujo del desarrollo frontend

Mix + BrowserSync

A través del tiempo hemos usado diferentes herramientas para ser más productivos en nuestro desarrollo web o de aplicaciones, un ejemplo de estas herramientas es npm con sus opciones para compilar y generar assets al momento de hacer un cambio en nuestros archivos (el famoso npm run watch), útil ya que de otra forma tendríamos que tipear el comando npm run cada vez que realicemos un cambio en nuestro código.

Hoy vengo a compartir una herramienta maravillosa llamada Browsersync que nos permitirá ahorrar bastante tiempo cuando estemos desarrollando.

Ver post

Suscríbete a nuestro boletín

Te enviaremos publicaciones con consejos útiles y múltiples recursos para que sigas aprendiendo.

Recibe consejos útiles y múltiples recursos directamente en tu correo