About ReacType

ReacType is a prototyping tool that allows users to visualize their application architecture dynamically, employing a drag-and-drop canvas display and a real-time component code preview. The user can create components and drag instances of these components and HTML elements onto the canvas. This architecture can then be published on a dashboard and exported as TypeScript files to be used as a starter template for any repository. The dashboard displays the user’s saved templates and published ReacType templates, providing a social platform where templates can be liked, commented on, and imported directly into the user’s canvas.

What is ReacType?

Download ReacType


Export Test Suites

With the click of a checkbox, you can export your components with Jest and Enzyme tests for not just React, but Next and Gatsby apps as well! The exported folder will include pre-configured Webpack, Jest, and Typescript files along with tests for your project.

Integrated CSS Editor with Live Demo

Copy & paste existing stylesheets or create live in the CSS Editor. As you create new instances and add styling, watch as your code dynamically renders a live demo.

Embedded Annotations

Capture important design feedback during development

State Management

Once props have been saved to state, ReacType will auto-generate React State Hooks for later use. No more prop drilling!

Compatibility With Next.js and Gatsby.js

Prototype React components compatible with Gatsby.js and Next.js applications to take advantage of server-side rendering and other features of these popular frameworks

Interactive Dashboard

Collaborate with others through the new interactive dashboard

D3 Visualization

View dynamically created components/HTML elements in the component tree