웹 개발 (Frontend Developer)/React9 Single Page Application (SPA) 싱글 페이지 애플리케이션은 웹 브라우저가 전체 페이지를 새로 로드하는 기본 방식 대신, 웹 서버로부터 새로운 데이터를 받아 현재 웹 페이지를 동적으로 다시 작성하는 웹사이트 또는 웹 애플리케이션입니다. 따라서 사용자는 서버에서 새로운 페이지를 로드하지 않고도 웹사이트를 사용할 수 있어, 성능이 향상되고 보다 인터랙티브한 경험을 얻을 수 있습니다. 반면 A 페이지를 만들면 A html 템플릿, B 페이지를 만들면 B html 템플릿 방식은 전통적인 웹 사이트를 만들 때 사용하는 Multi-Page Application 입니다. 동적 상호작용 : 전체 페이지를 다시 로드하지 않고 빈번한 사용자 상호작용이 필요한 애플리케이션의 경우실시간 업데이트 : 원활한 사용자 경험을 위해 실시간 응답성이 중요한 경우풍.. 2024. 10. 8. React에 Node.js와 CRP 리액트 프로젝트를 만들기 위해서 Node.js와 NPM을 먼저 설치해야합니다. 크롬 V8 자바스크립트 엔진으로 빌드한 자바스크립트 런타임으로서, 웹 브라우저 환경이 아닌 것에서도 자바스크립트를 사용하여 연산 할 수 있습니다. 리액트 앱은 웹 브라우저에서 실행되는 코드여서 Node.js와 직접적인 연관은 없지만, 프로젝트를 개발하는 데 주요 도구들이 Node.js를 사용하기 때문에 필요합니다. 이 때 사용하는 개발 도구는 바벨, 모듈화된 코드를 한 파일로 합치고 코드를 수정할 때 마다 웹 브라우저를 리로딩하는 등 여러 기능을 지닌 웹팩 등이 있습니다. 웹 페이지 빌드 과정 (중요 렌더링 경로 / Critical Rendering Path CRP)>브라우저가 서버에서 페이지에 대한 HTML 응답을 받고.. 2024. 10. 6. 리액트란 (React) 무엇인가? React는 사용자 인터페이스를 만들기 위한 Javascript 라이브러리입니다. 리액트는 인터렉션이 많은 웹 앱을 개발하기 위해서 주로 사용됩니다. 물론 React와 비슷한 역할을 하는 Angular나 Vue 가 존재하지만 이들은 라이브러리가 아닌 프레임워크입니다. - 프레임워크는 어떠한 앱을 만들기 위해 필요한 대부분의 것을 가지고 있는 것입니다. (프레임 워크 안에 다양한 라이브러리가 포함되어 있습니다). 저희가 작성한 소스 코드를 호출합니다. - 라이브러리는 어떠한 특정 기능을 모듈화 해놓은 것입니다. 소스 코드는 어떤한 기능을 구현하기 위해서 라이브러리를 호출하게 됩니다. 리액트가 라이브러리인 이유는 리액트는 전적으로 UI를 렌더링 하는 데 관여하기 때문입니다. 리액트는 라이브러리이지만, 다.. 2024. 10. 4. 이전 1 2 다음