How to get local time from UTC using Moment.JS with example

How to get local time from UTC using Moment.JS with example

In this post, I will tell you how to get local time from UTC time using Moment.js

Sometime as a programmer, I use dates for displaying the creation date of any post or registration date of any user or members in my application because you can not run away from date manipulation if you are developing any web application. It is a good practise to store the date and time in UTC format in the database table and convert into the user friendly local time.

However, We often use javascript date libraries for parsing, manipulating and formatting dates without thinking about how date and time actually works.

Moment.js is a beautiful javascript library for converting a string to a javascript date object, formatting a date, changing the date format etc.

There are so many things to work on date format but I will prefer moment js plugin if you are working with jquery libraries.

<!DOCTYPE html>
<html>
<head>
	<title>How to get local time from UTC using Moment.JS </title>
	<script type="text/javascript" src="https://code.jquery.com/jquery-1.9.1.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
</head>
<body>

<div class="container">
moment.js utc local timezone UTC<br/>
<div id="utc_time"></div><br/>
Your Local Time with respect to above UTC time<br/>
<div id="local_time">
</div>  
</div>


</body>


<script type="text/javascript">
 $(function(){
      setInterval(function(){
        var utcTime = $('#utc_time');
        var localTime = $('#local_time');  
        //put UTC time into utc_time  
        utcTime.text(moment.utc().format('YYYY-MM-DD HH:mm:ss'));      
        
        //get text from utc_time and conver to local timezone  
        var formattedTime  = moment.utc(utcTime.text()).toDate();
        formattedTime = moment(formattedTime).format('YYYY-MM-DD HH:mm:ss');
        localTime.text(formattedTime);        
      },1000);
 });
</script>
</html>

You can easily convert the date format (mm/dd/yyyy, mm-dd-yyyy, DD-MM-YYYY, yyyy-mm-dd) to any particular format using moment js.

You get the current date and time using moment() method and format the current date and time to specified format using format() method.

Phone: (+91) 8800417876
Noida, 201301