$$config title: [React] 프로젝트 생성 keywords: - IT - react $$ ## React 프로젝트 생성 프로젝트 생성할 폴더에서 프롬프트를 실행시킨 후 아래 명령어 입력 ```npx create-react-app react_project(프로젝트명)``` 완료되면 설정한 프로젝트명으로 폴더가 생성됨 ## Visual Studio Code 폴더 정리 - 필요없는 css, js 파일 정리 - src > components 폴더 생성 후, 제작한 component를 정리 이때, 파일명의 첫 문자는 대문자로 표기한다 ## 상위 파일에서 하위 파일 연동 ```jsx # 예시 상위파일 import React, { useState } from "react"; # React와 Component를 import 시킨다. import Counter from "./components/Counter"; import Converter from "./components/Converter"; import Mybtn from "./components/Mybtn"; function App() { const [counter, setCounter] = useState(0); return ( <> # 사용할 Component 파일명 입력 후, component파일에서 사용할 변수 입력 #

); } export default App; ``` ```jsx # 예시 하위 파일 import React, { useState } from "react"; function Counter({ counter, setCounter }) { const onClickfunc = () => { setCounter(counter + 1); }; return (

{counter}번 클릭했습니다

); } export default Counter; ```