Exploring JSX (Udemy React)

Get Started. It's Free
or sign up with your email address
Rocket clouds
Exploring JSX (Udemy React) by Mind Map: Exploring JSX (Udemy React)

1. 1 syntax basics

1.1. All nodes have to be rooted within a single element.

1.2. it also works indented and scoped with parenthesis for better reading.

2. 2 Injecting Dynamic Data

2.1. Use expresions in brakets

2.2. You cannot render objects.

3. 3. Conditional Rendering

3.1. if statements

3.1.1. using functions to resolve workflow. You can return jsx as well and it would be conditionally rendered

3.1.1.1. it undefined is returned then nothing is renderd

3.2. ternary operator

3.3. logical operators

3.3.1. as boolean are not printed you can print a condition

4. 4.Events and attributes

4.1. class and other attributes

4.1.1. Now we refer class attribute as className

4.1.2. other custom attributes can be found here

4.2. events

4.2.1. clickable

4.2.1.1. onclick html Attribute. Provide a function can be inline arrow too if you want

4.2.2. Clipboard Events

4.2.3. Composition Events

4.2.4. Keyboard Events

4.2.5. Focus Events

4.2.6. Form Events

4.2.6.1. onSubmit

4.2.7. Mouse Events

4.2.8. Selection Events

4.2.9. Touch Events

4.2.10. UI Events

4.2.11. Wheel Events

4.2.12. Media Events

4.2.13. Image Events

4.2.14. Animation Events

4.2.15. Transition Events

4.2.16. Other Events

4.3. Render

4.3.1. When render is called React only updates the specific parts using the HTML comments at first and other techniques behind the scenes of the virtualDOM

5. 5) Iterative Rendering

5.1. Arrays are renderable by default in React

5.2. Use map method to add html (not using components jet)

5.2.1. notice that return is always implicit