Conditionals in JSX

condtional_jsx.js

const showComments = true;

function App() {
    return (
        <div className='container'>
            <h1>Blog Post</h1>

            {showComments ? (<div className='comments'>

                <h3>Comments ({comments.length})</h3>
                <ul>
                    {comments.map((comment, index) => (
                        <li key={index}>{comment.text}</li>
                    ))}
                </ul>
            </div>) : 'no'}

            // OR
            {showComments && (<div className='comments'>

                <h3>Comments ({comments.length})</h3>
                <ul>
                    {comments.map((comment, index) => (
                        <li key={index}>{comment.text}</li>
                    ))}
                </ul>
            </div>)}



        </div>
    )
}