Working With Dates and Times in Javascript

(Moment JS, Date-Fns, Luxon)


In this video I want to talk about working with dates and times in javascript using several popular libraries like Moment js, Date-fns and Luxon. Actually Moment js was deprecated not so long ago so it's a nice time to talk about best possibilities to work with dates in Javascript.

Introduction

Hi I'm Oleksandr Kocherhin from monsterlessons-academy, where I'm teaching you how to become a developer or improve your skills of being a developer in learning by doing way. And if you are new here don't forget to subscribe and I will link everything that I'm mentioning in the description.

So let's get started.

Content

So the first question is what is Moment JS and why we needed it at all any why it was popular. So actually working with Dates in javascript is tricky, there not a lot of functions to work with date, you must write a lot of code and it's just not efficient.

This is why moment js was created. Actually it was 8 years ago. It simplified the way how you can parse, validate, change date and format it in javascript. The most important this for me was the extension for this library moment timezone. It helps to work with timezones, converts dates between timezones so it is really awesome and I used it in almost every project until some time.

Actually I stopped using it at some point when good alternatives came out. For me moment js has 2 main problems. The first problem is that you can't export single function because everything is bundled together, because it was build long ago and this means that you load a huge javascript file, especially when you load additionally timezones package. The second problem is in architecture. So everything in moment js is mutable because this is how people created things 8 years ago. And this is a problem because sometimes you apply some method on the date and it mutates your value and not just returns you new value. So it can lead to difficult problems.

And actually this 2 things that bothered me are the main reasons why they decided to stop active development of the library. Because actually to do it properly then need to rewrite it completely using common js modules, tree shaking and immutability. And it's of course lot's of time and effort and it is equal to writing the whole library from scratch.

So what can you do now if you want to work comfortably with Dates in JavaScript and you are looking for the nice library for that? 2 most popular libraries nowadays are date-fns and luxon.

I tried both of them and liked Luxon more than date-fns. All methods in Luxon and working with timezones, translations and documentation was much more comfortable for me than in date-fns. And I already used it in big projects and it works just fine.

Also the guy who created Luxon is one of the core developers of Moment JS so I can assume that he knows what he is doing.

But both of them are going in the same direction. You are getting lots of methods to work with Dates, Durations, format, parse, validate dates, everything is treeshakable which means that you can import only 1 specific method and not the whole library. Also both of them supports timezones and locales but in Luxon it's natively inside and in date-fnc you need an additional extension library for that.

So let's check some example to see how easy it is to work with dates in Luxon in comparison to JavaScript.

Let's say that we want to get current date time. and apply some methods on in.

luxon.DateTime.local()

now we can change a timezon to New York for example

luxon.DateTime.local().setZone('America/New_York')

and now we want to get the date that was in new york a week ago


luxon.DateTime.local().setZone('America/New_York').minus({ weeks: 1 })

But maybe we want to get the date where the time is at midnight

luxon.DateTime.local().setZone('America/New_York').minus({ weeks: 1 }).startOf('day')

and of course at the end to want to convert our luxon date to some standard format that we formally use like ISO.

luxon.DateTime.local().setZone('America/New_York').minus({ weeks: 1 }).endOf('day').toISO()

and here you are. Easy and powerful.

And one more point that I want to mention. Maybe you think "What is the point in all this libraries I can you plain JavaScript date and I'm good". For me it's exactly the same like using Lodash or Ramda to get more predefined and readable function in my code without need to write them by myself. With dates it's the same. You can use native Dates but you need to implement lots of function like in Moment, Luxon, Date-fns in order to write it efficiency.

Call to action

I hope that this video helps you to understand what other libraries except Moment you can use if you work with dates or you will just give libraries a try when next time to want some dates manipulation.

Also don't forget to check my full courses regarding different web technologies. I will link them down in the description box below.

If you find this video helpful, don't forget to subscribe to this channel and hit subscribe button. And I see you in my next video.

🚨 Important

📚 References