Los custom elements de los web components son esas etiquetas HTML personalizadas que podemos integrar dentro de un programa de desarrollo web para guiar nuestro proyecto hasta el punto que queremos y, de esta manera, cumplir con los objetivos que estamos ideando para nuestro sitio web dentro de cualquier navegador. Como cualquier otro tipo de elemento dentro del desarrollo, debe seguir una serie de características que lo acompañen dentro la escritura de código, ya que, de esta forma, evitarás cometer errores.
Custom elements de los web components
Cuando nos encontramos con cualquier elemento, tanto para el desarrollo web como para la creación de otros lenguajes de programación, debemos tener claro que los nombres son de suma importancia, ya que es la forma en la que se presentan dentro del programa y evitan que puedas confundirlos con otros elementos o perderlos de vista.
Los nombres son importantes, dado que crean los custom elements. Este es un estándar que se encarga de registrar las etiquetas personalizadas, al tener en cuenta una serie de condiciones que las van a diferenciar de otro tipo de herramientas que se generen dentro de los programas. De esta manera, los custom elements de los web components participan en la creación del guion que deben tener estos elementos, para que se diferencien de los contenidos nativos del lenguaje de marcado HTML.
A continuación, puedes observar la pertinencia de cada una de las formas en las que se pueden presentar los elementos, para que tengas claro cómo configurar tus etiquetas personalizadas.
| Forma de presentarse | ¿Es aceptado o no? |
| component | no es aceptado |
| summary | no es aceptado |
| kc-component | es aceptado |
| KCcomponent | no es aceptado |
| Kc-Component | no es aceptado |
| kc-filter-component | es aceptado |
Entre tanto, las etiquetas personalizadas siempre deben tener las siguientes características:
- La etiquetas o custom elements de los web components siempre deben presentarse en minúsculas.
- La etiquetas o custom elements de los web components siempre deben presentarse con un guion que los divida.
- La etiquetas o custom elements de los web components no pueden combinar las minúsculas y las mayúsculas.
De esta modo, si tienes claro cómo que se deben presentar los custom elements de los web components, podrás seguir la forma y los estilos de los elementos o etiquetas del lenguaje de marcado HTML. Esto te servirá para cumplir los objetivos que tenga un programa de desarrollo para la formación de sitios web.
Es necesario dominar este y otros conceptos de los web components, como el ciclo de vida, para poder desarrollar los programas.
¿Qué sigue ahora?
Ahora que ya sabes en qué consisten los custom elements de los web components y cómo deberían presentarse dentro de un programa de código que integre estas etiquetas de HTML personalizadas, no tendrás ningún problema en diseñar un programa de código sin errores.
Si quieres que tu conocimiento se extienda, te recomendamos potenciarlo con nuestra formación en Desarrollo Web Full Stack Bootcamp, pues allí tendrás la guía necesaria para lograr lo que deseas en tu vida profesional como desarrollador web. ¡Pide información ahora y cambia tu futuro!
