Envíanos tu consulta

Buscar cursos

Catálogo 2024

¡Últimas plazas!Cursos Servicios FUNDAE Plataforma LMS

Solicitar información

Buscar cursos

Solicitar información

Cursos/Cursos de Desarrollo Web/Curso Desarrollo FullStack con Laravel y Vue

Curso completo de Desarrollo FullStack con Laravel y Vue

DISPONIBLE EN MODALIDAD:

Aula Virtual Personalizada

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

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

¿A quién va dirigido?

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

Objetivos

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?

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

Requisitos

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

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

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

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

tema 4

Routing

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

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

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

tema 7

Gestión de la persistencia

Instalación y configuración
Ejemplo Sencillo
Buscando Objetos
Relaciones y asociaciones de Entidades
Tipos de datos

tema 8

CRUD

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

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

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

tema 11

Internacionalización

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

tema 12

Exportaciones

Exportación a Excel
Exportación a PDF

tema 13

Notificaciones en Tiempo Real

Introducción a las notificaciones en tiempo real
Creación de capa de notificaciones en tiempo real

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

tema 34

Despliegue de proyecto Vue

Preparación para el despliegue
Desplegando la aplicación de VueJS

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

tema 36

Gráficas con ChartJS

Introducción a ChartJS
Instalaciones
Creación de gráficas

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

tema 38

Sistemas de Pago

Consumiendo servicios de pago de proyecto Laravel
Creación de componentes para el sistema de pagos

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

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

tema 41

Builds y Despliegues

Creación de builds de producción
Despliegues locales

Testimonios de nuestros clientes

“Empecé a formarme recientemente con ellos y estoy muy sorprendido de la metodología y la calidad de los contenidos. He hecho varios cursos online con otros proveedores pero con ninguno he terminado tan satisfecho como con Imagina.”

“Mi empresa contrató un Aula Virtual Personalizada con Imagina, después de tener malas experiencias con otras academias y nos sorprendió la profesionalidad con la que trabajan. Hicimos 3 reuniones técnicas con Martín antes de empezar la formación y quedamos encantados con el resultado, sin duda repetiremos.”

Curso de Desarrollo FullStack con Laravel y Vue bonificado para Empresas a través de FUNDAE

Somos entidad organizadora de FUNDAE, todas nuestras formaciones se pueden bonificar hasta el 100%, sujeto a vuestro crédito disponible y a cumplir con todos los requisitos de realización establecidos por la Fundación Estatal para el Empleo.

Si desconoces el funcionamiento de las bonificaciones, ofrecemos el servicio de gestión en FUNDAE, consúltanos cualquier duda que te surja.

Descargar Guía FUNDAE

Contáctanos

¿Qué formación necesitas?

En Imagina llevamos más de 14 años ofreciendo formación para empresas, estamos especializados en el área técnica y de ofimática, adaptando nuestras formaciones a vuestras necesidades. Déjanos tus datos, y nos pondremos en contacto contigo para informarte sobre el curso que mejor se ajuste a lo que buscas. Cuéntanos tus necesidades y podremos asesorarte sobre la modalidad que mejor se adapte: Curso Online o Aula Virtual Personalizada