I've spent the last few hours tinkering with the walkthrough tutorials for React and LitElement, which are both used to quickly create web components using JavaScript that work in web pages. Learning to use these tools is great for people who enjoy hands-on learning experiences where they can interact with their lesson to get a better understanding. In this post, I will give my take on each of these tutorials, their flaws and successes, and try to express my opinion on which did its job better in teaching a JavaScript newbie the basics.
First off, the end result of the tutorial: what are you working towards when you start each of these tutorials? In the React tutorial, you are guided through building a simple interactive tic-tac-toe game. In the LitElement tutorial, you aren't really building anything specific, just working through code to see how it affects the output.
After working through both, I cannot really say that one is definitively better than the other. They both have their strengths, and they definitely both have significant weaknesses. I would say that I was able to understand the LitElement tutorial far better than the React one, and I think this has a lot to do with the organization of the two. In LitElement, it's broken up into small sections that are quick and easy to complete, whereas the React tutorial is an absolute behemoth. BUT, and this is a big but, I think the main reason I was able to understand LitElement better than React is because I completed the React tutorial first, and this gave me a lot of information that made the LitElement tutorial extremely easy.
The differences between React and LitElement lie in the difference between a framework and a library. React is a framework, which includes libraries and languages used to create components. LitElement is a library, which is smaller in scale than a framework, and focuses more on helper functions using preexisting code. For this reason, React is much larger in scale than LitElement, which I believe is the reason why LitElement was easier for me to understand after having worked with the React framework. The code is given rather than created with a library, whereas a framework is abstract.
Here's a video going over what I've just explained with some visuals for you to get a better understanding of what I'm referring to with both of these tutorials:
https://youtu.be/wXtfWL2ODAs
Top comments (0)