말랑말랑제리스타일

신규 프로젝트를 구상하면서 React JS로 Header, Footer, Sidebar가 있는 레이아웃을 만들 일이 생겼습니다.React 화면 컨트롤은 Browser Router를 사용했고 이왕 만드는 거 다른 프로젝트에서 재사용 가능하도록 최대한 모듈을 구분해서 만들어봤습니다.React 프로젝트 화면 구조 구상일단 이번에 생성할 React 프로젝트의 레이아웃 뼈대는 요런식으로 만들 겁니다.Header, Footer를 따로 빼고 메인 화면 좌측에 Sidebar를 넣어줄 예정이며, App Screen 부분을 Router를 이용해 이동시킬 겁니다. React 프로젝트 레이아웃 뼈대를 잡기 위한 프로젝트 생성먼저 VS Code와 node JS는 React를 해보신 분이라면 어렵지 않게 설치하실 테고, 이미 설..

리액트 5.0 이상 버전 사용 시 특정 npm 모듈에서 "BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default " 에러가 발생했습니다. 제 경우는 GIFEncoder 모듈에서 webpack 에러가 발생했는데요. 가장 간단한 조치 방법을 알려드리겠습니다. 모듈의 버전을 바꿔서 webpack 에러 조치하는 방법 리액트 버전이 올라감에 따라 해당 노드 모듈도 신버전이 나왔을 수 있습니다. 이런 경우 해당 노드 모듈의 버전을 webpack 5 이상이 적용된 새로운 버전으로 업그레이드해주면 에러가 발생하지 않겠죠. 하지만 GIFEncoder.js를 포함해 대부분의 노드 모듈이 webpack 5 이상에 대한..