Curso de Stenciljs

Aprende a dominar Stenciljs y desarrolla Web Components ultrarrápidos basados ​​en estándares que se ejecutan en cualquier navegador
Material disponible
Intermedio
6 Clases 10 h
79€
65€
Precio en promoción
Stenciljs es una herramienta para el desarrollo de Web Components que podremos usar en cualquier tipo de aplicación frontend. Con Stenciljs se producen componentes Javascript estándar y por lo tanto podemos usarlos con sitios y aplicaciones basadas en "VanillaJS" o en el framework de nuestra preferencia.

En realidad Stencil.js se cataloga como un "compilador" que genera "Custom Elements" y nos asegura no solo compatibilidad con otras plataformas, sino también un elevado rendimiento. Encima del estándar Javascript de Web Components, Stencil nos ofrece la capacidad de usar muchas de las ventajas de librerías como React: Virtual DOM, data binding, templates con JSX y mucho más.

Después del proceso de compilación, nos entrega componentes en Javascript nativos, capaces de funcionar en cualquier contexto. Por ello, Stenciljs es ideal para crear sistemas de diseño, con componentes transversales, que los profesionales y empresas podrán usar a lo largo de cualquier tipo de proyecto. Stenciljs ha sido creado por el equipo de Ionic y, de hecho, todos los componentes del framework están desarrollados usando Stencil, lo que les ha permitido desacoplarse de cualquier framework Javascript y dar libertad de elección a sus desarrolladores

Qué aprenderé en el Curso de Stenciljs

  • Web components, estándares, presente y futuro
  • ¿Qué es Stencil y por qué deberías trabajar con esta herramienta?
  • JSX (TSX)
  • APIs que nos ofrece
  • Creación de web components paso a paso
  • Cómo testear tus componentes
  • Integración con los grandes frameworks
  • Construir una app a base de los componentes creados

Objetivos del curso

Al finalizar el curso tendrás una base sólida en la creación de Web Components con la herramienta Stenciljs. Conocerás los inicios de los componentes y los pilares sobre los que se sustentan, qué lugar vienen a ocupar en el panorama frontend actual y por qué deberías usar Stencil como herramienta.

Nos adentraremos en el uso de JSX y Typescript, test y la integración de los componentes ya creados en los grandes frameworks del mercado.

Será un curso mayoritariamente práctico, con ejemplos y ejercicios guiados. Con los componentes creados armaremos una pequeña aplicación que consuma API para interactuar con datos reales.

Por qué debes aprender Stenciljs

Stenciljs es una herramienta que te permite crear web components totalmente agnósticos a los frameworks actuales. Los web components ya son parte del estándar de la web y es difícil pensar hoy en día crear una aplicación sin usar esta tecnología. Imagina crear componentes de reducido tamaño, basados en estandares y que puedas reutilizar con el framework de turno, Stencil te lo pone en bandeja, es tu herramienta.

Stencil hace hincapié en la accesibilidad y si estás acostumbrado a trabajar con Typescript, la curva de aprendizaje será muy baja. Si no tienes experiencia usando TS, no te preocupes, a lo largo del curso irás adquiriendo los conocimientos necesarios para trabajar con esta maravillosa herramienta

Qué tengo que saber

Para la realización del curso de Stenciljs se recomienda disponer de conocimientos medios de Javascript, nociones Typescript y CSS. Es ideal un conocimiento básico sobre las herramientas de desarrollo esenciales, como la consola de comandos o editores de código.

Clases y contenidos

Web components y estándares

Introducción a los web components y los estándares, primeros pasos en la configuración del entorno de trabajo con Prettier.

Configuración del entorno de trabajo StencilJS con Prettier, Eslint, Husky y Lint-staged. Gratis

Herramientas para obtener y configurar un entorno de trabajo óptimo: trabajo con Prettier, Eslint, Husky, Lint-staged....

Dominio de Stencil con JSX y Typescript a través de la creación de web components

Primeros pasos con la herramienta y las aPIS que nos ofrece. ¿Qués es JSX (TSX)? CSS y Shadow DOM.

Composición de componentes e interacción entre ellos

En esta sesión nos centramos en componer componentes más específicos a base de componentes más genéricos y la interacción entre ellos a base de eventos y propiedades.

Integración de componentes

Creación de un componente Icono que es consumido por un componente padre

Testing, accesibilidad y otras herramientas

Publicación e integración de los componentes creados en un framework, accesibilidad y opciones de testing que nos da la herramienta.

Valoraciones

Manu Álvarez

El ritmo es bastante lento y el contenido de momento al menos bastante básico

jaimedocal@gmail.com

Excelente curso como todos los de Rafa Bernal.

Francisco Torres

Maria García

He podido aprender muchas cosas. Como ya había usado React me gusta el enfoque de Stencil. Me falta ponerlo en práctica.

Albert Montagut Casero

javierarocena

Juan Caravaca

¿Conoces nuestra tarifa plana?

Toda la formación de EscuelaIT, con más de 170 cursos completos para aprender las más variadas tecnologías de programación, diseño y marketing online. Todo! con tu suscripción.

Suscríbete