• Stars
    star
    164
  • Rank 230,032 (Top 5 %)
  • Language
    TypeScript
  • License
    MIT License
  • Created about 8 years ago
  • Updated over 3 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Inline your Storybooks server in VS Code

React Native Storybook

Select storybooks inside your editor.

https://github.com/orta/vscode-react-native-storybooks/raw/master/preview.gif

How do I use it?

Install it, ensure that the configuration is right. You should see a new section under the files in the Explorer panel called "Storybook".

🎉

If your react-native server crashes, use the command "Reconnect Storybook to VS Code" to re-connect.

What does it do?

  • Connect to the React Native storybooks web socket.
  • Single click a story to open it in your simulator.
  • Double click to open story in your editor.
  • Search / picker for quick story activation

Configuration

  • react-native-storybooks.host: string (default: "localhost")
  • react-native-storybooks.port: number (default: 7007)
  • react-native-storybooks.storyRegex: string (default: "**/*.story.*")
  • react-native-storybooks.storybookFilterRegex: string (default: ".")

You can either change these in your user settings, or per-project you can create a .vscode/settings.json file and add them there.

Filtering

If you work with quite a lot of stories in a project, it can be a bit of a chore to scroll through them all, so you can use setting react-native-storybooks.storybookFilterRegex to filter down the shown stories. If you do this on your user settings then only you will see the changes.

You can also access the quick picker menu with:

  • the Storybook search / picker command; or
  • via shortcuts:
    • CTRL+K S on Windows
    • CMD+K S on Mac

Known Issues

Nothing critical ATM.

More Repositories

1

ARAnalytics

Simplify your iOS/Mac analytics
Objective-C
1,834
star
2

cocoapods-keys

A key value store for storing per-developer environment and application keys
Ruby
1,551
star
3

GIFs

A Mac App for finding GIFs
Objective-C
602
star
4

pragmatic-testing

Pragmatic testing ebook
Ruby
542
star
5

vscode-twoslash-queries

VS Code extension which adds support for twoslash queries into typescript projects
TypeScript
426
star
6

ORStackView

Vertically stack views using Auto Layout, with an order specific subclass that uses view tags for ordering.
Objective-C
423
star
7

Snapshots

An Xcode Plugin to show the state of FBSnapshot Tests.
Objective-C
363
star
8

typescript-notes

High-level notes about TypeScript
320
star
9

cocoapods-fix-react-native

A CocoaPods plugin for hot-patching React Native per-version
Ruby
243
star
10

You-Can-Do-It

Is learning a new language getting you down? Worry not, this Xcode plugin will keep you motivated.
Objective-C
240
star
11

chairs

Swap around your iOS Simulator Documents
Ruby
227
star
12

SpeedS-ver

A Mac OS X Screensaver - Shows people doing speedruns as your screensaver.
Objective-C
146
star
13

iMessage-Style-Receding-Keyboard

A demo application for showing how to drag the keyboard down with your finger.
Objective-C
137
star
14

wwdc_parties_2014

What is happening in WWDC 2014
109
star
15

Wallpapers

A Mac App for Downloading Wallpapers.
Objective-C
92
star
16

RedXcode

When Xcode is being ran in a debugger, make it obvious that it's in dev mode by turning it red and adding a cool banner.
Objective-C
91
star
17

twitter-urls-to-clients

Safari / Chrome extension to convert all Twitter.com urls to mac twitter app specific URLs
JavaScript
87
star
18

Puttio

A Universal iOS App for Put.IO
Objective-C
87
star
19

awesome-typescript-derived-languages

Projects which have taken "TypeScript" and made it more than just 'JS with Types'
85
star
20

recommendations

A source-format agnostic way of providing recommendations
Ruby
82
star
21

dna

my dna in raw text
79
star
22

Essence

A VSCode UI.
CSS
77
star
23

ORSimulatorKeyboardAccessor

Use your keyboard in the iOS simulator with a blocks based API
Objective-C
73
star
24

AppCode

Custom Setup for App Code
66
star
25

Heuristics-for-vendoring-MIT-code

A quick readme covering the cases where you would import code
59
star
26

danger-junit

Lets you report your test suite problems back to the PR elegantly
Ruby
58
star
27

keyboard_shortcuts

Notes on Keyboard Shortcuts for the Mac. Oriented towards technical but not programmers.
53
star
28

TypeScript-TSServer-Plugin-Template

TypeScript
53
star
29

Snapshots-Peek

Show-off your Snapshots in Xcode
Objective-C
52
star
30

vscode-playdate

TypeScript
51
star
31

gh_inspector

A gem that makes it easy to find existing issues for exceptions via GitHub issues
Ruby
49
star
32

WibbleQuest

A Text Adventure Game framework for iOS
Objective-C
46
star
33

OROpenSubtitleDownloader

An Obj-C API for Searching and Downloading Subtitles from OpenSubtitles.
Objective-C
46
star
34

Mixtapes

an iPad app for making mixtapes using Spotify
Objective-C
44
star
35

react-storybooks-relay-container

Storybook template for Relay containers
JavaScript
39
star
36

typescript-stickers

Stickers for TypeScript
39
star
37

youtube

Scripts for videos and talks
39
star
38

GIFKit

A source for GIFs
Objective-C
37
star
39

OROpenInAppCode

Opens the current xcworkspace / xcproject in AppCode.
Objective-C
37
star
40

vscode-ios-common-files

This Extension adds Ruby syntax highlighting for CocoaPods and Fastlane stuff
JavaScript
35
star
41

