Today I Learned

HOC (고차 컴포넌트)는 컴포넌트를 가져와 새 컴포넌트를 반환하는 함수

메모이제이션은 이전에 계산한 값을 메모리에 저장함으로써 프로그램 실행 속도를 빠르게 하는 기술

Profiler는 React 애플리케이션이 렌더링하는 빈도와 렌더링 "비용"을 측정

컴포넌트 트리를 넘어 데이터를 공유할 수 있는 방법

Potal ? > Portal은 부모 컴포넌트의 DOM 계층 구조 바깥에 있는 DOM 노드로 자식을 렌더링하는 최고의 방법을 제공합니다. 첫 번째 인자(child)는 엘리먼트, 문자열 혹은 fragment와 같은 어떤 종류이든 렌더링할 수 있는 React 자식입니다

Modern JavaScript date utility library

Visual primitives for the component age.Use the best bits of ES6 and CSS to style your apps without stress 💅🏾

Sass is the most mature, stable, and powerful professional grade CSS extension language in the world.

The most beautiful and efficient way to develop HTML5 hybrid and mobile web apps.

And Design > Help designers/developers building beautiful products more flexible and working with happiness

semantic ? 의미론적 웹 => 기계가 이해할 수 있는 웹페이지

React Bootstrap >The most popular front-end framework Rebuilt for React. install css

bring your componenets to life with simple spring animation primitives!

Framer is a tool built for interactive design. Backed by React, technical users can extend anything through code.

Mock(모의 데이터)을 만들어서 활용하는 방식

Officail React bindings for ReduxRedux

Atoms는 상태의 단위이며, 업데이트와 구독이 가능하다.

Recoil 다룰 기능 todo 아이템 추가 todo 아이템 수정 todo 아이템 삭제 todo 아이템 필터링 유용한 통계 표시 > 그 과정에서, 우리는 Recoil API에 의해 노출된 atoms, selectors, atom families와 hook를 다룰 것이다. 최적화 또한 다룰 것이다. Atoms Atoms는 애플리케이션 상태의 sour...

비동기 데이터 쿼리 Synchronous Example (동기 예제) 여기 user 이름을 얻기위한 간단한 동기 atom 과 selector를 예로 들어보겠습니다. Asynchronous Example (비동기 예제) 만약 user의 이름이 쿼리 해야하는 데이터베이스에 저장되어 있었다면, Promise를 리턴하거나 혹은 async 함수를 사용하기만 ...

데이터 가져오기를 위한 React Hooks

The Most Modern Mobile Touch Slider

Performant and powerful data synchronization for React

Node.js를 위한 빠르고 개방적인 간결환 웹 프레임워크

데이터가 로드되기 전에 콘텐츠의 자리비움(placeholder)을 표시

캐러셀은 사전적 의미로 회전 목마

API를 통해서 많은 양의 데이터를 가져와 화면에 렌더링해야 하는 경우 자칫하면 성능 문제를 야기할 수 있음

모달은 기본 창 (window) 위에 컴포넌트를 뛰우는 방식

사용자가 스크롤링 하다가 미리 로드된 콘텐츠를 다 확인하면 다음 목록을 로드

Preview !codesandbox[infinite-scroll-intersection-observer-x765xv?fontsize=14&hidenavigation=1&theme=dark] 리액트 프로젝트 생성 useInfiniteScroll : target element 와 intersection observer options 을 props 으...

Calendar UI