How to comment in React JSX

This tutorial explains how to perform comment in react js application. React uses JSX, it is a XML-like syntax extension to ECMAScript without any defined semantics. It's NOT intended to be implemented by engines or browsers.

Point to remember, while adding comment in react application :

1. You can use regular /* Block Comments */, but they need to be wrapped in curly braces:

{/* A JSX comment */}

2. For multi-line comment, you can use below syntax :

{/* 
  Multi
  line
  comment
*/}  

3. You can't just use HTML comments inside of JSX because the compiler will think that they are real DOM Nodes. React developers has stated they do not plan to add regular JS commenting to JSX.
Bad Practice.

render() {
  return (
    <div>
      <!-- This doesn't work! -->
    </div>
  )
}

React comment Complete Source Code :

import React, {Component} from 'react';

class App extends Component {
  constructor(props, context) {
    super(props, context);
    /* 
        alert("Welcome to skptricks");
    */

    // console.log("Welcome to skptricks");
  }
 
  render() {
    return (
        {/* A JSX comment, this will work
        <div>
        
        </div>
        */}
    );
  }
}

export default App;

This is simple example for React JS comment block, depending upon you requirement do specify comment block in you script.