Aprende Laravel Livewire desde cero

En esta serie aprenderemos los fundamentos de Livewire que nos permitirán crear aplicaciones interactivas en Laravel utilizando poco o nada de Javascript.

Suscríbete para acceder a TODOS los cursos.

¡Puedes cancelar en cualquier momento!

o
Aprende Laravel Livewire desde cero

Resumen del curso

  • De principiante a experto
  • 4h 30m de video HD
  • 47 lecciones
  • Ejercicios prácticos
  • Acceso de por vida
  • Aprende a tu propio ritmo

Lecciones cortas, concisas y precisas.

No te quemes en búsquedas exhaustivas que te impiden lograr tus metas.

En Aprendible obtienes:

  • Lecciones que optimizan tu aprendizaje en menor tiempo
  • Audios y videos de alta calidad
  • Explicaciones paso a paso, sin rodeos, ni balbuceos.

Construye desde HOY tu camino como Desarrollador Web Moderno

Contenido del curso

4h 30m de contenido, 47 lecciones


1. Presentación del curso de Livewire desde cero
FREE
01:57

En este video te muestro lo que vamos a aprender a construir con Livewire durante el curso.

2. Qué es y cómo funciona Livewire
FREE
06:28

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.

3. Cómo instalar Livewire
FREE
01:48

En esta lección aprendemos a instalar Livewire y a configurarlo para que los assets se mantengan siempre actualizados.

4. Cómo crear y renderizar componentes de Livewire
FREE
04:28

En esta lección aprendemos las diferentes opciones que tenemos disponibles para crear y renderizar componentes de Laravel Livewire

5. Cómo utilizar propiedades en los componentes de Livewire
PRO
07:30

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.

6. Data Binding en Livewire
PRO
08:37

En esta lección aprendemos qué es y cómo funciona el Data Binding en Livewire

7. Insertar registros con Livewire
PRO
06:05

En esta lección aprendemos a insertar registros, redireccionar usuarios y mostrar mensajes de sesión con Laravel Livewire

8. Validación en tiempo real con Livewire
PRO
05:28

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.

9. Route model binding en Livewire
PRO
04:26

En esta lección vemos cómo utilizar route model binding y modelos como propiedades en componentes de Livewire

10. Modelos como propiedades de componentes de Livewire
PRO
04:02

En esta lección aprovechamos definir un modelo como propiedad para simplificar la creación y reutilización de formularios con Livewire.

11. Cómo testear componentes de Livewire
PRO
07:43

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

12. Cómo testear componentes de blade de Livewire
PRO
08:32

En esta lección continuamos testeando el componente ArticleForm para asegurarnos de que funciona tanto para crear como para editar artículos.

13. Utilizando TDD con Livewire
PRO
07:46

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.

14. Generación de slugs en tiempo real con Livewire
PRO
03:45

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.

15. Cómo utilizar middlewares con Livewire
PRO
06:34

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.

16. Sistema de autenticación con Livewire
PRO
08:14

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.

17. Estilizando el formulario con TailwindCSS
PRO
11:56

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.

18. Cómo integrar Trix con Livewire y Alpine.js
PRO
10:48

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.

19. Cómo subir archivos con Livewire
PRO
05:49

En esta lección agregamos un campo de archivo al formulario que nos permita asociar una imagen a un artículo.

20. Como testear la subida de archivos en Livewire
PRO
09:59

En esta lección verificamos mediante test que las imágenes se suben correctamente al servidor y que se reemplacen al momento de actualizarlas.

21. Validación de archivos Livewire
FREE
05:13

En esta lección aprendemos a testear la validación de la subida de archivos con Livewire utilizando TDD.

22. Estilizando el selector de imágenes con Tailwind
PRO
07:18

En esta lección mostramos una previsualización de la imagen seleccionada en tiempo real y agregamos unos estilos con Tailwind CSS

23. Selector de imágenes reutilizable
PRO
05:11

En esta lección extraemos la lógica de seleccionar y previsualizar la imagen a un componente de blade que podamos reutilizar.

24. Mejorando la accesibilidad del selector de imágenes
PRO
05:59

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.

25. Corrigiendo errores en el formulario
PRO
03:06

En esta lección corregimos un bug que tenemos al momento de editar un artículo y actualizamos los assets de Livewire.

26. Componente select re-utilizable
PRO
07:04

