2023년 2월

리액트는 왜 죽지 않는가?

대마불사 같은 느낌이기도 한데.. 많은 회사에서 이미 채택했고 신규 개발자들의 진입점으로 리액트를 선택하고 있는 상황이 순환되면서 리액트의 대안들이 나왔음에도 위상은 여전한 상황. 하지만 언제나 그랬듯 상황은 바뀌기 마련...

https://twitter.com/leeerob/status/1465702417513680897?s=20&t=SIo9i9rSbzf_Juz3ibnhfA 

트위터에서 즐기는 Lee Robinson

 

리액트가 children을 렌더하는 과정을 보여주는 흥미로운 시각화 자료

- 또 다른 자료

 

연속된 form 제출을 다루는 흥미로운 기술

 

2023년 이후의 반응형 디자인 가이드

- 반응형은 단순히 미디어 쿼리가 아니다. fluid 사이즈 조정과 컨테이너 쿼리 등 지금은 전보다 진보된 반응형 디자인을 할 수 있는 시기.

- https://web.dev/new-responsive/

 

Modularizing React Application

결제를 예시로 어떻게 모듈화를 할 수 있는지에 대한 친절한 설명.

 

Next.js app directory 설계 이해하기

 

React.js Documentary

 

도전없이는 할 수 없는 React.js 채택

 

map과 set의 이해와 사용하는 방법

- Object 보다 Map을 선호해야 할 때는 언제인가?

- Object는 코드 작성 시점에 정의되는 경우와 일회성인 경우 사용한다.(config 같은 경우)

- 코드 작성 시점에 키를 알 수 없고 런타임중 키의 추가 삭제가 빈번한 경우 Map을 사용한다.

- Object가 작은 수의 정수를 키로 갖는 경우를 제외하고 Map이 삽입, 삭제, 순회 성능에서 더 나은 성능을 보인다.

- Array는 순서가 중요하고 중복이 가능한 경우 사용

- Set은 중복이 없으며 순서가 필요없는 경우 사용

 

아래의 코드를 예시로 Compound Component 설계를 하는 방식

context API를 사용한 재미있는 컴포넌트 설계를 보여줌

function App() {
  return (
    <Toggle onToggle={on => console.log(on)}>
      <ToggleOn>The button is on</ToggleOn>
      <ToggleOff>The button is off</ToggleOff>
      <ToggleButton />
    </Toggle>
  )
}

 

2023년 React 라이브러리

 

웹을 서비스하는 4가지 방법

 

Computer Science 강의(수업을 놓친 사람들을 위한 짧고 함축적인 내용)