공부/React3 JSX(Javascript Syntax eXtension) JSX란?JSX는 자바스크립트의 확장 문접이다. 리액트에서는 이 JSX를 이용해서 화면에서 UI가 보이는 모습을 나타내준다. JSX를 이용하면 UI를 나타낼 때 자바스크립트(logic)와 HTML구조(markup)를 같이 사용할 수 있기 때문에 기본 UI에 데이터가 변하는 것들이나 이벤트들이 처리되는 부분을 더욱 쉽게 구현할 수 있습니다. 리액트에서 JSX 사용은 의무인가?의무는 아니지만 자바스크립트 안에서 UI 작업을 하는데 너무 편리하기 때문에 React를 사용할 때는 대부분 JSX를 사용한다. 리액트에서 화면을 그리는 방식리액트는 가상돔과 같은 리액트만의 방식을 통해서 화면에 렌더링을 해주기 때문에 보통 HTML을 parsing해서 화면에 보여주는게 아닌 다른 방식을 통해서 홤녀에 보여주게 된다. .. 2024. 10. 6. SPA(Single Page Application) public/index.htmlHtml 템플릿에서 div 엘레멘트의 id를 root로 되어있다. src/index.js자바스크립트 시작점이다. 여기서 위에 root id를 가진 div엘레멘트를 잡아준다. 그래서 그 엘리멘트 안에서 화면을 꾸밀 수 있게 된다. SPA(Single Page Application)여기서 한가지 의문점이 생긴다. 그것은 index.html 템플릿이 하나면 한 개의 페이지 만들 때는 괜찮은데 두 개 이상의 페이지를 만들 때는 어떤식으로 해야할까? 원래 A페이지를 만들면 A.html, b페이지를 만들면 B.html 이런식으로 만들었다. 위와 같은 방식이 전통적인 웹 사이트를 만들 때 사용하는 Multi Page Application이다. 하지만 요즘에는 웹 사이트의 전체 페이지를 .. 2024. 10. 6. React App 실행하기 2024. 10. 6. 이전 1 다음
