Solving TimeZone Issues with JavaScript

Timezone issue is something I have read a lot on FCC and other blogs in Medium. But I really didn’t know what the fuss was all about. I even read some people go nuts over these kinds of issues. Well, I didn’t know what it was until I had to face it myself.

Well for starters, I am a beginner at programming and I am just covering a small issue at hand that I had in my college project. If you are looking for something more miraculous then you might look somewhere else or just stick for a while if the solution fits for your use case.

Background

Before I directly jump into the solution, let me give you the context of my project. I am developing a chatbot that takes orders from students of a college or institute and displays them in the canteen on a monitor. I have my NodeJS webhook deployed to Heroku and that server sits in the location I am not aware of.

I had to push the exact time when the order was made, and with plain JavaScript, instead of taking the local time, it pushes the time based on the timezone of the Heroku server.

let time =  new Date().toLocaleTimeString('en-np');

Well, it was an issue for me. Because not only I had to push the exact time to the database but I also had to use that time for reference to create a time restriction on chatbot. Meaning, when was the bot accessible (college hours) and when it cannot fulfill user request (request time that exceeds college hours).

Solving TimeZone Issues With JavaScript

Now, lets cut to the chase and see what is the workaround for this problem. With an ever-evolving world of Javascript, you have plenty of libraries in your arsenal to solve multiple magnitudes of problems. So one particular library I took as my savior was the Momentjs.

For starters, Momentjs is a very lightweight library which is mere few KB’s, so you are not adding any large overhead on your project. The second thing is, it makes formatting date and time so easy. You have these small and easy to understand code snippets that get you going in no time. Take this code, for example, it simply displays the current date.

moment().format('LL');   // September 11, 2018

Notice those “LL” inside the parenthesis? Well, what happens, when you turn them into small l’s? You get a shorter format of the date. And this library is easy like that.

moment().format('ll');   // Sep 11, 2018

Now back to the solution! My problem was with the timezone and for this moment provides us with the moment-timezone library. The solution for me was as easy as any of the above code you have seen.

var now = moment().tz('Asia/Kathmandu').format('H');

This was all I needed to solve the issue. And now whenever I push my user request, the current time of my locale is stored in the database. Which allowed me to work on further features of restrictions I talked about earlier.

What I have mentioned in this article is just a sneak peek on what this library is actually capable of. You can convert date and time between different time zones and change the time displayed to your native language. Pretty neat!

While you read the documentation of momentjs, you might come across all the abbreviations passed as parameters, if it makes no sense to you then take a look at this chart!

Thank you! If this article has proven to be of any help, hit that clap icon. If you have any queries, drop a comment below or feel free to connect with me on Twitter!