리액트

리액트 프로젝트 명은 대문자 없이 하자 npx로 설치하기 yarn으로 설치하기

node.js > 웹브라우저만의 언어를 OS레벨의 언어로 자바스크립트는 웹브라우저 위에서만 작동하는, html + css의 기능적인 부분을 담당하는 언어였으나, node.js를 통해서 os 위에서도 자바스크립트를 사용할 수 있게 되어서 서버나 응용프로그램 제작도

리액트 프로젝트의 터미널에서npm install react-router-dom 명령어를 실행한다package.json의 dependencies에서 해당 라이브러리가 설치되어 있는지 확인한다 src 하위에 page 폴더를 만들고 Page1.jsx와 Page2.jsx 파일

jsx는 html과 유사한 형태의 코드를 사용하지만 html이 아니라는 점을 알아두어야 한다.jsx는 자바스크립트로 이루어진 유사 html이라고 생각하자.html에서는 class라는 속성을 사용하지만 jsx에서는 className이라는 속성을 사용한다.jsxhtmlht

리액트 hooks를 알아보고 올바른 사용법을 확인해본다.데이터를 관리하는 hooks리액트를 리액티브하게 만들어주는 역할을 한다.데이터가 변경되면 화면이 변경된다.화면의 데이터가 아닌 태그들을 컨트롤 할 때 주로 사용한다.논란의 여지가 있겠으나화면에 state가 많아지면

리액트 스타일 주입 방법은 다양하다.정해진 답은 없다.개인 프로젝트라면 자신이 편한 방식대로 사용하면 된다.팀프로젝트라면 팀의 컨벤션에 따라 사용하면 된다.태그 내에 스타일을 넣는 방법이다.해당 태그에만 사용하는 스타일일 경우에만 사용하자.기본적인 스타일 입력방법이다.

react-vite 프로젝트 사용 시 컴포넌트 import 시 절대경로로 사용할 수 있는데 인텔리제이에서는 기본적으로 상대경로로 import 된다.보통은 @를 사용해서 설정하는 경우가 많은데, 그렇게 하면 인텔리제이에서 제대로 인식하지 못하는 경우가 있다.그래서 아래와