I wrote everything correct but its not working
import React from 'react';
import {comments} from './commentData';
import Card from './Card';
function App () {
return (
comments.map(comment => <Card commentObject={comment} />)
)
}
import React from ‘react’;
import Header from ‘./Header’;
import Body from ‘./Body’;
function Card(props) {
return (
<Header profileImg={props.commentObject.profileImg} username={props.commentObject.username}/>
<Body comment={props.commentObject.comment}/>
</div>
)
}
export default Card;
import React from "react";
function Header(props) {
return (
<div>
<img src={props.profileImg} />
<h1>{props.username}</h1>
</div>
);
}
export default Header;
import React from ‘react’;
function Body(props) {
return
{props.comment}
}
export default Body;
import React from 'react';
import {createRoot} from 'react-dom/client';
import App from './App';
const root = createRoot(document.getElementById('app'));
root.render(<App />);