Open In App

How to get current date and time in firebase using ReactJS ?

Last Updated : 11 Dec, 2023
Like Article

This article provides a detailed walkthrough on obtaining the current date and time in a Firebase environment using ReactJS. Readers will gain insights into the implementation process, enabling date and time functionalities into their React projects powered by Firebase.


Steps to Create React Application And Installing Module:

Step 1: Create a React-app using the following command:

npx create-react-app myapp

Step 2: After creating your project folder i.e. myapp, move to it using the following command:

cd myapp

Step 3: After creating the ReactJS application, Install the firebase module using the following command:

npm install firebase@8.3.1 --save

Project Structure:

The updated dependencies in package.json file will look like:

"dependencies": {
"firebase": "^8.3.1",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-scripts": "5.0.1",
"web-vitals": "^2.1.4",

Example: Now implement the time and date part. Here, We are going to use a method called Timestamp which helps us to get the current date and time.


import React from 'react';
import firebase from 'firebase';
import { useState } from 'react';
function App() {
    // Current state
    const [curr, setCurr] = useState('');
    // Function to get time and date
    const getDate = () => {
        const a = firebase.firestore
    return (
                <button onClick={getDate}>
                    Show Date
export default App;

Step to Run Application: Run the application using the following command from the root directory of the project:

npm start

Output: Now open your browser and go to http://localhost:3000

Like Article
Suggest improvement
Share your thoughts in the comments

Similar Reads