
Aprende Laravel Livewire desde cero
0%
47 lecciones 4h 30m
En esta serie aprenderemos los fundamentos de Livewire que nos permitirán crear aplicaciones interactivas en Laravel utilizando poco o nada de Javascript.
FREE
01:571. Presentación del curso de Livewire desde cero
En este video te muestro lo que vamos a aprender a construir con Livewire durante el curso.
FREE
06:282. Qué es y cómo funciona Livewire
En esta lección aprendemos qué es Livewire y cómo nos facilita la construcción de aplicaciones interactivas en Laravel utilizando poco o nada de Javascript.
FREE
01:483. Cómo instalar Livewire
En esta lección aprendemos a instalar Livewire y a configurarlo para que los assets se mantengan siempre actualizados.
FREE
04:284. Cómo crear y renderizar componentes de Livewire
En esta lección aprendemos las diferentes opciones que tenemos disponibles para crear y renderizar componentes de Laravel Livewire
PRO
07:305. Cómo utilizar propiedades en los componentes de Livewire
En esta lección revisamos las diferentes opciones para definir y modificar componentes de Livewire y también configuramos una plantilla que nos permita retornar componentes directamente desde las rutas.
PRO
08:376. Data Binding en Livewire
En esta lección aprendemos qué es y cómo funciona el Data Binding en Livewire
PRO
06:057. Insertar registros con Livewire
En esta lección aprendemos a insertar registros, redireccionar usuarios y mostrar mensajes de sesión con Laravel Livewire
PRO
05:288. Validación en tiempo real con Livewire
En esta lección aprendemos a validar formularios de forma tradicional y en tiempo real con Livewire, y a mostrar los errores en las vistas.
PRO
04:269. Route model binding en Livewire
En esta lección vemos cómo utilizar route model binding y modelos como propiedades en componentes de Livewire
PRO
04:0210. Modelos como propiedades de componentes de Livewire
En esta lección aprovechamos definir un modelo como propiedad para simplificar la creación y reutilización de formularios con Livewire.
PRO
07:4311. Cómo testear componentes de Livewire
En esta lección testeamos la creación de artículos con sus reglas de validación en tiempo real definidas en el componente ArticleForm de Laravel Livewire
PRO
08:3212. Cómo testear componentes de blade de Livewire
En esta lección continuamos testeando el componente ArticleForm para asegurarnos de que funciona tanto para crear como para editar artículos.
PRO
07:4613. Utilizando TDD con Livewire
En esta lección utilizaremos TDD (Test Driven Development) para que nos guíe mientras agregamos otro campo al formulario de crear y editar artículos.
PRO
03:4514. Generación de slugs en tiempo real con Livewire
En esta lección implementamos la funcionalidad de crear un slug automáticamente y en tiempo real, partiendo del título que ingresa el usuario.
PRO
06:3415. Cómo utilizar middlewares con Livewire
En esta lección evitamos que los usuarios no autenticados accedan al componente de Livewire que contiene el formulario para crear y editar artículos.
PRO
08:1416. Sistema de autenticación con Livewire
En esta lección exploramos las diferentes opciones que tenemos disponibles para implementar la autenticación con Livewire, al finalizar tendremos listo el stack TALL para continuar con el desarrollo.
PRO
11:5617. Estilizando el formulario con TailwindCSS
En esta lección utilizamos y entendemos los componentes de blade que nos provee Jetstream para mejorar el diseño del formulario de crear y editar artículos.
PRO
10:4818. Cómo integrar Trix con Livewire y Alpine.js
En esta lección vemos una pequeña introducción de Alpine.js y aprendemos a crear un componente reutilizable con el editor de contenido HTML llamado Trix.
PRO
05:4919. Cómo subir archivos con Livewire
En esta lección agregamos un campo de archivo al formulario que nos permita asociar una imagen a un artículo.
PRO
09:5920. Como testear la subida de archivos en Livewire
En esta lección verificamos mediante test que las imágenes se suben correctamente al servidor y que se reemplacen al momento de actualizarlas.
FREE
05:1321. Validación de archivos Livewire
En esta lección aprendemos a testear la validación de la subida de archivos con Livewire utilizando TDD.
PRO
07:1822. Estilizando el selector de imágenes con Tailwind
En esta lección mostramos una previsualización de la imagen seleccionada en tiempo real y agregamos unos estilos con Tailwind CSS
PRO
05:1123. Selector de imágenes reutilizable
En esta lección extraemos la lógica de seleccionar y previsualizar la imagen a un componente de blade que podamos reutilizar.
PRO
05:5924. Mejorando la accesibilidad del selector de imágenes
En esta lección permitimos navegar por el campo imagen a través de tabs para mejorar la accesibilidad del formulario de creación y edición de artículos.
PRO
03:0625. Corrigiendo errores en el formulario
En esta lección corregimos un bug que tenemos al momento de editar un artículo y actualizamos los assets de Livewire.
PRO
07:0426. Componente select re-utilizable
En esta lección creamos un componente reutilizable que nos permita seleccionar una categoría y asociarla a un artículo.
PRO
01:5527. Validación de relaciones con Livewire
En esta lección nos aseguramos de que la categoría sea obligatoria y que exista en la base de datos al momento de crear o actualizar un artículo
PRO
06:0228. Ventanas modales con Jetstream y Livewire
En esta lección entendemos el funcionamiento básico de las ventanas modales que nos trae Jetstream utilizando Livewire
PRO
06:5329. Modal para crear categorías
En esta lección creamos el formulario para crear una categoría sin necesidad de abandonar el formulario de creación de artículos.
PRO
08:4930. Validación del formulario dentro del modal
En esta lección agregamos las reglas de validación de las categorías para que solo se apliquen al formulario dentro del modal
PRO
03:1331. Modal de confirmación
En esta lección agregamos un botón para eliminar un artículo, que muestre un modal de confirmación antes de realmente eliminarlo.
FREE
04:0332. Cómo testear la eliminación de imágenes
En esta lección verificamos que al momento de eliminar un artículo, se elimine también su imagen asociada.
PRO
04:3333. Links de navegación en Jetstream
En esta lección reestructuramos las rutas del dashboard y agregamos los links de navegación.
PRO
07:4534. Diseñando la tabla de datos con Tailwind CSS
En esta lección utilizamos Tailwind CSS para mejorar el aspecto de la tabla de artículos de la administración.
PRO
02:1335. Actualizando a Laravel 9 (Livewire)
En esta lección hacemos la actualización de Laravel 9 en nuestra aplicación de Livewire.
PRO
02:4936. Imagen por defecto para los artículos
En esta lección agregamos un placeholder para las imágenes en caso de que un artículo no contenga imagen.
PRO
02:4737. Paginación de registros con Livewire
En esta lección agregamos los links de paginación a la tabla de artículos y lo adaptamos al diseño que ya tenemos.
PRO
06:3838. Como utilizar eventos en Livewire
En esta lección extraemos la funcionalidad de eliminar artículos para que lo podamos reutilizar en el futuro.
PRO
05:1939. Componentes anidados en Livewire
En esta lección reutilizamos el componente del modal para eliminar artículos y explicamos porqué es necesario agregar una llave a los componentes anidados.
PRO
04:3640. Mensajes de sesión con Livewire y Jetstream
En esta lección aprendemos a utilizar y modificar el componente de mensajes de sesión que nos provee Laravel Jetstream.
PRO
05:2241. Cómo ordenar datos de una tabla con Livewire
En esta lección implementaremos la funcionalidad de ordenar los artículos al darle click a cualquiera de los encabezados de la tabla.
FREE
08:1142. Actualizando a Laravel 10
En esta lección instalamos el repositorio de la aplicación y aprendemos cómo utilizar diferentes versiones de PHP para actualizar las versiones de Laravel
FREE
02:3843. Actualizando la versión de Jetstream
En esta lección actualizamos paso a paso la versión de Laravel Jetstream que estamos utilizando en nuestra aplicación.
FREE
04:1744. Instalando Vite con Jetstream
En esta lección quitamos el compilador de assets Laravel Mix, que ya no se utiliza, y lo reemplazamos por Vite.
FREE
06:5645. Actualizando Livewire a la versión 3
En esta lección seguimos los pasos de actualización de Livewire utilizando el comando de actualización.
PRO
03:5646. Actualizando Livewire a la versión 3 - Parte II
En esta lección continuamos con la actualización a Livewire 3 corrigiendo errores en el formulario de creación de artículos.
PRO
05:4947. Actualizando Livewire a la versión 3 - Parte III
En esta lección culminamos la actualización de la versión 3 de Livewire y también actualizamos a la versión 4 de Jetstream