tometo-dev / react-hex-grids

Hexagonal Grid Layout for react

Home Page:https://www.npmjs.com/package/react-hex-grids

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Hexagonal Grid Layout for React

Hexagonal Grid Layout Demo


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 😃

About

Hexagonal Grid Layout for react

https://www.npmjs.com/package/react-hex-grids

License:MIT License


Languages

Language:JavaScript 37.7%Language:CSS 34.2%Language:TypeScript 14.8%Language:HTML 13.3%