Day 3: JSX
The problem: Writing HTML in JavaScript sucks.
The solution = JSX.
The solution = JSX.
The first step is setting up my text editor (Atom) to use the Emmet Plugin installed. This opens up access to Emmet shortcuts that make writing JSX approximately 948% easier.
I used this Atom Editor Tutorial to run through a quick explanation of what Emmet is & how to use it: https://www.youtube.com/watch?v=BQurqKG6nGY
Quick note: the default Keystroke to expand the abbreviation in a JavaScript file is 'ctrl-e' not 'Tab' as used in HTML.
Back to learning the intricacies of JSX and how it works with React.
Things to remember:
- To write a comment within JSX you need to use the format '{ /* Comment here */ }'. Don't put this at the top level as it will treat it as an element.
- 'class' is a reserved word in Javascript so you need to use 'className'. Emmet helps with this.
[Video 4: Writing HTML with JSX]
.gif)
0 Comments