홍준혁

첫 번째 기능 - Automatic Batching setState는 호출될 때마다 리렌더링이 일어나게 된다. 정말로 그럴까? 사실 리액트에서는 조금 다르게 동작한다. 호출될 때마다 리렌더링을 작업하게 된다면 정말 비효율적인 방법일 것이다. 다음 코드를 보도록 하자. function App() { const [count, setCount] = useState(0); const [flag, setFlag] = useState(false); function handleClick() { setCount(c => c + 1); // 리렌더링 발생 setFlag(f => !f); // 리렌더링 발생 set... // 리렌더링 set... // 리렌더링 set... // 리렌더링 set... // 리렌더링 set...

이번에는 리액트를 빌드하면 이런 화면이 뜨게 되는데 다른 플랫폼에서 웹사이트를 접속하는 법을 알려주도록 하겠다. 하지만 조건이 있는데, 접속하는 플렛폼은 반드시 같은 네트워크에 있어야 한다. 윈도 기준으로 설명하겠다! 윈도우키 + R을 눌러서 실행창에 cmd라고 검색한다 그러면 우리가 잘 아는 시꺼먼 창이 나올 텐데, 거기서, ipconfig라고 치자. 그러면 우리가 해킹하는 거 마냥 촤르르 뭐가 많이 나올 텐데, 무선 LAN 어댑터 Wi-Fi: 이 부분에 IPv4 주소라는 곳이 있을 것이다. 그 부분이 옆에 XXX.XXX.X... 이런 형식의 ip주소가 있을 텐데, 이제 이걸 알아냈으면 다 왔다. 우리가 접속할 플랫폼에 주소창에다가 http://아까 얻어낸 IP주소:포트번호 이렇게 검색을 해보면 우리가..

타입 스크립트는 자바스크립트의 슈퍼셋이다. 타입 스크립트를 사용하면 개발자 입장에서 좋은 코드를 작성할 수 있게 된다. (바보 같은 오류를 방지해준다.) 그래서 리액트에서 타입 스크립트를 사용해보자. 먼저 디렉터리를 만들고 CRA를 해준다. 이렇게 해주면 자동으로 타입 스크립트가 설정된 리액트가 프로젝트가 만들어진다. 기본적으로 만들어진 프로젝트에 App과 index를 남기고 다 지워도 무방하다. - 이렇게 파일 구조를 생성해주자. 그다음에 APP에서 styled-components를 이용해서, import styled, { createGlobalStyle } from 'styled-components'; styled와 createGlobalStyle을 선언해주자. 이렇게 되면 GlobalStyle컴포넌..