react-grid-layout-component v4.0.0

React Grid Layout Component

This component allow to display a simple fixed grid layout on front of your react app.

Dependencies

• React (>=16.8)

How to use

• Install package:

$ yarn add react-grid-layout-component

or

$ npm i react-grid-layout-component

• Import <GridLayout /> component on the project root component:

import {GridLayout} from 'react-grid-layout-component/lib/GridLayout';

export const AppRoot = () => {
  return (
    <div>
      <GridLayout />
    </div>
  );
};

• GridLayout tsx component contains default props, you can overwrite as you need:

example:

<GridLayout 
  columnsNumber={6} 
  gutterSize={10} 
 />

NOTE: If you need to display a simple Grid Line Layout without gutter, set gutterSize props to 0.

Example

• Clone the repository
• Install dependencies and start dev server with one single command line:

$ yarn dev

Credit

© Willy Brauner

Licence

MIT