You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
This repository was archived by the owner on Jun 5, 2019. It is now read-only.
Copy file name to clipboardExpand all lines: docs/stack.md
+10-3Lines changed: 10 additions & 3 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -29,7 +29,7 @@ Can't imagine doing web differently to be honest. I'm sure we will soon, but for
29
29
30
30
I like `preact` as well. I feel like the switching over will be pretty simple and I probably will.
31
31
32
-
## Component Styling ##
32
+
## Components ##
33
33
34
34
> **glamor**
35
35
@@ -71,14 +71,17 @@ Start your app only when your gut says, "You'll fuck this up long before your st
71
71
72
72
`glamor` gives me that vibe. 💃
73
73
74
+
> **Storybook**
75
+
76
+
Provides a sandbox to work on your components with whatever props you can dream of wanting set to make sure your components are in tip top shape before and during use in your application. If you are writing a component you should be writing stories about it.
74
77
75
78
## Animations
76
79
77
-
**react-transition-group**
80
+
> **react-transition-group**
78
81
79
82
Brings enter + leave lifecycle events for animations.
80
83
81
-
**popmotion**
84
+
> **popmotion**
82
85
83
86
Power animation & tweening library.
84
87
@@ -145,6 +148,10 @@ This is great for spies and stubs.
145
148
146
149
Hooks require('') calls to hijack dependencies and replace with your own.
Copy file name to clipboardExpand all lines: docs/using.md
+20-1Lines changed: 20 additions & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -19,7 +19,7 @@ I'm still deciding on a simple way, but there will be a script you can run.
19
19
20
20
```sh
21
21
# this does exist yet
22
-
npm run time-to-shine
22
+
npm run time-to-shine
23
23
```
24
24
25
25
@@ -75,6 +75,25 @@ npm run watch:tests
75
75
76
76
Now when you edit your files, it'll recompile & re-run the relevant tests on the fly. And it's quick!
77
77
78
+
If you are ready to see how much of your codebase is covered simply run:
79
+
80
+
```sh
81
+
npm run coverage
82
+
```
83
+
84
+
and check out the output in the coverage folder.
85
+
86
+
87
+
## Writing Components
88
+
89
+
When you are adding new components to your app you typically will want to write stories in `storybook`. You do this by simply creating a `<component name>.story.tsx` file along side your component and then writing stories that outline the different prop usage and put it in all the states that it could be in. While you are working on the component you will want to run
90
+
91
+
```sh
92
+
npm run storybook
93
+
```
94
+
95
+
and then switch to the storybook view from the `view` menu in your app so you can get a live preview of the component you are working on.
0 commit comments