Envíanos tu consulta
Términos y condiciones *
logoImagina
Formación
Modalidades
Próximas Convocatorias
Temario
FAQ
Solicitar información
iconoCurso

Curso de Desarrollo FullStack con Laravel y Vue

DISPONIBLE EN MODALIDAD:
aMedidaIcon
Aula Virtual Personalizada
arrowRightDark

Aprende a desarrollar aplicaciones web Back y Front con dos de los frameworks más interesantes actualmente: Laravel y Vue

iconClienticonClienticonClienticonClienticonClienticonClienticonClienticonClienticonClienticonClienticonClienticonClienticonClienticonClienticonClienticonClienticonClienticonClienticonClienticonClienticonClienticonClient

Formación en Desarrollo FullStack con Laravel y Vue bonificable para empresas

A quién va dirigido nuestro curso de Desarrollo FullStack con Laravel y Vue

- Desarrolladores Fullstack que quieran aprender a desarrollar aplicaciones Web con Laravel y Vue

Objetivos de nuestro curso de Desarrollo FullStack con Laravel y Vue

  • Desarrollar aplicaciones Backend con Laravel 9
  • Desarrollar aplicaciones Frontend con Vue (Composition API) y Typescript
  • Hacer uso de gráficas con chart.js
  • Añadir sistemas de autenticación y pagos seguros
  • Realizar builds de producción y despliegues
  • Desarrollar un proyecto final evolutivo

Qué vas a aprender en nuestro curso de Desarrollo FullStack con Laravel y Vue

Aprende a desarrollar aplicaciones web Back y Front con dos de los frameworks más interesantes actualmente: Laravel y Vue

Requisitos de nuestro curso de Desarrollo FullStack con Laravel y Vue

  • Tener experiencia desarrollando aplicaciones de navegador con HTML, CSS y JavaScript
  • Tener experiencia desarrollando con PHP
  • Permisos suficientes para descargar e instalar software en tu equipo Linux, Mac o Windows.
  • Es recomendable tener experiencia con TypeScript y haber trabajado con GIT
  • Disponer de un equipo con acceso a un usuario con permisos suficientes de instalación SW
  • Tener Visual Studio Code, Node y NPM instalados previamente
  • Tener instalada en tu equipo una versión de PHP entre 8.0 y PHP 8.1 previamente.
  • Tener instalado PHP MyAdmin previamente y acceso a bases de datos MySQL o MariaDB

Temario del curso de Desarrollo FullStack con Laravel y Vue

tema 1

Introducción al desarrollo con Laravel y Puesta en Marcha

  • Introducción a Laravel
  • Características
  • Composer
  • Instalaciones y configuraciones
  • Configuración del IDE: Visual Studio Code
  • Creación de proyecto Laravel
  • Análisis de estructura de carpetas y arquitectura
  • Despliegue en local
iconArrowDown
tema 2

Novedades de Laravel

  • Laravel Jetstream
  • Directorio de Modelos
  • Clases factory en los modelos
  • Migration Squashing
  • Trabajos por Lotes
  • Mejoras en el modo de mantenimiento
  • Cierre de "Dispatch"
  • Componentes dinámicos de Blade
  • Mejoras en el Event Listener
iconArrowDown
tema 3

API Rest en Laravel

  • Introducción a API Rest
  • Rangos de Métodos HTTP
  • Trabajando con JSON
  • Entendiendo las partes de una petición de cliente
  • Entendiendo las partes de una respuesta de servidor
  • Creación de aplicacción API Rest con Laravel
  • Build de desarrollo y despliegue en local
  • Primeras pruebas con Postman
iconArrowDown
tema 4

Routing

  • Introducción
  • Funcionamiento interno
  • Rutas
  • Rutas con variables
  • Argumentos del controlador
  • Añadir requisitos
  • Rutas Avanzadas
iconArrowDown
tema 5

Controladores

  • Introducción a los controladores y endpoints
  • URL y Controlador
  • Gestión de peticiones y generación de respuestas
  • Controlador Base
  • Tareas comunes
  • Gestión de Errores
  • Sesión
iconArrowDown
tema 6

