Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

168
Views
How to show same countdown for everybody ReactJS?

i'm very novice, i trying make a countdown for reload the page every 15min for all users on my website. Actually is work but only for client side, i dont know how to do for make it "server side"

Like same countdown for everybody on website.

Maybe need to take servers side date ? but idk wow to do that .

import Countdown from "react-countdown";
import { useState, useEffect } from "react";
const twoDigits = (num) => String(num).padStart(2, '0')
// Renderer callback with condition
const renderer = ({ minutes, seconds, completed }) => {
    if (completed) {
        // Render a complete state
        return (window.location.reload(), []);
    } else {
        // Render a countdown
        return (
            <span>
                {twoDigits(minutes)}:{twoDigits(seconds)}
            </span>
        );
    }
};
const getLocalStorageValue = (s) => localStorage.getItem(s);

function RebaseCountdown() {
    const [data, setData] = useState(
        { date: Date.now(), delay: 900000, }
    );
    const wantedDelay = 900000;
    useEffect(() => {
        const savedDate = getLocalStorageValue("end_date");
        if (savedDate != null && !isNaN(savedDate)) {
            const currentTime = Date.now();
            const delta = parseInt(savedDate, 10) - currentTime;

            //Do you reach the end?
            if (delta > wantedDelay) {
                //Yes we clear our saved end date
                if (localStorage.getItem("end_date").length > 0)
                    localStorage.removeItem("end_date");
            } else {
                //No update the end date with the current date
                setData({ date: currentTime, delay: delta });

            }
        }
    }, []);
    return (
        <div>
            <Countdown
                date={data.date + data.delay}
                renderer={renderer}
                intervalDelay={3}
                autoStart={true}
                onStart={(delta) => {
                    //Save the end date
                    if (localStorage.getItem("end_date") == null)
                        localStorage.setItem(
                            "end_date",
                            JSON.stringify(data.date + data.delay)
                        );
                }}
                onComplete={() => {
                    if (localStorage.getItem("end_date") != null)
                        localStorage.removeItem("end_date");
                }}
            />
        </div>
    )
}

export default RebaseCountdown
about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!