by Sai gowtham

How to get the current date in React

In this tutorial, we are going to learn about how to access the current date in a react app.

Using new Date() constructor

We can use the new Date() constructor to get the current date in a react component.

The new Date() constructor creates a new date instance that contains the following methods to construct the full date.

getDate() method: It returns the day of the month.

getMonth() method: It returns the month of a year, where 0 is January and 11 is December.

getFullYear() method: It returns the year in four-digit format (YYYY).

Example:

App.js
import React from "react";

export default function App() {
  const current = new Date();
  const date = `${current.getDate()}/${current.getMonth()+1}/${current.getFullYear()}`;
  return (
    <div className="App">
      <h1>Current date is {date}</h1>    </div>
  );
}

Output:

React current date

Top Udemy Courses

JavaScript - The Complete Guide 2020 (Beginner + Advanced)
JavaScript - The Complete Guide 2020 (Beginner + Advanced)
45,614 students enrolled
52 hours of video content
View Course
React - The Complete Guide (incl Hooks, React Router, Redux)
React - The Complete Guide (incl Hooks, React Router, Redux)
284,472 students enrolled
40 hours of video content
View Course
Vue JS 2 - The Complete Guide (incl. Vue Router & Vuex)
Vue JS 2 - The Complete Guide (incl. Vue Router & Vuex)
130,921 students enrolled
21 hours of video content
View Course