본문 바로가기

개발/React11

[React] webpack 설치하기 1 create-react-app 명령어 없이 webpack 설치하기 1. npm init 전부 엔터치다가 author 만 입력 author : 본인이름 - > package.json 파일이 생성된다. 2. npm i react react-dom i : 설치 단축어 package.json 파일의 dependencies 에 생성된다 3. npm i -D webpack webpack-cli -D : 개발할때만 쓰인다를 의미하는 옵션. 실제 서비스에는 웹팩 필요 x package.json 파일의 devdependencies 에 생성된다. 4. npm i -D @babel/core @babel/preset-env @babel/preset-react babel-loader npm i react-refresh @pmm.. 2022. 2. 15.
[React] 리액트 기본 개념 1. React 에서 사용하는 기본개념 공부 State : 바뀔 여지가 있는 부분, 변하는 부분 ( 버튼클릭 시 ~~로 변한다) setState : 수동으로 바꿔야 하는 부분 onSubmit : 주로 form 태그가 있을 때 사용 onClick : form 없이 버튼만 클릭할 때 사용 jsx : js + xml Node : 자바스크림트 실행기. 서버x 2. class 와 hooks 의 차이 - class setState 가 일어날 때마다 렌더링된다. Render 부분만 렌더링 된다. - hooks hooks 로 함수 만들어서 실행하면 함수 전부가 렌더링된다. class 보다 더 오래 걸릴 수 도 있다. 3. 함수를 사용하는 이유 rendering 할 때 마다 함수를 새로 만들면 낭비이기 때문에 함수 따로.. 2022. 2. 15.
[React] webpack.config.js devServer publicPath 오류 / 해결 ✓ 문제 [webpack-cli] Invalid options object. Dev Server has been initialized using an options object that does not match the API schema. - options has an unknown property 'publicPath'. These properties are valid: object { allowedHosts?, bonjour?, client?, compress?, devMiddleware?, headers?, historyApiFallback?, host?, hot?, http2?, https?, ipc?, liveReload?, magicHtml?, onAfterSetupMiddleware?, o.. 2022. 2. 7.