React_webpack
-
React 기본 : React Webpack 빌드하기 (Node 명령어 등록, 웹팩에 Babel 로더 설치)컴퓨터 알아가기/React 2021. 7. 23. 19:30
본 내용은 ZeroCho TV의 무료강좌를 기본으로 하고 있습니다. 지난 2시간은 React의 기본을 몰랐더라도 전체 팩키지가 형성되는 과정을 직접 Key-in 해보면서 이해를 해보았습니다. 이제는 기본적인 Tree가 형성이 되었으니 가장중요한 app.js를 만드는 webpack build를 해보도록 하겠습니다. Webpack Build를 하기 위해서는 명령어인 webpack을 사용하면 됩니다. 그런데 Node에서 자주보는 에러에 대해 설명하고 넘어가야겠습니다. ▒ Node 명령어 등록하기 우선 VS Code Terminal창에서 webpack이라고 타이핑하고 엔터를 쳐보면 다음과 같은 에러메시지가 표시됩니다. 즉, 프로그램으로 인식되지 않는다는 표시는 Node에서 이런 명령어가 등록되어 있지 않다라는 ..
-
React 기본 : React Webpack 기본설정하기(2)와 Module 시스템 이해하기컴퓨터 알아가기/React 2021. 7. 16. 19:30
본 강의는 ZeroCho TV의 무료강의를 기본으로 하고 있습니다. 지난시간에는 React를 사용하는데 있어서 webpack의 가장 기본적인 틀을 공부해 보있습니다. 즉, 대부분의 React에서 사용하는 create-react-app 자동기능을 수동으로 하나씩 세팅해 나가면서 React webpack에 대한 기본개념을 잡고 있습니다. 오늘은 좀 더 구체적으로 설정을 해 보도록 하겠습니다. 아래는 npm으로 설치를 한 기본구조였습니다. ▶ client.jsx에 ReactDom 렌더링 선언 React와 ReactDom을 불러온 client.jsx에 Component 렌더링 정의를 다음과 같이 합니다. 구구단 작성시 html에서와 비슷한 모습을 하고 있습니다. 이제부터는 필요한 파일을 만들면서 연관된 파일들끼..