All Projects → Astrocoders → Restyled

Astrocoders / Restyled

Licence: mit
Styled Components concept for Reason React, only works with bs-react-native for now

Programming Languages

ocaml
1615 projects
reason
219 projects
bucklescript
41 projects

Projects that are alternatives of or similar to Restyled

Reason App Shell Starter Kit
A simple App Shell starter kit that you can use to get started building your PWA with ReasonML & ReasonReact.
Stars: ✭ 49 (-27.94%)
Mutual labels:  reasonml, styled-components
React Adventure
⛰ React high-ending architecture & patterns ready for use. Made for big and small projects. PWA Ready.
Stars: ✭ 62 (-8.82%)
Mutual labels:  styled-components
Bsdoc
📚 Documentation Generator for BuckleScript
Stars: ✭ 43 (-36.76%)
Mutual labels:  reasonml
Color Schemer
A React app to help you select a color scheme, built with styled-components and polished
Stars: ✭ 55 (-19.12%)
Mutual labels:  styled-components
Gatsby Starter Typescript Deluxe
A Gatsby starter with TypeScript, Storybook, Styled Components, Framer Motion, Jest, and more.
Stars: ✭ 50 (-26.47%)
Mutual labels:  styled-components
Cabana React
A design system built especially for both Sketch and React. 💎⚛️
Stars: ✭ 58 (-14.71%)
Mutual labels:  styled-components
Moveit
🚀 NLW #4 | React+ TypeScript + NextJS + StyledComponents + Firebase + MongoDb +Axios
Stars: ✭ 39 (-42.65%)
Mutual labels:  styled-components
Reenv
dotenv-cli implementation in native ReasonML providing near-instant startup times
Stars: ✭ 65 (-4.41%)
Mutual labels:  reasonml
Koa React Notes Web
🤓 A simple SPA built using Koa (2.5.1) as the backend and React (16.4.1) as the frontend. Features MySQL integration, user authentication, CRUD note actions, and more.
Stars: ✭ 61 (-10.29%)
Mutual labels:  styled-components
Recontainers
[DEPRECATED] ReasonReact utilitary high order components
Stars: ✭ 54 (-20.59%)
Mutual labels:  reasonml
Atomize
library for creating atomic react components
Stars: ✭ 54 (-20.59%)
Mutual labels:  styled-components
React Flow Chart
A flexible, stateless, declarative flow chart library for react.
Stars: ✭ 1,051 (+1445.59%)
Mutual labels:  styled-components
Tailwind Styled Component
Create Tailwind CSS React components like styled components with class names on multiple lines and conditional class rendering
Stars: ✭ 57 (-16.18%)
Mutual labels:  styled-components
Nextjs Woocommerce
NextJS (React) eCommerce site with WooCommerce backend
Stars: ✭ 53 (-22.06%)
Mutual labels:  styled-components
Cactus
🌵A composable static site generator
Stars: ✭ 63 (-7.35%)
Mutual labels:  reasonml
Postjss
Use the power of PostCSS in compiling with JSS
Stars: ✭ 40 (-41.18%)
Mutual labels:  styled-components
Babel Plugin Css Prop
Babel plugin to transpile `css` prop to a styled component. (Experimental)
Stars: ✭ 56 (-17.65%)
Mutual labels:  styled-components
Blog Admin
使用React全家桶开发的一套博客后台管理系统
Stars: ✭ 68 (+0%)
Mutual labels:  styled-components
One Punch Fitness
A "One Punch Man"-inspired workout app!
Stars: ✭ 64 (-5.88%)
Mutual labels:  reasonml
Gitlab Search
Command line tool to search for contents in GitLab repositories
Stars: ✭ 60 (-11.76%)
Mutual labels:  reasonml

bs-restyled

Greenkeeper badge Build Status

Styled Components concept for Reason

Install

  • yarn add bs-restyled
  • Then add it to your bs-dependencies
{
  "name": "myapp",
  "reason": {
    "react-jsx": 2
  },
  "bs-dependencies": [
    "bs-react-native",
    "reason-react",
    "bs-restyled"
  ],
  "bsc-flags": ["-bs-super-errors"],
}

Usage

module Wrapper = Styled.View {
  type styleParams = unit;
  let style (_) => Style.(style([flex(1), flexDirection(`column), justifyContent(`center)]));
};

let component = ReasonReact.statelessComponent("MyView");

let make = (_children) => {
  ...component,
  render: (_self) =>
    <Wrapper>
      ...anything else...
    </Wrapper>
}

Take a look in the REStyled.re for more

Acknowledgments

Thanks everyone in Reason Discord for pointing me directions and specially to Jared who proposed this usage to me here https://gist.github.com/jaredly/a5e0102c060b7a1b40525d41f87843a8

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].