사용방법2 [React] JSX와 리액트 컴포넌트 JSXJavaScript Syntax Extension 자바스크립트 문법 확장자HTML 마크업 코드를 작성하여 HTML 요소를 설명하고 생성할 수 있게 한다.리액트는 UI 전체와 부분을 설명하고 생성하기 위한 것이므로 JSX가 리액트 컴포넌트로 사용된다하지만 브라우저는 JSX를 읽을 수 없다.리액트 프로젝트에서는 개발 서버가 실행되면 리액트 빌드 프로세스가 브라우저에서 사용 가능한 코드로 변환한다..jsx 대신 .js만 사용하는 리액트 프로젝트로 있다.빌드 프로세스가 .js 파일 안에서도 JSX 코드를 찾을 수 있기 때문이다.리액트에서 컴포넌트로 인식되기 위한 두 가지 규칙이 있다.함수 제목이 대문자로 시작되어야 함함수에서 렌더링 가능한 값이 반환되어야 함 컴포넌트 생성function Haeader() .. 2024. 7. 5. [JS] import 와 export 사용하는 방법 import/export 문법은 여러 파일에 코드를 분리해 관리하기 위함이다. export / import {...} fromutill.jsexport let apiKey = "adfasdgkl";작성된 변수나 함수를 다른 파일에서 사용하려면 export를 추가해 준다.app.jsimport { apiKey } from "./utill.js"console.log(apiKey);다른 파일의 변수나 함수를 사용하려면 import { 변수나 함수명 } from “파일 경로”를 작성한다.리액트는 파일명에 확장자(. js)를 쓰지 않아도 된다. 빌드 프로세스가 알아서 확장자(.js)를 추가하기 때문이다. 빌드 프로세스가 없는 자바스크립트는 확장자를 입력해야 한다.변수나 함수명은 대소문자 구분해서 똑같이 입력한.. 2024. 6. 19. 이전 1 다음 반응형