package.json
-
[React 기초] Webpack 설치 및 실행 (기본편) : 1탄 - 자바스크립트 웹팩컴퓨터 알아가기/React 2023. 12. 27. 19:30
구구단 게임 예제를 통하여 Class형 Component든 함수 Component든 하나의 모듈 개념으로 Component가 관여하는 것을 알 수 있었습니다. 하지만 실제 예에서는 하나의 Component만 사용되는 경우는 거의 없고 수천 수만가지의 Component가 사용이 되어 하나의 프로그램을 이룹니다. 이렇게 수많은 Component(자바스크립트 프로그램)를 하나로 통하하여 효율적으로 사용할 수 있는 프로그램을 웹팩(Webpack)으로 불립니다. 이러한 프로그램을 자동으로 통합하여 Webpack으로 만들어 주는 프로그램 또한 머리 좋은 누군가가 개발하여 Create-react-app이라는 프로그램으로 널리 통용되나 근본적인 내용을 모르면 사칙연산을 모르고 수학문제를 푸는 경우가 같기 때문에 조금 ..
-
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 Web-pack 기본 설정하기컴퓨터 알아가기/React 2021. 7. 15. 19:30
본 내역은 ZeoCho TV의 무료웹강의를 기본으로 하고 있습니다. 드디어 Web-pack이라는 개념까지 와버렸네요. 아직 느낌은 React 1도 모르겠는데 말입니다. 아주 기본적인 개념은 지금까지 연습한 React는 Component 1개를 가지고 연습을 했으나 실제적으로 활용되는 Component의 개수는 표현할 수 없을 정도로 많다고 합니다. Facebook 자체가 2만개 이상의 Component로 이루어졌다고 하니 말입니다. 이럴경우 코딩상에서 전부 Component를 정의하고 관리하고자 하면 불가능에 가까울 수 밖에 없겠죠? 이러한 비효율적 코딩작업을 방지하기 위해 개발된 것이 웹팩(Web-pack)이라는 개념입니다. 즉, 하나의 Package로 프로그래밍을 지원하는 개념인거죠. 이러한 웹팩을 ..