🐨CoalaCoding
Docs▾
JavaScriptReactHTML & CSSBackendAI & LLMDev ToolsCreative
B반1
👾숏츠
🙉B반2
게시판
🐨CoalaCoding

개발자를 위한 한국어 웹 기술 문서

문서

  • JavaScript
  • React
  • HTML & CSS
  • Backend
  • AI & LLM
  • Dev Tools
  • Creative

커뮤니티

  • 게시판
  • 예제 모음

기타

  • 관리자

정책

  • 소개
  • 개인정보처리방침
  • 이용약관
  • 연락처
© 2026 CoalaCoding. All rights reserved.
  • React 학습 전 필수 JavaScript 문법
  • 1. React 소스 코드 수정, 배포 및 렌더링
  • 2. 시작
  • 2. JSX 문법과 컴포넌트
  • 3. react-vite-설치
  • 3. 이벤트 처리
  • 4. 노코드리액트
  • 4. Hook
  • 5. csrssrreact-렌더링-참조글
  • 5. useContext로 전역 상태 관리
  • 6. 컴포넌트
  • 6. CSS 리액트에 넣는 5가지 방법
  • 7. 시작하기
  • 7. Props (속성)
  • 8. 2-scaffolding-react-project
  • 8. React Router
  • 9. props
  • 9. React 개발 환경 이해
  • 10. 3-웹문서-작성하기
  • 11. 컴포넌트
  • 12. map과컴포넌트
  • 13. event
  • 14. 4-리액트로-변경하기
  • 15. 컴포넌트-데이터관리
  • 16. composition
  • 17. 앱제작-준비
  • 21. 환경설정
  • 24. 컴포넌트-전략
  • 25. 리액트-네이버-로그인
  • 26. 리액트교안
  1. 홈
  2. 문서
  3. React
  4. React 기초
  5. 8. 2-scaffolding-react-project

8. 2-scaffolding-react-project

1. Scaffolding React Project

  1. 프로젝트 폴더를 최상위로 연다.
  2. 필요 없는 파일 삭제 (이미지에 표시된 파일을 삭제)

  1. 코드수정 - 표시된 부분을 삭제

  1. App.tsx 코드 추가수정→표시된 부분 삭제 하고 코드작성

function App() {
  return <h1>HI</h1>;
}

export default App;

  1. 앱 실행 하기 npm run dev

  1. 터미널에 응답이 출력되면서 local 주소가 확인되면 브라우저 주소창에 해당 링크로 이동하여 렌더링 결과를 확인한다.

  1. 실행 화면 확인

목차

  • 1. Scaffolding React Project