Bases de datos y Eloquent

  • Configuración
  • Migraciones
  • Seeding
  • Query builder
  • ¿Qué es Eloquent?
  • Crear y definir modelos de Eloquent
  • Recuperar datos
  • Inserts y Updates
  • Borrado con Eloquent
  • Ámbitos
  • Accesors y Mutators
  • Colecciones en Eloquent
  • Serializaciones con Eloquent
  • Relaciones con Eloquent
  • Eventos con Eloquent
iconArrowDown
tema 7

Gestión de la persistencia

  • Instalación y configuración
  • Ejemplo Sencillo
  • Buscando Objetos
  • Relaciones y asociaciones de Entidades
  • Tipos de datos
iconArrowDown
tema 8

CRUD

  • Introducción a CRUD
  • Creación de endpoints para CRUD
  • Analizando peticiones y generando respuestas tipo JSON
iconArrowDown
tema 9

Configuración, Autenticación y gestión de sesiones

  • Referencia de Configuración
  • Parámetros
  • Fichero .env y Variables de entorno
  • Seguridad
  • Introducción
  • Autenticación
  • Autenticación de Usuarios
  • Carga de Usuarios
  • Codificar Contraseña
  • Denegar el Acceso
  • Obtener el Objeto User
  • Cerrar Sesión
iconArrowDown
tema 10

Artisan y Tinker

  • ¿Qué es Artisan?
  • Comandos básicos
  • Personalizando comandos con Artisan
  • Llamando a los comandos de Artisan
  • Tinker
  • Servidor dump de Laravel
iconArrowDown
tema 11

Internacionalización

  • Introducción
  • Traducción Básica
  • Traducción en Plantillas
  • Obtener Contenido de Traducciones y Actualizar
  • Recursos de Traducción
iconArrowDown
tema 12

Exportaciones

  • Exportación a Excel
  • Exportación a PDF
iconArrowDown
tema 13

Notificaciones en Tiempo Real

  • Introducción a las notificaciones en tiempo real
  • Creación de capa de notificaciones en tiempo real
iconArrowDown
tema 14

Sistemas de Pagos

  • Introducción a los sistemas de pagos disponibles en la actualidad
  • Creación de capa para pagos con entidades bancarias
iconArrowDown
tema 15

Securización

  • Problemas y riesgos en el mundo real
  • HTTPS
  • Configuración CORS
  • Tipos de ataques
  • Configuraciones frente a ataques
  • Recomendaciones y buenas prácticas
iconArrowDown
tema 16

Testing en Laravel

  • Introducción
  • Test Unitarios con PHPUnit
  • Testing con Pest
  • Testing de peticiones HTTP
  • Testing en Postman
  • Mocking y Stubbing
  • Testing en comandos de Artisan
  • Testing en múltiples navegadores
iconArrowDown
tema 17

Builds de producción y despliegue

  • Configuraciones de hosting local
  • Configuraciones en la nube
  • Generación de builds de producción
  • Despliegues y comprobación de disponibilidad
  • Pruebas con Postman
iconArrowDown
tema 18

Introducción al desarrollo con Vue en Typescript y puesta en marcha

  • Configurando Visual Studio Code para desarrollar con Typescript y Vue
  • ¿Qué es Vue?
  • ¿Qué es Vue CLI?
  • Comandos esenciales de Vue CLI
  • Opciones de creación de proyecto y guardado de plantillas
  • Creando el primer proyecto Vue y TypeScript
iconArrowDown
tema 19

Interacción con el DOM

  • Las plantillas de Vue
  • Instancias y sintaxis de las plantillas de Vue
  • Gestión de datos y binding
  • ¿Qué son las directivas y cómo se usan?
  • El Re-renderizado
  • Eventos: Objetos, datos y modificadores
  • Los eventos de teclado
  • Uso de código en las plantillas
  • El binding doble
  • Las propiedades y la reacción ante los cambios
  • La escucha activa ante cambios
  • Uso de clases CSS para dar estilos de manera dinámica
iconArrowDown
tema 20

Componentes

  • ¿Qué es un componente?
  • Almacenando datos en componentes
  • Registrando componentes
  • El componente raíz (root)
  • Creando componentes
  • Usando componentes
  • Buenas prácticas de estructuración del proyecto
  • Estructuras de carpetas alternativas
  • ¿Cómo se nombran los componentes?
  • Dando estilos a los componentes
