[ReactJS] react_chap3.1
·
React
modifier 함수를 가지고 state(setCounter)를 변경할 때 react에 의해 컴포넌트(function)가 재생성됨 (새로운 값을 가지고 리렌더링) 코드가 실행되는 과정 : 1. 버튼을 누르면 counter가 1이 됨 2. console.log(1), Total clicks: 1이 됨 3. 이는 컴포넌트 자체가 재생성 된 것임 4. 데이터(setCounter)가 바뀔때마다 컴포넌트를 리렌더링하고 UI를 refresh하는 것 바닐라 js를 대체 HTML요소를 생성하거나 찾을 필요 X 이벤트 리스너를 더해줄 필요 X UI 업데이트 필요 X -> return 안에서 HTML을 바로 생성해버렸고, 거기에서 바로 이벤트 리스너를 더해줬고, UI를 업데이트 하면 자동으로 리렌더링 됨 state를 바꾸..
[ReactJS] react_chap3.0
·
React
어플리케이션 시작 시 counter = 0 26번째 줄 render함수 실행 render 함수는 Container 컴포넌트를 root에 담아줌 어플리케이션이 막 시작되었을 때의 Container은 Total click을 가지고 있으며, counter과 연결되어있음 (20-22줄) onClick 이벤트 리스너를 통해 버튼 클릭 시 {}안의 countUp 함수가 호출 countUp함수는 counter을 증가시키고 다시 render을 호출 render 함수 호출되면 같은 과정 반복 (3. Container을 root에 넣기) 다시 반복하면 이번 Container 컴포넌트는 업데이트 된 counter을 가지고 있음 근데 이 과정은 복잡하다는 단점이 있긴 하다 :( https://nomadcoders.co/rea..
[ReactJS] react_chap2
·
React
https://nomadcoders.co/react-for-beginners ReactJS로 영화 웹 서비스 만들기 – 노마드 코더 Nomad Coders React for Beginners nomadcoders.co
[GIT] git의 작업 영역
·
GIT
Git의 작업 영역은 어떻게 나뉠까? 크게 3가지로 나뉜다고 한다. 1. working directory - 작업을 하는 프로젝트 디렉토리 2. staging area - git add를 한 파일들이 존재하는 영역. - 커밋을 하면 staging area에 있는 파일들만 커밋에 반영됨. 3. repository - working directory의 변경 이력들이 저장, 즉 커밋들이 저장되는 영역 working directory에서 파일을 작성을 하고, git add를 해서 파일을 staging area에 올리고, git commit -m "커밋 할 이름"을 실행해서 staging area에 있는 파일들을 커밋으로 남기는 것.
[GIT] error: remote origin already exists. 오류 해결 방법
·
GIT
VSCode에서 작업하던 중 error: remote origin already exists. 이런 에러가 발생했다. 해결방법은 너무 간단했다. 원래 연결되어 있던 저장소와의 연결을 끊고 소스 코드를 올리려고 하는 저장소와 새로 연결을 해주면 되는 그런 것..! 1. 우선 당황하지 않고 이렇게 원래 연결되어 있던 저장소를 없애주고 git remote remove origin 2. 올리려고 하는 깃허브의 주소를 연결해주면 git remote add origin "깃허브 주소" 3. 끄읕 참 쉽죠?
[JS] Webpack 기초
·
JavaScript
WebPack 여러 개의 파일을 하나의 파일로 묶어주는 모듈 번들러 (Module Bundler) [ 장점 ] 웹 애플리케이션의 로딩속도를 줄이기 위한 방법 : 클라이언트 (브라우저) 에서 서버로 요청하는 개수를 줄이는 것 여러 파일의 자바스크립트 코드를 압축 -> 최적화 할 수 있음 -> 로딩에 대한 네트워크 비용 절감 모듈 단위의 개발이 가능 -> 가독성과 유지보수가 쉬움 최신 자바스크립트 문법을 지원하지 않는 브라우저에서 사용할 수 있는 코드로 쉽게 변환