playground-slides

Make presentations in the TypeScript playground
CSS
35
star
42

travish

Badly emulates the Travis workflow from a .travis.yml
Ruby
34
star
43

danger-plugin-yarn

Provides dependency information on dependency changes in a PR *
TypeScript
30
star
44

Snapshots-app

A Mac App for viewing view-based Snapshot tests
Objective-C
30
star
45

Preferences

Add preferences support for your Xcode plugins.
Objective-C
29
star
46

cocoapods-no-dev-schemes

Removes all the CocoaPods Shared Schemes from Developer Pods
Ruby
27
star
47

relay-redwood-app-example

An example of using Relay in Redwood
TypeScript
27
star
48

OctoDog

A Swift PM module for accessing the GitHub API
Swift
27
star
49

orta

Profile bio
JavaScript
26
star
50

github-webhook-event-types

TypeScript type definitions for GitHub's events
TypeScript
26
star
51

cocoapods-xcautotest

Automatically inject new test classes into your iOS simulator without restarts.
C
26
star
52

danger-plugin-spellcheck

Spell checks any created or modified code or markdown files in a GitHub PR
TypeScript
26
star
53

GotTheRoutesLikeSwagger

Ruby app to take a Swagger API and generate NSURLRequests.
Ruby
25
star
54

cocoapods-always-be-bundleing

A CocoaPods Plugin that stops
Ruby
25
star
55

nightly-profile-updater

HTML
25
star
56

ar_dispatch

Dispatch functions run async code synchronous in tests
Objective-C
25
star
57

cocoapods-expert-difficulty

Make your CocoaPods experience even harder, by ignoring platforms from lib authors
Ruby
24
star
58

PonyDebuggerApp

A host app for Pony Debugger
Objective-C
24
star
59

danger-plugin-lighthouse

Print your Lighthouse reports to your PR
HTML
22
star
60

typescript-web-extension

A cross-browser extension for working with TypeScript code
JavaScript
22
star
61

github-clippers

Automate away the annoying requests for you to close your branches after PR merges in Safari
JavaScript
22
star
62

Relay-Artist-Example

An example React Native app using Relay to access the Artsy GraphQL API
Objective-C
22
star
63

FUSEHub

A MacFUSE filesystem for browsing a github repository
Objective-C
21
star
64

playground-collaborate

Collaborate in the TypeScript Playground
TypeScript
21
star
65

ImageCachingExamples

A complete example of using SDWebImage to do synchronous image loading for FBSnapshots
Swift
18
star
66

github-activity-writer

TypeScript
18
star
67

GitDawg

React Native Components for GitHawk
Ruby
17
star
68

Tinker

A Text Adventure Game Framework for Swift
Swift
17
star
69

pull-lock

Run commands based on changes during a git pull
TypeScript
17
star
70

playground-transformer-timeline

Lets you see each stage of the transform process for a TypeScript JS + DTS emit as a timeline.
TypeScript
16
star
71

FastImageCacheExample

The simplest possible use of FastImageCache
Objective-C
16
star
72

gh-commentify

A repo you can use to work-around GH issue comment request limits
TypeScript
15
star
73

vscode-themes

vscode-themes
JavaScript
15
star
74

playground-clippy

JavaScript
15
star
75

vigilant

Glues Quick & Nimble together. Makes sure you run an expectation on every test.
Objective-C
15
star
76

redwood-object-identification

TypeScript
14
star
77

md-type-tables

JavaScript
14
star
78

mogenerator-template

A mogenerator template that generates more human-readable _Class files
14
star
79

react-native-45-typescript-example

An example of taking react-native's default template and making it work with typescript
JavaScript
14
star
80

systems-theory

React Native in TypeScript that feels good
JavaScript
13
star
81

notes

An exploration on keeping public notes
CSS
13
star
82

playground-typescript-json-schema

TypeScript
13
star
83

nakama-typescript-example

An example of a nakama server using 2022's bleeding edge TypeScript tooling
JavaScript
13
star
84

Arena-for-Safari

Adds an are.na button to Safari
JavaScript
13
star
85

video-notes

notes for video editing
12
star
86

snazzy

A Snazzy README generator for your public API built on SourceKitten
Ruby
12
star
87

playground-plugin-tsquery

Run TSQuery in the TypeScript Playground
TypeScript
12
star
88

orta.github.com

orta blog
JavaScript
12
star
89

markdown-magic-inline-types

Inline TypeScript types into markdown files
JavaScript
12
star
90

snake-in-typescript

Lua
11
star
91

redwood-codegen-api-types

Replacement types generator for your Redwood API
TypeScript
11
star
92

omakase-create-react-app-example

Using CRA 2.1 to re-create a chunk the the omakase stack
JavaScript
11
star
93

windows-notes

Things to think about in switching from macOS to Windows
11
star
94

snowpack-plugin-hmr-phaser

JavaScript
11
star
95

cocoapods_generate_unit_tests

An experiment in scripting an entirely runnable xcodeproject + tests in ruby
Ruby
10
star
96

life

General issue tracker for things that I should get around to doing
10
star
97

ts-playgrounds-github

Quickly go from a TS code sample to the TypeScript playground
Objective-C
10
star
98

playground-ts-scanner

TypeScript
10
star
99

vscode-typescript-playground-links

An extension which improves working with the TypeScript playground
TypeScript
10
star
100

Steps

A iPhone 5S -> Fitbit app
Objective-C
10
star