react-sketchapp
A React renderer for Sketch.app
Last updated 2 months ago by mathieudutour .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install react-sketchapp 
SYNC missed versions from official npm registry.
react-sketchapp
render React components to Sketch; tailor-made for design systems

Quick-start ????‍

First, make sure you have installed Sketch version 50+, & a recent npm.

Open a new Sketch file, then in a terminal:

git clone https://github.com/airbnb/react-sketchapp.git
cd react-sketchapp/examples/basic-setup && npm install

npm run render

Next, check out some more examples!

readme-intro

npm Sketch.app Travis

Why?!

Managing the assets of design systems in Sketch is complex, error-prone and time consuming. Sketch is scriptable, but the API often changes. React provides the perfect wrapper to build reusable documents in a way already familiar to JavaScript developers.

What does the code look like?

import * as React from 'react';
import { render, Text, Artboard } from 'react-sketchapp';

const App = props => (
  <Artboard>
    <Text style={{ fontFamily: 'Comic Sans MS', color: 'hotPink' }}>{props.message}</Text>
  </Artboard>
);

export default context => {
  render(<App message="Hello world!" />, context.document.currentPage());
};

What can I do with it?

  • Manage design systems— react-sketchapp was built for Airbnb’s design system; this is the easiest way to manage Sketch assets in a large design system
  • Use real components for designs— Implement your designs in code as React components and render them into Sketch
  • Design with real data— Designing with data is important but challenging; react-sketchapp makes it simple to fetch and incorporate real data into your Sketch files
  • Build new tools on top of Sketch— the easiest way to use Sketch as a canvas for custom design tooling

Found a novel use? We'd love to hear about it!

Read more about why we built it

Documentation

Current Tags

  • 3.0.0-beta.8                                ...           beta (a year ago)
  • 3.2.6                                ...           latest (2 months ago)
  • 1.0.0-beta.5                                ...           next (3 years ago)

59 Versions

  • 3.2.6                                ...           2 months ago
  • 3.2.5                                ...           3 months ago
  • 3.2.4                                ...           3 months ago
  • 3.2.3                                ...           3 months ago
  • 3.2.2                                ...           3 months ago
  • 3.2.1                                ...           3 months ago
  • 3.2.0                                ...           4 months ago
  • 3.1.3                                ...           4 months ago
  • 3.1.2                                ...           4 months ago
  • 3.1.1                                ...           4 months ago
  • 3.1.0                                ...           7 months ago
  • 3.0.5                                ...           8 months ago
  • 3.0.4                                ...           8 months ago
  • 3.0.3                                ...           8 months ago
  • 3.0.2                                ...           8 months ago
  • 3.0.1                                ...           9 months ago
  • 3.0.0                                ...           9 months ago
  • 3.0.0-beta.9                                ...           a year ago
  • 3.0.0-beta.8                                ...           a year ago
  • 3.0.0-beta.7                                ...           a year ago
  • 3.0.0-beta.6                                ...           a year ago
  • 3.0.0-beta.5                                ...           a year ago
  • 3.0.0-beta.4                                ...           a year ago
  • 3.0.0-beta.3                                ...           a year ago
  • 2.1.2                                ...           2 years ago
  • 3.0.0-beta.2                                ...           2 years ago
  • 2.1.1                                ...           2 years ago
  • 3.0.0-beta.1                                ...           2 years ago
  • 3.0.0-beta.0                                ...           2 years ago
  • 2.1.0                                ...           2 years ago
  • 2.0.0                                ...           2 years ago
  • 1.1.0                                ...           2 years ago
  • 1.0.0                                ...           3 years ago
  • 1.0.0-beta.5                                ...           3 years ago
  • 1.0.0-beta.4                                ...           3 years ago
  • 1.0.0-beta.3                                ...           3 years ago
  • 1.0.0-beta.2                                ...           3 years ago
  • 1.0.0-beta.1                                ...           3 years ago
  • 0.12.1                                ...           3 years ago
  • 0.12.0                                ...           3 years ago
  • 0.11.6                                ...           3 years ago
  • 0.11.5                                ...           3 years ago
  • 0.11.4                                ...           3 years ago
  • 0.11.3                                ...           3 years ago
  • 0.11.2                                ...           3 years ago
  • 0.11.0                                ...           3 years ago
  • 0.10.3                                ...           3 years ago
  • 0.10.2                                ...           3 years ago
  • 0.10.0                                ...           3 years ago
  • 0.9.4                                ...           3 years ago
  • 0.9.1                                ...           3 years ago
  • 0.8.0                                ...           3 years ago
  • 0.7.0                                ...           3 years ago
  • 0.6.0                                ...           4 years ago
  • 0.5.0                                ...           4 years ago
  • 0.4.1                                ...           4 years ago
  • 0.4.0                                ...           4 years ago
  • 0.3.0                                ...           4 years ago
  • 0.2.0                                ...           4 years ago
Downloads
Today 0
This Week 3
This Month 5
Last Day 1
Last Week 63
Last Month 316

Copyright 2014 - 2016 © taobao.org |