리액트로 제작하는 와중 질문

안녕하세요! 강의를 다 들은 후 혼자 원하는 웹앱을 작성하다 궁금한 점이 생겨서 문의드립니다.

function App() {

  let navigate = useNavigate();
  const slideRef = useRef();
  let [slide,setSlide] = useState(slideList);
  let [count,setCount] = useState(1);

  let roof = setInterval(()=>{
    if(count < slide.length){
      setCount(count+1);
    }else{
      setCount(1);
    };    
    clearInterval(roof);

  },5000)
  console.log(count)
  
  if(count === 3){
    slideRef.current.style.transform = 'translateX(0)'
  };

------첫번재 코드 ------
첫번째 코드를 이용하면 slideRef.current.style.trasform이 잘 작동하더라구요 그래서 저 부분에

  if(count === 3){
    slideRef.current.style.transform = 'translateX(0)'
  }else{
    slideRef.current.style.transform = `translateX(-${
      window.innerWidth * count
    }px)`
  }

이렇게 추가를 해주니 
Uncaught TypeError: Cannot read properties of undefined (reading 'style')
    at App (App.js:29:1)
    at renderWithHooks (react-dom.development.js:16305:1)
    at mountIndeterminateComponent (react-dom.development.js:20074:1)
    at beginWork (react-dom.development.js:21587:1)
    at HTMLUnknownElement.callCallback (react-dom.development.js:4164:1)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:4213:1)
    at invokeGuardedCallback (react-dom.development.js:4277:1)
    at beginWork$1 (react-dom.development.js:27451:1)
    at performUnitOfWork (react-dom.development.js:26557:1)
    at workLoopSync (react-dom.development.js:26466:1)
이러한 오류가 반복되는데 어느 부분이 문제인지 궁금하여 질문드립니다.