공부기록

setInterval을 이용해 1초마다 시간을 갱신해서 출력하는 코드. 재사용이 불가능하다. 다음과 같이 재사용 가능하게끔 컴포넌트를 분리시키자.

이와 같은 Comment 컴포넌트가 있다. 컴포넌트 내에서 쓰인 UserInfo나 Avatar는 재사용되기 힘들다. 다음과 같이 작게 쪼개보자 먼저 Avatar 컴포넌트부터 분리해냈다. 좀 더 일반적이고 Avatar 관점에서 바라봤을 때 어울리는 이름으로 바꿔보자. {props.author...} => {props.user...} 이제 UserInfo도 분리해보자. UserInfo컴포넌트에 Avatar가 사용되므로 UserInfo컴포넌트에 Avatar를 포함시켜준다. 이제 UserInfo와 Avatar는 재사용 가능한 컴포넌트가 됐다.

1. 자바스크립트에서 브라우저로 페이지 전환 요청을 보낼 수 있다. 단, 브라우저는 서버로 요청을 보내지 않아야한다. 2. 브라우저의 뒤로 가기와 같은 사용자의 페이지 전환 요청을 자바스크립트에서 처리할 수 있다. 이때 또한 브라우저는 서버로 요청을 보내지 않아야한다. 브라우저에는 히스토리에 state를 저장하는 스택이 존재한다. (브라우저 api의 pushState, replaceState, popState) componentDidMount(){ window.onpopstate = () => { ... }; } onClick1 = () => window.history.pushState('v1', '', '/page1'); onClick2 = () => wind..