2.closing tags

<PLEASE USE THIS TEMPLATE TO HELP YOU CREATE A GREAT POST!>

<Below this line, add a link to the EXACT exercise that you are stuck at.>
What is the proper slash placement for closing tags. This doesn’t seem to be correct.

<Below this line, in what way does your code behave incorrectly? Include ALL error messages.>
SyntaxError: /home/ccuser/workspace/learn-react-01-03-02/app.js: Unterminated JSX contents (12:12)
10 | THANKS HA LOT
11 |

12 |
| ^
13 | );

```

Replace this line with your code.
var profile = (

I AM JENKINS

I LIKE TO SIT
JENKINS IS MY NAME THANKS HA LOT
);
<do not remove the three backticks above>

For self-closing tags, like <br>, in JSX you close it like this: <br />.

So would the code be like this?

var profile = (
  <div>
    <h1>I AM JENKINS</h1>
    <img src="images/jenkins.png" >
    <article>
      I LIKE TO SIT
      <br>
      JENKINS IS MY NAME
      <br />
      THANKS HA LOT
    </article>
  </div>
);

Because that doesn’t work…

And it shows this:

SyntaxError: /home/ccuser/workspace/learn-react-01-03-02/app.js: Expected corresponding JSX closing tag for
(11:4)
9 |

10 | THANKS HA LOT

11 |
| ^
12 |
13 | );
at Parser.pp.raise (/usr/lib/node_modules/babelify/node_modules/babylon/lib/parser/location.js:22:13)
at Parser.pp.jsxParseElementAt (/usr/lib/node_modules/babelify/node_modules/babylon/lib/plugins/jsx/index.js:446:12)
at Parser.pp.jsxParseElementAt (/usr/lib/node_modules/babelify/node_modules/babylon/lib/plugins/jsx/index.js:429:30)
at Parser.pp.jsxParseElementAt (/usr/lib/node_modules/babelify/node_modules/babylon/lib/plugins/jsx/index.js:429:30)
at Parser.pp.jsxParseElementAt (/usr/lib/node_modules/babelify/node_modules/babylon/lib/plugins/jsx/index.js:429:30)
at Parser.pp.jsxParseElement (/usr/lib/node_modules/babelify/node_modules/babylon/lib/plugins/jsx/index.js:465:15)
at Parser.parseExprAtom (/usr/lib/node_modules/babelify/node_modules/babylon/lib/plugins/jsx/index.js:16:21)
at Parser.pp.parseExprSubscripts (/usr/lib/node_modules/babelify/node_modules/babylon/lib/parser/expression.js:272:19)
at Parser.pp.parseMaybeUnary (/usr/lib/node_modules/babelify/node_modules/babylon/lib/parser/expression.js:252:19)
at Parser.pp.parseExprOps (/usr/lib/node_modules/babelify/node_modules/babylon/lib/parser/expression.js:183:19)

You probably need to “close” (these elements are not self-closing, they are void elements) the first br and img also:

var profile = (
  <div>
    <h1>I AM JENKINS</h1>
    <img src="images/jenkins.png" />
    <article>
      I LIKE TO SIT
      <br />
      JENKINS IS MY NAME
      <br />
      THANKS HA LOT
    </article>
  </div>
);
1 Like

Oh I get it now, @factoradic Thanks!

No need to thank me, I simply applied hint given by @albionsrefuge to your code :slight_smile:

1 Like

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.