Hexagonal Grid Layout for React

Motivation:

The work of Jesse Breneman here.

While reading the article, I thought, "Why not build some react components for this?"

Usage:

import HexGrids, { HexGridItem, HexGridList } from "react-hex-grids"
...
<HexGridList>
  <HexGridItem>{item1}<HexGridItem>
  ....
</HexGridList>

See examples

Also available on bit.dev

bit import tsuki.react-hex-grids/hex-grids

Learn more here.

Available scripts

In the project directory, you can run:

yarn start

Runs the app in the development mode. Open http://localhost:3000 to view it in the browser.

The page will reload if you make edits. You will also see any lint errors in the console.

yarn prettier:format

Run prettier to format the code.

yarn rollup:build

Build using rollup

Contributing

PRs are always welcome 😃