![]()
CRA(Create React App) vs ViteReact 프로젝트를 시작할 때 쓰이는 두 가지 방식 Create React App(CRA)과 Vite을 비교할 것이다.0. 프로젝트 생성 방식 (공통: 패키지 매니저는 Yarn 사용)🧱 CRA로 생성yarn create react-app cra-react⚡ Vite로 생성yarn create vite vite-react --template react1. 프로젝트 구조 비교🧱 CRA로 생성한 구조cra-react/├── node_modules/├── public/│ ├── index.html│ └── favicon.ico ...├── src/│ ├── App.js│ ├── index.js│ ├── reportWebVitals.js│..
React를 사용하는 데에는 많은 방법이 있지만, 여기서는 커맨드-라인 인터페이스(command-line interface; CLI) 툴인 create-react-app을 사용할 겁니다. 이 툴은 패키지를 설치하고 파일들을 생성하여 툴링들로 개발하는 과정을 신속히 처리함 create-react-app 없이 웹 사이트에 React를 추가하는 것은 HTML 파일에서 요소들을 복사해오는 것으로 가능하지만, create-react-app CLI는 React 애플리케이션을 만드는 가장 흔한 시작점임. 애플리케이션을 빌드하는 데에는 더 많은 시간이 걸리나 설정에 걸리는 시간은 줄일 수 있습니다.: 스크립트 요소 - HTML: Hypertext Markup Language | MDN" data-og-descripti..
![]()
React란 : 사용자 인터페이스(UI) 개발에 초점을 맞춘 프론트엔드 라이브러리복잡하고 동적인 웹 페이지 개발 시 사용이 용이페이스북에서 만든 Javascript_UI 라이브러리컴포넌트 기반 아키텍처를 기반으로 해 재사용성과 유지보수성을 높일 수 있도록 도와줌 React 개발 배경 : 웹 개발이 복잡해짐에 따라 html, css, js만으로는 한계가 생김 -> 초기에는 Web 개발을 위한 프론트엔드 라이브러리로 DOM조작을 쉽게해주는 jQuery 라이브러리가 주로 사용됨 (DOM은 문서 객체 모델(Document Object Model)의 약어로, 웹 페이지 문서를 트리 구조의 노드로 표현. Javascript를 사용해 이러한 노드를 조작할 수 있음. DOM은 웹 페이지의 요소에 동적으로 접근하고 수정..
