Curso de Webpack

FrontEnd

Domina la herramienta imprescindible para el desarrollo profesional con el que empaquetar tus módulos logrando un código organizado y optimizado.

Intermedio Corto (hasta 8 horas) Precio en promoción 59€ 45€

Con este Curso de Webpack hemos reunido en un mismo temario todos aquellos aspectos que te van a permitir aprender a usar, paso a paso y de una forma práctica, una potente herramienta con la que empaquetar código y automatizar diversos tipos de tareas. Webpack es una de las herramientas más representativas en el desarrollo frontend de la actualidad. Si quieres dominarla y sacarle el mayor partido a Webpack en todo tipo de proyectos, este curso es para ti.

Qué es Webpack

Webpack es una herramienta que nos ayuda a cubrir diversas necesidades del desarrollo moderno. Originalmente es un software de empaquetado de código, capaz de crear, compactar y optimizar los archivos Javascript que se usarán en producción. Sin embargo, el uso de esta herramienta ha trascendido a varios niveles, permitiendo diversos tipos de operativas para mejorar los flujos de trabajo, automatizando varios tipos de tareas habituales en el desarrollo web, para conseguir al final una experiencia de desarrollo optimizada.

Webpack ha sido capaz de dejar atrás interesantes tecnologías como Grunt, Gulp, Browserify o Bower. Este poderoso sistema de bundling o de empaquetado nos permite generar un archivo único javascript con todos aquellos módulos que necesita tu aplicación para funcionar. Además Webpack prepara tu aplicación web para producción, compila archivos de preprocesadores CSS como Sass, transpila código ES6, optimiza la experiencia de los usuarios de las aplicaciones, creando múltiples paquetes que se pueden cargar dinámicamente en tiempo de ejecución según sus necesidades (code splitting). Por si fuera poco, dispone de un servidor de desarrollo que vigila y recarga la página cuando se producen cambios en el código y ofrece múltiples y avanzadas posibilidades a la hora de automatizar tareas. Es una herramienta de build "todo-terreno".

Como prueba de las posibilidades de Webpack cabe decir que es una de las piezas fundamentales que usan diversos frameworks como Angular, React o las herramientas de Laravel para facilitar desarrollo frontend.

Objetivo del curso

El objetivo del curso de Webpack es mejorar tu experiencia en la creación de aplicaciones web, mediante el dominio de una herramienta imprescindible para el desarrollo profesional, en un panorama de constante incremento de las exigencias de los proyectos y aplicaciones a los que nos enfrentamos.

Durante el curso se explicarán de manera práctica las diferentes utilidades de esta herramienta para completar con el desarrollo básico de una aplicación Webpack con VanillaJS.

Como conocimientos previos para sacar el mayor rendimiento del curso se recomiendan nociones de node.js y conocimientos de algún task builder como grunt o gulp.

Programa

El programa de contenidos de este Curso de Webpack es el siguiente: 

Clase 1:

* Introducción

* Uso sin archivo de configuración

* Modos: producción y desarrollo

* Transpilando Javascript +ES6 con Babel

* Inyección de JS en HTML

* Extracción de CSS

* Servidor Web de Desarrollo

Clase 2:

* Configuración de JSON

* Configuración de Sass

* Configuración de PostCSS y Autoprefixer

* Soporte de Urls en CSS y SASS

* Optimización de imágenes

* Configuración de archivos estáticos

* Múltiples puntos de entrada y salida

Clase 3:

* Kit de inicio para VanillaJS

* Kit de inicio para React

* Kit de inicio para Vue.js

* Kit de inicio para TypeScript

Clase 4:

* Desarrollando una aplicación Webpack con VanillaJS

Conocimientos Mínimos

Las personas que quieran sacar el máximo partido de esta formación deben tener conocimientos previos en Javascript, HTML y CSS.

CONTENIDO

Webpack, uso y primeros pasos

Introduccion a Webpack

Jonathan MirCha

HTML Loader de Webpack

Jonathan MirCha

Extracción del CSS

Jonathan MirCha

Configuración de Webpack

Configuración de Webpack

Jonathan MirCha

CONTENIDO

Webpack, uso y primeros pasos

Introduccion a Webpack

Jonathan MirCha

HTML Loader de Webpack

Jonathan MirCha

Extracción del CSS

Jonathan MirCha

Configuración de Webpack

Configuración de Webpack

Jonathan MirCha