If you have been following my content, you know that I have been slowly working on contributing to open source. I am by no means an expert, but I am getting better and learning a lot as I go. A few weeks ago, I took on a project to create my own web component.
The Element
The first step of the process is to define the problem you are solving in order to plan what you are creating. You cannot create a solution without a clear problem. I knew that we needed an element to show a star rating. I had to answer questions in order to clarify what that meant. Did I want it to be interactive? How many stars should there be?
The Creation
These questions led me to a figure out what the design should look like. I then jumped in with LitElement and started building. This is not an easy process and I needed guidance and help throughout it all. The questions changed as well as the answers, but I worked around it. The hardest part of this for me was importing and using other components well in my element. I had to learn how to utilize other code in order to bring my workload down.
The Finished Product
This element is far from perfect, but its mine. I'm proud of the work that I have put in. HAX will soon be offering a way to include ratings into your page, and that is really exciting to me.
https://github.com/hvk5388/lrnwebcomponents/tree/master/elements/star-rating
Keep coding everyone and I'll see you in the fall!
Top comments (1)
Looking forward to your code, why the teaser and no code? Do we really have to wait till Fall? Or are you on the southern hemisphere?
Interested to learn the need for multiple components in your element.
Shouldn't
<star-rating>be enough?