https://github.com/realstandal/redwoodjs-twin.macro-emotion-example
RedwoodJS example using Twin.Macro and EmotionJS, powered by TailwindCSS-utilities.
https://github.com/realstandal/redwoodjs-twin.macro-emotion-example
Last synced: 3 months ago
JSON representation
RedwoodJS example using Twin.Macro and EmotionJS, powered by TailwindCSS-utilities.
- Host: GitHub
- URL: https://github.com/realstandal/redwoodjs-twin.macro-emotion-example
- Owner: realStandal
- License: mit
- Created: 2021-03-24T08:13:14.000Z (about 4 years ago)
- Default Branch: master
- Last Pushed: 2021-03-24T09:35:47.000Z (about 4 years ago)
- Last Synced: 2025-01-23T22:26:17.271Z (4 months ago)
- Language: TypeScript
- Size: 286 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Redwood: Twin.Macro & Emotion Example
> I saw some people talking about Twin and Emotion on the Redwood Discord and decided to share my experience integrating these tools with Redwood.
This example includes the setup required to use [`twin.macro`](https://github.com/ben-rogerson/twin.macro) and [`emotion`](https://emotion.sh/docs/introduction) within a RedWoodJS application, featuring the utilities offered by [`TailwindCSS`](https://tailwindcss.com/).
It also uses the new Redwood `0.27` TypeScript `create-redwood-app` setting.
Instructions on how to reproduce this repository can be found [here](https://github.com/realStandal/my-redwoodjs-tips-n-workflows/blob/main/twin-macro-emotion.md#redwoodjs-using-twinmacro--emotion).
## Usage
To view this example (though I recommend you [set-it-up yourself](https://github.com/realStandal/my-redwoodjs-tips-n-workflows/blob/main/twin-macro-emotion.md#redwoodjs-using-twinmacro--emotion)), `clone` this repository and `install` all dependencies using Yarn.
`yarn rw storybook` should start the Storybook server, containing three example components, each built using a different `twin.macro` method.