Create Your Own Input Field with JavaScript Web Components

In today's video I'll show you how to build your own custom input field using web components. It'll support features such as adding an error message programmatically, and forwarding on some attributes.

If this video helped you out and you'd like to see more, make sure to leave a like and subscribe to dcode!

#dcode #javascript

[vincent-cgbl]

I discovered your channel with very good videos.
Have you ever made a video on how to organize your folders and files when you have several components?
From a performance point of view, maybe it's not a good practice to load them if you have a lot of them?
A bit like Angular where everything is compiled.

[hoshi]

you made another video on how to make a button web component and in this one you have made an input. Now please make a third video where you use the button.js file and the input.js file together in the same project and when you click on my-button element it updates my-input element. There have been many tutorials out there about building a single component but no one has put them together yet.

[smoothbeak]

Looks good to me.

Is there/what are the advantages to going this route rather than using a framework like React?

[chaz]

Suppose I make a custom component like this but also give it a name property. If I use the component in a form will the .name and .value be picked up in a FormData object constructed from the form, as in the following code?

const formData = new FormData(myform);

//does formData have an entry for my custom component?

If not, is there an elegant solution or do I have to iterate over the custom components and inject them into the FormData object myself?

[TomasMisura]

i still didn't find a courage to implement web components into my application but perhaps it's time move on. this would significantly improve level of my coding...

[mpsbrasilia]

Crie um sidebar, chamando os componentes em uma div contente. Obrigado.

[mhsnmhsn]

hello, can use tailwindcss class with when create web components or just need to pure css ?

[jonice]

i think Light dom is better than shadow dom just in case javascript is disabled