iconArrowDown
tema 21

La comunicación entre componentes

  • El problema de la comunicación entre componentes
  • Las Props como método de comunicación vertical descendente
  • Nombrado de Props
  • Uso de Props en componentes hijo
  • Validando las Props de un componente
  • Los eventos como método de comunicación vertical ascendente
  • Comprendiendo el flujo unidireccional del flujo de datos
  • Funciones Callback como método de comunicación
  • Bus de eventos
iconArrowDown
tema 22

Renderizado condicional y bucles

  • El renderizado condicional con v-if
  • Alternativas a v-if
  • Renderizado con bucles v-for
  • Alternativas a v-for
  • Bucles sobre objetos literales
  • Bucles sobre listas
iconArrowDown
tema 23

Instancias de Vue

  • Conceptos básicos de la instancia de Vue
  • Uso de múltiples instancias
  • Accediendo a la instancia de VueJS
  • Uso de datos y métodos con VueJS
  • $el
  • $data
  • $refs
  • Uso de $refs en las plantillas
  • La API de Vue
  • Montando una plantilla
  • Uso de componentes
  • Limitaciones de determinadas plantillas
  • Actualización del DOM por parte de Vue
  • El ciclo de vida de Vue
iconArrowDown
tema 24

Uso avanzado de componentes

  • El paso de contenido
  • Paso de contenido a través las funciones de composición
  • ¿Qué son las funciones de composición?
  • La importancia de reutilizar código
iconArrowDown
tema 25

Webpack y Vue

  • La utilidad del Servidor de Desarrollo
  • ¿Qué es el Workflow y por qué es necesario?
  • Instalación y análisis de Vue CLI
  • Usando Vue Cli para crear proyectos
  • Entendiendo Webpack y la estructura de carpetas
  • Los archivos .vue y los objetos
  • El entorno de producción y cómo realizar una build
  • Depuración de un proyecto Vue
iconArrowDown
tema 26

Manejo de Formularios

  • Binding en campos de tipo input
  • Agrupando datos
  • Pre-Poblando los inputs de un formulario
  • Modificadores de inputs
  • Binding de un textarea y guardado de saltos de línea
  • Uso de checkboxes y almacenamiento de datos en arrays
  • Uso de radio buttons
  • Uso de desplegables
  • ¿Qué es el v-model y para qué sirve?
  • Creando un Custom Control
  • Enviando un formulario
iconArrowDown
tema 27

Directivas

  • ¿Qué son las directivas?
  • ¿Cómo funcionan las directivas?
  • Introducción a funciones Hook
  • Creando una directiva
  • Pasando valores a directivas personalizadas
  • Pasando argumentos a directivas personalizadas
  • Modificando directivas personalizadas
  • Registrando directivas
  • Usando múltiples modificadores
  • Pasando valores complejos a directivas
iconArrowDown
tema 28

Filtros y Mixins

  • ¿Qué es un filtro?
  • Creando un filtro
  • Filtros globales
  • Encadenado de múltiples filtros
  • Filtros vs Propiedades
  • ¿Qué son los mixins?
  • Creando un mixin
  • Usando un mixin
  • Creando mixin globales
  • Los mixins y el ámbito
iconArrowDown
tema 29

Animaciones y Transiciones

  • ¿Qué es una transición?
  • Preparando el código para usar transiciones
  • Montando una transición
  • Accediendo a clases CSS para transiciones
  • Creando una transición “fade”
  • Creando una transición “slide”
  • Propiedades para transiciones y animaciones con mixins
  • Animaciones v-if y v-show
  • Usando una animación inicial
  • Uso de clases CSS diversas
  • Uso de nombres y atributos dinámicos
  • Transiciones entre múltiples elementos
  • Escucha activa ante eventos de transición con Hooks
  • Entendiendo las animaciones en TypeScript
  • Exclusión de CSS de una animación
  • Creando una animación en TypeScript
  • Animando componentes dinámicos
  • Uso de “transition-group” para animación de listas
  • Añadiendo animaciones
iconArrowDown
tema 30

