React 애플리케이션에서 라이브 서버를 사용할 수 없는 이유는 무엇입니까?

Question

라이브 서버를 사용하여 React 애플리케이션을 제공하는 것이 불가능하다는 것을 알고 있습니다. 즉, js가 번들로 묶여 HTML 파일에 링크되어 있어도 파일을 정적으로 열면 React 코드가 렌더링되지 않습니다.

정적 및 동적 서버에 대해 배웠지만 React는 모두 클라이언트에서 발생하기 때문에 webpack, vite 또는 간단한 Express 서버를 사용하여 앱을 제공하는 것이 작동하지만 라이브 서버를 통해서는 작동하지 않는 이유를 이해할 수 없습니다. , 또한 수동으로 열고 작업할 수 없습니다.

차이점은 무엇인가요?

Answer 1

차이점은 JavaScript 코드가 브라우저에서 실행되는 방식입니다. 웹팩 개발 서버, 익스프레스 서버 또는 기타 유형의 서버를 통해 React 애플리케이션을 제공하는 경우 JavaScript 코드는 DOM 및 모든 Web API에 액세스하여 웹 페이지의 컨텍스트에서 실행됩니다.

그러나 HTML 파일을 정적으로 열면 JavaScript 코드가 격리된 환경에서 실행되며 Web API에 대한 액세스가 제한됩니다. 이것이 DOM 및 Web API에 의존하는 React 코드를 수동으로 열 때 작동하지 않는 이유입니다.

Webpack, vite 및 express는 React 실행에 필요한 모든 API와 서비스를 갖춘 동적 환경을 제공합니다. 이는 HTTP를 통해 애플리케이션을 웹 페이지로 제공함으로써 수행되며, 이는 브라우저에 의해 로드되고 실행됩니다.