본문 바로가기

부트캠프교육중301

Virtual DOM -React는 UI의 상태를 추적하고 변화가 일어난 요소들을 빠르게 업데이트할 수 있도록 Virtual DOM이라는 가상의 DOM 객체를 활용합니다. -이 가상의 DOM 객체는 실제 DOM의 사본 같은 개념. -React는 실제 DOM 객체에 접근하여 조작하는 대신 이 가상의 DOM 객체에 접근하여 변화 전과 변화 후를 비교하고 바뀐 부분만 적용할 수 있게 됩니다. # virtual dom이 나오게 된 배경 Virtual DOM은 Real DOM의 가벼운 사본과 같습니다. Real DOM은 Browser에서 생성되는 Document Object Model을 가리키는 용어이며, Virtual DOM과 구분하기 위해 이 용어를 사용합니다. # Real Dom (DOM) -Document Object Mode.. 2023. 3. 22.
웹팩 과제하다가 살짝정리한거 #entry -기본값은 index.js -다른 엔트리포인트 지정할수있다. #Output -생성된 번들을 내보낼 위치와 이 파일의 이름을 지정하는 방법을 웹팩에 알려주는 역할. -path / filename / clean # Loader(로더) -module.rules 아래에 정의해야 한다. -test속성: 변환이 필요한 파일들을 식별하는 필수속성. test: /\.js$/ test: /\.css$/ -use속성: 변환을 수행하는데 사용되는 로더를 가리키는 필수속성. 이걸 사용하여 변환한다. 오른쪽에 있는 css먼저 실행한다. use: ['style-loader', 'css-loader'] use: [MiniCssExtractPlugin.loader, 'css-loader'] -exclude -includ.. 2023. 3. 21.
깃헙 많이쓰일만한거 git remote -v git remote add origin 주소 git remote -v git add . git commit -m "dfdfdfdfdf" git status git push -u origin master 2023. 3. 21.
웹팩 과제2 [CRA 아닌방법] npm install -D webpack webpack-cli 일반적으로 webpack이랑 webpack-cli 같이 설치한다.(안그러면 build때 오류발생할거다) webpack: 모듈 번들링을 수행하는 라이브러리. webpack-cli: 웹팩의 명령어를 실행할수 있게 해주는 도구. npm install -D babel-loader @babel/core @babel/preset-env @babel/preset-react # babel-loader -웹팩에서 사용되는 로더 중 하나. -ES6 문법으로 작성된 코드를 ES5문법으로 변환시켜주는 로더이다. # babel/core -바벨을 이용해서 코드를 변환하는 데 필요한 기능들을 제공하는 중추같은 애다.(필수적으로 깔아야되는) -트랜스파일러라고도 부른다. .. 2023. 3. 21.