Peticiones HTTP

  • Configuración de “vue-resource”
  • Peticiones HTTP
  • Interceptando Peticiones
  • Interceptando Respuestas
  • ¿Qué es un “resource”?
  • Creación de recursos personalizados
  • Recursos vs Peticiones HTTP tradicionales
  • Comprendiendo plantillas URL
  • Introducción a Axios
  • Configuración del proyecto
  • Configuración de Axios a nivel del proyecto
  • Envío de peticiones HTTP con Axios
  • Accediendo a las respuestas y su contenido
  • Configuración global para las peticiones de Axios
  • Uso de interceptores en Axios
  • Instancias personalizadas de Axios
iconArrowDown
tema 31

Routing en VueJS

  • ¿Qué es “vue-router” y por qué es necesario?
  • Configuración de “vue-router”
  • Configurando y cargando rutas
  • Modos de enrutado: Hash vs Historial
  • Router Links
  • Active Links y estilo
  • Navegación imperativa
  • Configurando parámetros para las rutas
  • Obteniendo parámetros de las rutas
  • Usando parámetros de las rutas
  • Reaccionando ante cambios en los parámetros de las rutas
  • Nested Routing – Child Routes
  • Navegando a las rutas “child”
  • Dinamizando los Router Links
  • Named Routes
  • Usando parámetros Query
  • Named Router Views
  • Redireccionamiento
  • Transiciones entre rutas
  • Pasando fragmentos Hash
  • Controlando el comportamiento de Scroll
  • Router Guards
  • “beforeEnter” Guards
  • “beforeLeave” Guards
  • Carga “lazy” de las rutas
iconArrowDown
tema 32

Autenticación

  • La autenticación en SPAs
  • Configuración del proyecto
  • Añadiendo un registro
  • Añadiendo un login
  • Uso de “Vuex” para el envío de peticiones de autenticación
  • Almacenando datos de autenticación en Vuex
  • Autenticación con JWT
  • Accediendo a otros recursos de Vuex
  • Enviando el Token al Backend
  • Auth Guards
  • Actualizando el estado de la aplicación
  • Añadiendo un logout
  • Auto login y Auto logout
iconArrowDown
tema 33

Responsive Frameworks

  • Introducción a Responsive Frameworks
  • Viewport
  • Densidades de pantalla
  • Diseños líquidos
  • Ritmo Vertical
  • Media Queries
  • Introducción a Bootstrap
  • Características de Bootstrap
  • Paso a Paso para empezar con Bootstrap
  • Añadiendo Bootstrap a un proyecto VueJS
  • El Container de Bootstrap
  • Responsive Breakpoints de Bootstrap
  • Z-Index en Bootstrap
  • El sistema de Grid de Bootstrap
  • La tipografía en Bootstrap
  • Las listas en Bootstrap
  • Las tablas en Bootstrap
  • Las imágenes en Bootstrap
  • Las figuras en Bootstrap
  • Otras utilidades de Bootstrap
  • Los componentes de Bootstrap
  • ¿Qué es el Material Design?
  • Vuetify como Responsive Framework alternativo a Bootstrap
  • ¿Por qué Vuetify es una buena opción?
  • El Generador de Temas de Vuetify
  • Instalación
  • El Grid de Vuetify
  • Los Layouts de Vuetify
  • Elevation en Vuetify
iconArrowDown
tema 34

Despliegue de proyecto Vue

  • Preparación para el despliegue
  • Desplegando la aplicación de VueJS
iconArrowDown
tema 35

Estado de la aplicación

  • El problema del manejo del estado de la aplicación
  • El concepto de estado centralizado
  • Comprendiendo los getters
  • Mapeo de getters y propiedades
  • Las mutaciones y el asincronismo
  • Comprendiendo las Acciones
  • Mapeo de acciones y funciones
  • El binding doble (v-model) y Vuex
  • Más buenas prácticas de estructuración de proyectos
  • Uso de namespaces
iconArrowDown
tema 36

Gráficas con ChartJS

  • Introducción a ChartJS
  • Instalaciones
  • Creación de gráficas
iconArrowDown
tema 37

PWAs y Notificaciones Push

  • Configuraciones de proyecto Vue como PWA
  • Entendiendo el Service Worker y sus métodos
  • Gestión de versiones con Service Worker y control de recarga
  • Comunicación con API de Laravel para obtener notificaciones en tiempo real
