JavaScript has evolved considerably over the years, and with this evolution have come tools that simplify tasks that were previously tedious. One of them is the manipulation of dates and times, an area where Day.js has proven to be a reliable and efficient ally. Day.js is a minimalist library that makes it easy to manipulate and parse dates in JavaScript. In this article, we will delve into the practical use of Day.js to get the most out of our applications with dates and times.
What is Day.js and Why Use It?
Day.js is a lightweight JavaScript library designed to parse, validate, manipulate and format dates and times. Why choose Day.js over other libraries or use the Date API built into JavaScript? The answer lies in its light weight of just 2KB and its ease of use similar to other heavier libraries such as Moment.js. In addition, it offers compatibility with the vast majority of browsers, extensive documentation and an active community to resolve questions and problems.
Installing and Configuring Day.js
To start working with Day.js, we first need to add the library to our project. There are several ways to do this, including:
- Installation using NPM or Yarn: For Node.js projects, you can install Day.js using the NPM or Yarn package managers.
npm install dayjs # or yarn add dayjsAfter installation, you can import Day.js into your JavaScript file:
const dayjs = require('dayjs');- Use via a CDN: If you prefer a no-install approach, you can link Day.js directly into your HTML via a CDN:
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dayjs.min.js"></script>With Day.js ready to use, let's start exploring its functionality.
Creating and Manipulating Dates
Creating a date in Day.js is extremely simple. You can generate the current date and time by simply calling dayjs():
const now = dayjs(); console.log(now.toString());Manipulating Dates
Day.js makes it easy to add and subtract time using its methods .add() y .subtract(). For example:
// Add 10 days to the current date const onTenDays = now.add(10, 'day'); // Subtract 30 minutes from the current date const ThirtyMinutesAgo = now.subtract(30, 'minute');Formatting Dates
One of the most common tasks when working with dates is formatting. Day.js offers the possibility of formatting dates in a very readable and flexible way:
// Human format const formatteddate = now.format('YYYY-MM-DD HH:mm:ss'); console.log(formatteddate);Date Analysis
Interpreting dates in various formats is another important feature of Day.js. The analysis dayjs(string) allows you to transform a text string into a Day.js object:
const birthday = dayjs('1990-03-25'); console.log(birthday.format('DD/MM/YYYY'));Internationalization
Day.js brings support for internationalization. Although you will need to import the locales you want to use, once done, changing the language is very simple:
const es = require('dayjs/locale/es'); dayjs.locale(es); const nowInSpanish = now.format('dddd, D [de] MMMM [de] YYYY'); console.log(nowInSpanish);Advanced Operations with Dates
Date Comparison
With Day.js, comparing dates to find out which one is earlier or if they are the same is simple and direct:
const christmas = dayjs('2023-12-25'); const newYear = dayjs('2024-01-01'); const isBefore = christmas.isBefore(NewYear); console.log(isBefore); // trueDifference between Dates
Calculating the difference between two dates is a common operation. Day.js offers us the method .diff():
const difference = christmas.diff(newyear, 'days'); console.log(difference); // -7Relative Dates
To express dates relatively, Day.js includes functionality that can be very practical:
const AWeekAgo = now.subtract(7, 'day').fromNow(); console.log(AWeekAgo); // will result in something like '7 days ago'Plugins and Functional Extensions
Day.js can be extended with plugins to add more features. For example, if you need to work with time zones, you can include the timezone plugin:
const timezone = require('dayjs/plugin/timezone'); dayjs.extend(timezone);With this plugin, working with time zones is transparent and easy.
Good Practices and Tips
Although Day.js greatly simplifies working with dates, it is important to follow some good practices:
- Immutability: Day.js creates a new instance every time a date is manipulated. It is an immutable design that ensures that the original dates are not changed unexpectedly.
- Time Zone Management: When working with applications that depend on weather in different zones, consider using the plugin
timezoneto avoid problems. - Careful Formatting and Interpretation: Be sure to specify formats correctly when interpreting and formatting dates to avoid confusion and errors.
- Optimization: Although Day.js is lightweight, it loads only the plugins you really need to keep your project optimized.
Conclusion: Why Day.js is your Best Ally in Dates and Times
Day.js stands out in the JavaScript world for its simplicity, flexibility, and lightness. Whether you're working on a small personal project or a large enterprise application, Day.js is sure to fit your date and time management needs. With its rich feature set and hands-on approach to date manipulation, Day.js becomes a powerful tool in any developer's arsenal.
To explore more about development tools and get additional resources, feel free to visit nelkodev.com. And if you have any questions or want to get in touch, you can always do so via nelkodev.com/contact. Day.js is just the beginning of a more efficient and enjoyable development experience. Hands on code and happy coding!
English 
Spanish