I am using JavaScript to get a device number and use that to create a url. From there the user is redirected to the website. I wanted to create a simple HTML page that displays a message for a few seconds letting the user know if they are being redirected, and if they are unable to redirect the user shows an error message.

I appreciate any help you advise you can give me.

import axios from 'axios'
import { useEffect } from 'react'
import './Welcome.css'


import config from './apiConfig' // eslint-disable-line no-unused-vars

let counter = document.querySelector('h1')
let count = 1

setInterval(() => {
  counter.innerText = count
  count++
}, 1000)

const Welcome = () => {
  const fetchLocationAndRedirect = () => {
    axios
      .get(
        'apiurl'
      )
      .then((res) => {
        console.log(res.data.location_id)
        var location_id = res.data.location_id
        //Create new url
        const myURL = new URL('https://' + location_id + '.com')

        if (typeof window !== 'undefined') {
          // browser code
          window.location.href = myURL // Redirect user to my website
        }
      })
      .catch((err) => console.log(err))
    //alert('foo')
  }

  useEffect(() => {
    fetchLocationAndRedirect()
  }, [])

  return <h1 style={{ float: 'center' }}>Now redirecting you to My Website</h1>

}

export default Welcome```