En esta lección creamos un componente reutilizable que nos permita seleccionar una categoría y asociarla a un artículo.

27. Validación de relaciones con Livewire
PRO
01:55

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

28. Ventanas modales con Jetstream y Livewire
PRO
06:02

En esta lección entendemos el funcionamiento básico de las ventanas modales que nos trae Jetstream utilizando Livewire

29. Modal para crear categorías
PRO
06:53

En esta lección creamos el formulario para crear una categoría sin necesidad de abandonar el formulario de creación de artículos.

30. Validación del formulario dentro del modal
PRO
08:49

En esta lección agregamos las reglas de validación de las categorías para que solo se apliquen al formulario dentro del modal

31. Modal de confirmación
PRO
03:13

En esta lección agregamos un botón para eliminar un artículo, que muestre un modal de confirmación antes de realmente eliminarlo.

32. Cómo testear la eliminación de imágenes
FREE
04:03

En esta lección verificamos que al momento de eliminar un artículo, se elimine también su imagen asociada.

33. Links de navegación en Jetstream
PRO
04:33

En esta lección reestructuramos las rutas del dashboard y agregamos los links de navegación.

34. Diseñando la tabla de datos con Tailwind CSS
PRO
07:45

En esta lección utilizamos Tailwind CSS para mejorar el aspecto de la tabla de artículos de la administración.

35. Actualizando a Laravel 9 (Livewire)
PRO
02:13

En esta lección hacemos la actualización de Laravel 9 en nuestra aplicación de Livewire.

36. Imagen por defecto para los artículos
PRO
02:49

En esta lección agregamos un placeholder para las imágenes en caso de que un artículo no contenga imagen.

37. Paginación de registros con Livewire
PRO
02:47

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.

38. Como utilizar eventos en Livewire
PRO
06:38

En esta lección extraemos la funcionalidad de eliminar artículos para que lo podamos reutilizar en el futuro.

39. Componentes anidados en Livewire
PRO
05:19

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.

40. Mensajes de sesión con Livewire y Jetstream
PRO
04:36

En esta lección aprendemos a utilizar y modificar el componente de mensajes de sesión que nos provee Laravel Jetstream.

41. Cómo ordenar datos de una tabla con Livewire
PRO
05:22

En esta lección implementaremos la funcionalidad de ordenar los artículos al darle click a cualquiera de los encabezados de la tabla.

42. Actualizando a Laravel 10
FREE
08:11

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

43. Actualizando la versión de Jetstream
FREE
02:38

En esta lección actualizamos paso a paso la versión de Laravel Jetstream que estamos utilizando en nuestra aplicación.

44. Instalando Vite con Jetstream
FREE
04:17

En esta lección quitamos el compilador de assets Laravel Mix, que ya no se utiliza, y lo reemplazamos por Vite.

45. Actualizando Livewire a la versión 3
FREE
06:56

En esta lección seguimos los pasos de actualización de Livewire utilizando el comando de actualización.

46. Actualizando Livewire a la versión 3 - Parte II
PRO
03:56

En esta lección continuamos con la actualización a Livewire 3 corrigiendo errores en el formulario de creación de artículos.

47. Actualizando Livewire a la versión 3 - Parte III
PRO
05:49

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

Tu instructor

Jorge García

Jorge García Coello

Aprendible.com

Jorge García es creador de Aprendible.com yDesarrollador Certificado en LaravelA través de su plataforma de aprendizaje y de otras plataformas de estudio, desde 2015 ha ayudado a decenas de miles de desarrolladores a mejorar sus oportunidades dentro del Desarrollo Web.

¿Qué dicen los subscriptores?

¿Aún no estás convencid@?
Mira lo que están diciendo algunos subscriptores de Aprendible.
WOW! Cada vez me impresionas más! Excelente trabajo! Ahora a probarlo
Beto Vásquez
Beto Vásquez
Estos videos son impresionantes, no he visto nada mejor que ello. Un material muy limpio muy claro y profesional.
Kenneth Ruiz
Kenneth Ruiz
Excelente tutorial ! Mil gracias. Como siempre todo muy bien explicado y de una manera sencilla.
Dileydi Ramos
Dileydi Ramos
Muchas gracias Jorge, muy clara la explicación. Gracias por aprendible.com enserio AMO tus videos los AMO.
César Cruz
César Cruz