Conocimientos y habilidades que adquieres realizando este curso

  • Aprenderás a configurar tu proyecto para la puesta en producción
  • Utilizaremos webpack merge para organizar mejor nuestra configuración..
  • Aplicarás optimizaciones sobre las dependencias de tu proyecto.
  • Aprenderás a cómo reducir el tiempo de compilación de webpack.
  • Aprenderás a optimizar tu código usando Dynamic imports.

Temario

  • Estructura de directorios

    3m
  • Eliminar configs duplicadas

    13m
  • Consumir paquetes

    6m
  • RETO: Aplica lo visto en esta sección

    1m
  • ¿Qué nos ofrece webpack? (vista previa)

    2m
  • ¿Qué pasa con la caché?

    5m
  • Hashes

    5m
  • Bundle splitting

    5m
  • PRÁCTICA: Bundle splitting

    13m
  • Code splitting

    2m
  • PRÁCTICA: Code splitting

    5m
  • Herramientas de análisis

    3m
  • PRÁCTICA: Herramientas de análisis

    12m
  • RETO: Instala Webpack Visualizer

  • ¿Qué es Dynamic-link library?

    2m
  • Usando DLLPlugin y DLLReferencePlugin

    10m
  • RETO: Reduce el tiempo del building de webpack en tu proyecto

  • Web workers en webpack

    7m
  • Internacionalización con webpack

    8m
  • Extendiendo webpack

    11m

Relacionado

Te dejamos una selección de cursos, carreras y artículos

Curso de JavaScript Profesional

Curso de JavaScript Profesional

curso

Con este curso aprenderás:

  • Historia, propósito y principios básicos de JavaScript.
  • Entorno, navegadores y dispositivos
  • Runtimes, Scope, Event Loop, Garbage Collector

Duración: 9 horas y 37 minutos

WEBPACK: ¿QUÉ ES? [Actualizado 2019]

WEBPACK: ¿QUÉ ES? [Actualizado 2019]

Lenguajes de programación

05 de Febrero de 2019

Te contamos qué es Webpack, cómo funciona y las ventajas que nos ofrece para nuestros desarrollos.

Preguntas Frecuentes

En OpenWebinars no vendemos cursos o talleres unitarios.

Tenemos diferentes tipos de suscripciónes, que te dará acceso completo a todos los cursos de la plataforma y a los nuevos que vamos lanzando, siempre y cuando tu suscripción esté activa (como Spotify con la música o Netflix con las películas y series).

¿Eres una empresa? Tenemos planes especiales para tí. Consúltanos aquí.

En OpenWebinars los cursos no tienen fecha de inicio y de final.

Cada curso tiene una fecha de publicación y desde ese día estarán 100% disponible todos los contenidos del curso para los usuarios suscritos a alguno de nuestro planes.

Si estás suscrito al plan Profesional o VIP, en todos los cursos existe un examen final para evaluar tus conocimientos adquiridos. Si superas este examen con más de un 80% de preguntas correctas obtendrás el diploma de certificación. Puedes realizar un intento cada 24 horas.

Este diploma es un certificado privado emitido por OpenWebinars, y valorado en el mundo empresarial, ya que tenemos grandes compañías clientes que se forman con nosotros y valoran nuestras certificaciones.

No olvides poner tu certificación en tu perfil Linkedin y en tu currículum.

Descripción

Si ya has acabado nuestro curso inicial de Webpack, puedes continuar tu formación con este curso intermedio, en el que profundizarás en el funcionamiento de este potente module bundler y todas las posibilidades que nos ofrece.

Realizando este curso aprenderás a utilizar Webpack de forma completa, para ser capaz de optimizar y configurar más a fondo tu proyecto antes de pasarlo a producción. Es un curso que se desarrolla de una forma teórica pero también práctica, para exponer los conceptos de una forma más clara.

Esta formación online se estructura en una introducción y cuatro bloques diferenciados, cada uno de ellos centrado en un aspecto de Webpack y divididos en lecciones independientes, de forma que puedas ir avanzando por las mismas de una forma ordenada y siempre que hayas asimilado bien lo visto anteriormente.

La introducción tiene varios objetivos, desde conocer un poco al profesor que realiza el curso hasta comprobar cuáles son los requisitos previos necesarios para poder realizar la formación de una forma satisfactoria. Además en la misma podrás ver los requisitos necesarios sobre el entorno de desarrollo que se empleará durante el mismo.

Comenzando ya con la primera parte del curso aprenderás a todo lo relacionado con la organización de los ficheros de Webpack. Este bloque se compone de tres lecciones, en las que el tutor desarrollará los fundamentos de esa organización.

En la primera lección vas a aprender cómo es la estructura de directorios, para conocer bien dónde se guardan las diferentes configuraciones de Webpack y poder tenerlo todo bien ordenado y organizado. Con la segunda lección vas a aprender a eliminar las configuraciones duplicadas que se suelen generar con el tiempo, tanto a través de ciertas técnicas como de funciones específicas.

La tercera lección se centra en ver cómo consumir paquetes, los problemas que se presentan en Webpack y cómo solucionarlos, a través de herramientas como alias, extensions y modules. Al finalizar estas tres lecciones te proponemos un reto, para que pongas a prueba lo que has visto en este primer bloque, y así comprobar si lo has asimilado correctamente.

El segundo bloque se centra la optimización de los bundles en producción, a través de una serie de técnicas empleadas para optimizar los archivos generados con Webpack, y de esa forma se puedan aprovechar todas sus ventajas una vez estén en producción.

Esta sección del curso consta de seis lecciones, en las que irás conociendo los elementos que ofrece Webpack para la optimización, además de aprender por qué es tan importante la caché y cómo utilizarla para desarrollar aplicaciones más optimizadas.

También se desarrollaran conceptos como hashes, técnicas de optimización como las denominadas bundle splitting, code splitting y algunas herramientas de análisis empleadas para detectar los problemas de rendimiento en nuestros proyectos.

Además de estas lecciones teóricas, el bloque incluye varias prácticas, que sirven para explicar de una forma más visual lo que se va desarrollando en las mismas, y finalmente te propondremos un reto final relacionado con todo lo que se ha visto durante el bloque completo.

Seguidamente podrás pasar al tercer bloque formativo, que tratará sobre la optimización del proceso de compilación de las aplicaciones. Durante el mismo verás qué es la dynamic-link library y sus diferentes usos, a través de dos plugins, DllPlugin y DllReferencePlugin. Una vez acabes estas lecciones, podrás realizar el reto relacionado con las mismas.

Y finalmente, para acabar el curso, hemos preparado una sección de contenido extra que resulta interesante para completar la formación en Webpack. En ella te explicaremos cómo empaquetar web workers con Webpack, cómo utilizar las opciones de internacionalización para nuestros proyectos y cómo poder extender las funcionalidades que ofrece Webpack por defecto.

* Requisitos del Curso

Este curso es la continuación del curso de Webpack básico, es recomendable hacer primero el curso básico antes de empezar con este curso de Webpack avanzado.

Ya que Webpack es una tecnología de empaquetado de módulos Javascript, es imprescindible tener conocimientos de JavaScript, los puedes adquirir en el curso de JavaScript profesional.

Estas son algunas de las empresas que ya confían en OpenWebinars

Profesores y profesionales

Nuestros docentes son profesionales que trabajan día a día en la materia que imparten

Conviértete en profesor de OpenWebinars