Prodotype - ReactJS generator, streamline your editor's UI.

  •        18

In your js file - e.g. see this demo script for a complete / real world example. Create a folder with a .yaml file and a .ejs file - see the sample/ folder to see examples of templates.

https://github.com/silexlabs/Prodotype

Dependencies:

babel-polyfill : ^6.9.1
babel-preset-es2015 : ^6.9.0
babel-preset-react : ^6.11.1
babel-preset-stage-0 : ^6.5.0
babelify : ^7.3.0
brace : ^0.9.1
browserify : ^13.0.1
ejs : ^2.5.5
js-yaml : ^3.6.1
node_modules-path : ^1.0.5
react : ^15.2.0
react-ace : ^3.5.0
react-dom : ^15.2.0
react-tap-event-plugin : ^1.0.0

Tags
Implementation
License
Platform

   




Related Projects

storybook - UI component dev & test: React, Vue, Angular, React Native, Ember, Web Components & more!

  •    TypeScript

Storybook is a development environment for UI components. It allows you to browse a component library, view the different states of each component, and interactively develop and test components. Storybook runs outside of your app. This allows you to develop UI components in isolation, which can improve component reuse, testability, and development speed. You can build quickly without having to worry about application-specific dependencies.

react-bluekit - Automatically generating a component library from your React components (ES5, ES6, Typescript)

  •    Javascript

BlueKit automatically generates a library from your React components with editable props and live preview. Point BlueKit to folders with your React components and it will generate a library for you. You'll be able to browse through the components, tweak their props, and see the changes live. Furthermore, any changes that you make to your components' code will be reflected in the library.

rebass - :atom_symbol: React UI component library & design system, built with styled-components and styled-system

  •    Javascript

React UI component library & design system, built with styled-system, with support for styled-components & emotion. Rebass is a library of highly-composable, primitive UI components for React, built with styled-components to keep styles isolated and reduce the need to write custom CSS in your application. Based upon a configurable design system, Rebass‘s props API makes building consistent, responsive web apps simpler and faster.

gestalt - A set of React UI components that supports Pinterest’s design language

  •    Javascript

Gestalt is a set of React UI components that enforces Pinterest’s design language. We use it to streamline communication between designers and developers by enforcing a bunch of fundamental UI components. This common set of components helps raise the bar for UX & accessibility across Pinterest. That syntax is Webpack specific (and will work with Create React App), but you can use Gestalt anywhere that supports ES6 module bundling and global CSS.

design-system-react - Salesforce Lightning Design System in React

  •    Javascript

Welcome to the project! 👋 This library is the React implementation of the Salesforce Lightning Design System. This library has a peer dependency on @salesforce-ux/design-system, react, and react-dom. It is tested with React 16 and has a stable API despite its version number. Please polyfill this library in order to meet your target environment needs. Please view Create React App Setup for more information on using this library with Create React App.


teaset - A UI library for react native, provides 20+ pure JS(ES6) components, focusing on content display and action control

  •    Javascript

A UI library for react native, provides 20+ pure JS(ES6) components, focusing on content display and action control. Tips: In the Android system, the animations is not smooth, switch to the release mode can be resolved.

storybook - Interactive UI component dev & test: React, React Native, Vue, Angular

  •    Javascript

Storybook is a development environment for UI components. It allows you to browse a component library, view the different states of each component, and interactively develop and test components. Storybook runs outside of your app. This allows you to develop UI components in isolation, which can improve component reuse, testability, and development speed. You can build quickly without having to worry about application-specific dependencies.

shards-react - ⚛️A beautiful and modern React design system.

  •    Javascript

Shards React is a free, beautiful and modern React UI kit based on Shards. Getting started with Shards React is fairly simple. You can download Shards React via the official website, here on GitHub as a release package or by using a package manager such as Yarn or NPM.

smooth-ui - Modern React UI library 💅👩‍🎤🍭

  •    Javascript

Modern React UI library. Code less, do more. Smooth UI is a style system / UI library for React. It works with Styled Components 💅 or Emotion 👩‍🎤.

IBAnimatable - Design and prototype customized UI, interaction, navigation, transition and animation for App Store ready Apps in Interface Builder with IBAnimatable

  •    Swift

Design and prototype customized UI, interaction, navigation, transition and animation for App Store ready Apps in Interface Builder with IBAnimatable. Here is the full design in a Storyboard in Interface Builder.

zent - A collection of essential UI components written with React.

  •    Javascript

Zent ( \ˈzent\ ), a collection of essential UI components written with React. Zent ( \ˈzent\ ) is a React component library developed and used at Youzan. Zent provides a collection of essential UI components and lots of useful domain specific components.

material-ui - React components that implement Google's Material Design.

  •    Javascript

React components that implement Google's Material Design. Material-UI is available as an npm package.

Semantic-UI-React - The official Semantic-UI-React integration

  •    Javascript

See the Documentation for an introduction, usage information, and extensive examples.These great products are built on Semantic UI React. Add yours here.

mobiscroll - Cross platform UI controls for progressive web and hybrid apps (plain JS, jQuery, Angular and React)

  •    CSS

Mobiscroll is a UI library for progressive webapps and hybrid development. Created with a lot of attention to usability and performance. Mobiscroll Forms ships with 15 customizable controls that you can use for free that are included in this repository. Use Forms with the premium products that can be found on the Mobiscroll website. You can use the controls in web and hybrid/native cross-platform apps. At it's core Mobiscroll is framework agnostic, but API variants for jQuery/jQuery Mobile, Angular/Ionic, Angular JS/Ionic 1 and React is available.

office-ui-fabric-react - React components for building experiences for Office and Office 365.

  •    TypeScript

Fabric React is a responsive, mobile-first collection of robust components designed to make it quick and simple for you to create web experiences using the Office Design Language.Here is a step by step tutorial on how to build a simple React app with an Office UI Fabric React component.

element-react - Element UI

  •    Javascript

Element was initially written in Vue, which has many elegant UI components, but we also love React, so we forked it for the React community.Before the building, you need a style theme, here we recommend you to pick up element-theme-default.

element-react - Element UI

  •    Javascript

Element was initially written in Vue, which has many elegant UI components, but we also love React, so we forked it for the React community. Before the building, you need a style theme, here we recommend you to pick up element-theme-default.