How does the feature works? If you select the dropdown option, the image will be rendered with special effects using CSS. In the img tag, we can see the selected option value will appear in class.
What could go wrong? The POST request looks suspicious.
There is no server side validation of the imageClass value. You can send any value and it will be reflected in the response.
We can try sending a few payloads to test for XSS issue. First, we can modify the imageClass value to imageClass=helloworld" onload="alert(1)". The response return a class="1" in the tag. We can try imageClass=helloworld" onclick="alert(1)". The response also return class="1" in the tag.
It seems like there is some blacklisting of some keywords such as onload or onclick etc. Hence we need to find the event handler method that is not blacklisted. Fortunately, this payload was not blocked: img2" onpointerup="alert('xss').
When we click on the image in the browser, the malicious script is executed.
Why multiple resources that explain the same concepts? If you use different resources, you will be exposed to the concept in different context. This is especially useful for beginners to not stuck in one context. You need to understand the concept in different situation.
Also, feel free to modify the tutorial steps. Add in anything that is interesting. Apply previously learned knowledge to the tutorial. Combine two different concepts. In short, be active in experimenting.
One particular thing that is useful is the challenges that the course instructor gave to the students. After the instructor demonstrated on a practical concept, you are expected to complete the variant of the demo.
I also advise beginners to try the few challenges that are available at the end of each chapters. I have consolidated my understanding by doing these challenges. Some of the challenges may be difficult. So you should feel free to refer to the code (this is not school).
The Complete React Developer Course
Food for Thought: React seems like a powerful framework that allows the application to process and compute data for the client side. Does this mean that more application will start perform business logic workflows in the client side and forgets about backend validation?