<script src="https://cdnjs.cloudflare.com/ajax/libs/react/17.0.2/umd/react.development.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/17.0.2/umd/react-dom.development.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.26.0/babel.min.js"></script>
<script type="text/babel">
function getTimeAgo(dateTime) {
const customDate = new Date(dateTime);
const currentDate = new Date();
const timeDifference = currentDate - customDate;
const seconds = Math.floor(timeDifference / 1000);
const minutes = Math.floor(seconds / 60);
const hours = Math.floor(minutes / 60);
const days = Math.floor(hours / 24);
const weeks = Math.floor(days / 7);
return `${weeks} week${weeks > 1 ? 's' : ''} ago`;
return `${days} day${days > 1 ? 's' : ''} ago`;
return `${hours} hour${hours > 1 ? 's' : ''} ago`;
} else if (minutes > 0) {
return `${minutes} minute${minutes > 1 ? 's' : ''} ago`;
return `${seconds} second${seconds > 1 ? 's' : ''} ago`;
const customDateTime = '2023-8-19 15:24:19'; // Use an ISO8601 format date
const timeAgoString = getTimeAgo(customDateTime);
<div className='container'>
<h3>React Js Time Difference</h3>
ReactDOM.render(<App />, document.getElementById('app'));
box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);