title: Convert Unix Timestamp + add 1 hour
body: <p>I am working on a countdown time for multiple row using map reactjs</p>
  
  <p>I did countdown for 1 hour for multiple rows. it works fine but I have no idea how to do this with real time like using <code>new Date()</code> </p>
  
  <p>I have Unix date, for example <code>1521827247</code> how can I convert it and add 1 hour, so I will be able to make countdown</p>
  
  <p>here's my code</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="true">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>class MyComponent extends React.Component {
    constructor(props) {
      super(props);
      this.state = {
        time: {},
        seconds: 3600,
        unix: 1521827247
      };
      this.timer = 0;
      this.startTimer = this.startTimer.bind(this);
      this.countDown = this.countDown.bind(this);
    }
  
    secondsToTime(secs) {
      let hours = Math.floor(secs / (60 * 60));
      let divisor_for_minutes = secs % (60 * 60);
      let minutes = Math.floor(divisor_for_minutes / 60);
      let divisor_for_seconds = divisor_for_minutes % 60;
      let seconds = Math.ceil(divisor_for_seconds);
  
      let obj = {
        "h": hours,
        "m": minutes,
        "s": seconds
      };
      return obj;
    }
  
    componentDidMount() {
      let timeLeftVar = this.secondsToTime(this.state.seconds);
      this.setState({ time: timeLeftVar });
      this.startTimer()
    }
  
    startTimer() {
      if (this.timer == 0) {
        this.timer = setInterval(this.countDown, 1000);
      }
    }
  
    countDown() {
      // Remove one second, set state so a re-render happens.
      let seconds = this.state.seconds - 1;
      this.setState({
        time: this.secondsToTime(seconds),
        seconds: seconds,
      });
  
      // Check if we're at zero.
      if (seconds == 0) {
        clearInterval(this.timer);
      }
    }
  
    render() {
      return (
        &lt;div&gt;
          car {this.props.data.car} &lt;b&gt;Finish:&lt;/b&gt;h: {this.state.time.h}  m: {this.state.time.m} s: {this.state.time.s}
        &lt;/div&gt;
          );
    }
  }
  class Example extends React.Component {
    constructor(props) {
      super(props);
      this.state = { data: [{ "id": 1, "car": 'Audi 2018' }] };
    }
  
    addCar = () =&gt; {
      this.setState(prevState =&gt; ({
        data: [...prevState.data, { "id": 2, "car": 'New Car' }]
      }))
    }
  
    render() {
      return (
        &lt;div&gt;
          &lt;ul&gt;
            {this.state.data.map(row =&gt; &lt;MyComponent data={row} key={row.id} /&gt;)}
          &lt;/ul&gt;
          &lt;button onClick={this.addCar}&gt;Add Car&lt;/button&gt;
        &lt;/div&gt;
      );
    }
  }
  
  
  ReactDOM.render(&lt;Example/&gt;, document.getElementById('View'));</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"&gt;&lt;/script&gt;
  &lt;div id="View"&gt;&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>what to do or is there a npm package I can use?</p>