iconArrowDown
tema 38

Sistemas de Pago

  • Consumiendo servicios de pago de proyecto Laravel
  • Creación de componentes para el sistema de pagos
iconArrowDown
tema 39

Testing en Vue con Jest y Cypress

  • Introducción a Jest
  • Configuraciones personalizadas de Jest
  • Sintaxis y léxico de jest
  • Matchers de Jest
  • Generación de informes de coverage
  • Probando componentes Vue con Testing Library
  • Entendiendo los selectores y XPath
  • Jest-Dom y sus matchers personalizados
  • Jest Mocks
  • Jest Spies
  • Introducción a Cypress
  • Entendiendo el testing e2e
  • Configuraciones para trabajar con Cypress y Typescript
  • Configuraciones disponibles de cypress.json
  • Automatización de pruebas con Cypress
  • Personalización de comandos Cypress
  • Conectando informes con Cypress Dashboard
  • Ejecutando Cypress en modo headless
  • Scripts para automatización de ejecución de tests unitarios y e2e
iconArrowDown
tema 40

Linting

  • Introducción a EsLint
  • Configuraciones personalizadas
  • Aplicando reglas
  • Eliminando reglas
  • Extendiendo reglas
  • Ejecutando eslint
  • Sobreescribiendo código con Eslint basado en reglas
iconArrowDown
tema 41

Builds y Despliegues

  • Creación de builds de producción
  • Despliegues locales
iconArrowDown

Preguntas Frecuentes de Desarrollo FullStack con Laravel y Vue

¿Cuáles son los beneficios de realizar el curso de Desarrollo FullStack con Laravel y Vue?

accordionIcon
El curso de Desarrollo FullStack con Laravel y Vue ofrece una formación completa que abarca tanto el backend como el frontend de las aplicaciones web. Aprenderás a crear aplicaciones modernas y escalables utilizando dos de los frameworks más populares hoy en día. Este conocimiento te permitirá integrarte mejor en cualquiera de los roles de desarrollo en una empresa y te proporcionará una ventaja competitiva en el mercado laboral.

¿El curso de Desarrollo FullStack con Laravel y Vue se puede bonificar a través de FUNDAE?

accordionIcon
Sí, el curso de Desarrollo FullStack con Laravel y Vue es bonificable a través de FUNDAE. Las empresas pueden beneficiarse de las ayudas a la formación para sus empleados, lo que puede significar una reducción del coste del curso hasta el 100% del mismo, dependiendo de los créditos formativos disponibles en FUNDAE. Además, ofrecemos un servicio de gestión de esta bonificación con un coste adicional del 10% del valor del curso más IVA, que también es bonificable.

¿En qué modalidad se imparte el curso de Desarrollo FullStack con Laravel y Vue?

accordionIcon
El curso se imparte en modalidad de aula virtual personalizada, lo que significa que las clases se realizan a través de videoconferencia utilizando Zoom. Esto permite a los participantes acceder a las sesiones de formación en tiempo real con el formador desde cualquier lugar y momento, con la comodidad adicional de contar con grabaciones de cada clase para revisión posterior.

¿Qué habilidades desarrollaré con el curso de Desarrollo FullStack con Laravel y Vue?

accordionIcon
Al completar este curso, adquirirás habilidades prácticas en la creación de aplicaciones web completas utilizando Laravel para el backend y Vue para el frontend. Aprenderás a manejar bases de datos, autenticación, API REST, desarrollo responsivo, así como a implementar componentes interactivos y dinámicos. Serás capaz de gestionar proyectos de desarrollo web de principio a fin, integrando buenas prácticas de programación y pruebas automatizadas.

¿Cómo puedo inscribirme en el curso de Desarrollo FullStack con Laravel y Vue?

accordionIcon
Para inscribirte, simplemente completa los formularios de inscripción disponibles en nuestra web. Asegúrate de proporcionar toda la información necesaria para que podamos procesar tu inscripción lo más rápido posible. Nuestro equipo también te puede asistir en el proceso de gestión de bonificaciones si decides beneficiarte de las ayudas disponibles a través de FUNDAE.