React Grid Layout - React의 그리드 시스템

React를 본격적으로 사용하는데있어서 많은 구성 요소가 필요합니다. 

그 기초가되는 것이 그리드는 아닐까요. 

그리드가 만들어지면 그 안에 내용을 배치하고 정리된 

레이아웃을 만들 수있게됩니다. 

이번 소개하는 것은 React Grid Layout, React 용 격자 레이아웃 시스템입니다. 

드래그 앤 드롭이나 크기 조정에도 대응하고 있습니다.

React Grid Layout 사용 

실제로 사용하고있는 곳입니다. 

드래그하여 이동하거나 크기를 변경할 수 있습니다. 

정적으로 이동할 수 없도록 지정할 수도 있습니다.

이 밖에 배치 정보를 localStorage에 저장 해놓고 복원 할 수 있도록하는 기능이 있고, 

꽤 다기능 그리드 시스템으로되어 있습니다. 

업무 시스템과 대시 보드 등으로 사용해 보면 편리 할 것입니다. 

React Grid Layout은 React 용 / JavaScript로 만든 오픈 소스 소프트웨어 (MIT License)입니다.

RGL Example 0 - Showcase

STRML/react-grid-layout: A draggable and resizable grid layout with responsive breakpoints, for React.