Parsing error: Expected corresponding JSX closing tag

The issue

We got this issue when we try to use a component in react.js without the closing of a tag. The issue is self-explanatory. The following line raised the issue for us.

{items.map((item, i) => <Card>)}

Parsing error: Expected corresponding JSX closing tag for <Card>

Reason of the issue

When the browser parses an HTML it can adjust those enclosing syntax and renders properly. But when JSX syntax is parsed by React (Babel) it is quite sensitive to the enclosing of the tag. It becomes difficult to detect a self-closing tag unless we explicitly close it.

The solution

We had to close the tag like below:

{items.map((item, i) => <Card/>)}

Reference:
https://stackoverflow.com/questions/30852751/expected-corresponding-jsx-closing-tag-for-input-reactjs