Popularity
3.0
Stable
Activity
0.0
Stable
174
5
38
Monthly Downloads: 0
Programming language: JavaScript
License: MIT License
react-masonry-mixin alternatives and similar libraries
Based on the "UI Layout" category.
Alternatively, view react-masonry-mixin alternatives based on common mentions on social networks and blogs.
-
react-grid-layout
A draggable and resizable grid layout with responsive breakpoints, for React. -
golden-layout
A multi window layout manager for webapps -
react-flexbox-grid
A set of React components implementing flexboxgrid with the power of CSS Modules. -
react-masonry-component
A React.js component for using @desandro's Masonry -
react-stonecutter
Animated grid layout component for React -
react-spaces
React components that allow you to divide a page or container into nestable anchored, scrollable and resizable spaces. -
hedron
A no-frills flexbox grid system for React, powered by styled-components. -
particles-bg
React particles animation background component -
react-reflex
Resizable Flex layout container components for advanced React web applications -
react-layout-components
Layout Components for React based on Flexbox -
flexbox-react
Unopinionated, standard compliant flexbox components. You don't need to learn any propietary syntax. If you know how to use flexbox, you know how to use flexbox-react components. -
react-stack-grid
Pinterest like layout components for React.js. -
react-inline-grid
Predictable flexbox based grid for React. -
m-react-splitters
React splitter component, written in TypeScript. -
react-resizer
A React component for resizing HTML elements. -
Spokestack Tray
React Native component for adding Spokestack to a React Native app -
react-colrow
Smarter layout components. Based on css flexbox. Support responsive design, Typescript, server side render. 3 KB gzipped. -
react-schematic
Build responsive react layouts using styled schematics without an overhead of any theme configuration
Appwrite - The Open Source Firebase alternative introduces iOS support
Appwrite is an open source backend server that helps you build native iOS applications much faster with realtime APIs for authentication, databases, files storage, cloud functions and much more!
Promo
appwrite.io
Do you think we are missing an alternative of react-masonry-mixin or a related project?
README
React Masonry Mixin
Introduction:
A React.js Masonry mixin. (Also available as a component - you should use that instead!)
Live demo:
hearsay.me (web) hearsay.me (github)
Usage:
- The mixin is now bundled with Masonry, so no additional dependencies needed!
You will have to use Masonry as a script dependency, as there is no complete npm module available at the moment.You can optionally include Masonry as a script tag
<script src='//cdnjs.cloudflare.com/ajax/libs/masonry/3.1.5/masonry.pkgd.min.js' />
To use the mixin
- require the mixin and inject
React
- pass a reference and a masonry options object
- make sure you use the same reference as
ref
in your component - if you need to - access the masonry object through
this.masonry
in your component
- require the mixin and inject
example code
var React = require('react');
var MasonryMixin = require('react-masonry-mixin')(React);
var masonryOptions = {
transitionDuration: 0
};
var SomeComponent = React.createClass({
mixins: [MasonryMixin(React)('masonryContainer', masonryOptions)],
render: function () {
var childElements = this.props.elements.map(function(element){
return (
<div className="someclass">
{element.name}
</div>
);
});
return (
<div ref="masonryContainer">
{childElements}
</div>
);
}
});
module.exports = SomeComponent;