vite

React

[React] Component & JSX

ComponentJavaScript에서 html을 리턴하는 함수함수의 첫 글자는 대문자로 작성해야 컴포넌트로 인식한다. vite를 통해 생성한 프로젝트를 실행시켰을 때 원리를 간단히 보면 1. index.html파일에서 main.jsx실행 2. main.jsx에서 App Component 렌더링 3. App Component(함수)는 html을 리턴   JSXJSX는 html과 JavaScript를 혼용해서 사용할 수 있도록 JavaScript를 eXtension한 것JSX 주의 사항1. 중괄호 내부에는 자바스크립트 표현식만 넣을 수 있다. {number %2 == 0 ? "짝수":"홀수"}2. 숫자, 문자열, 배열 값만 렌더링 된다. (객체는 오류 발생)3. 모든 태그는 닫혀있어야 한다.4. 최상위 ..

React

[React] React App 생성하기 (+ Vite)

Vite(비트)를 이용하면 React의 기본적인 패키지를 갖춘 프로젝트를 쉽게 생성할 수 있다. 1. $: npm create vite@latest 위의 명령어를 실행 후 React 선택 언어 선택 프로젝트의 기본 틀이 만들어졌다.  2. $: npm i package.json에 명시되어 있는 dependencies를 설치하기 위해 install 명령어를 입력해준다.  npm i를 통해 필요한 lib들이 패키지 내에 설치가 됨  3. npm run dev를 입력하여 React App 실행아래와 같이 로컬에서 React App이 실행된다.

개발새발
'vite' 태그의 글 목록