RunKit + 
Try any Node.js package right in your browser
This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 1,000,000+ packages pre-installed, including aphrodite. Try it out:
// Aphrodite server-side rendering example
// Make a component that generates some styles and returns some HTML.
function render() {
const {StyleSheet, css} = require("aphrodite/no-important");
// Make some styles
const styles = StyleSheet.create({
red: {
color: "red",
":hover": {
color: "blue",
},
},
});
// Generate some CSS with Aphrodite class names in it.
return `<div class=${css(styles.red)}>
Hover, and I'll turn blue!
</div>`;
}
const {StyleSheetServer} = require("aphrodite");
// Call our render function inside of StyleSheetServer.renderStatic
const {css, html} = StyleSheetServer.renderStatic(() => {
return render();
});
// Observe our output HTML and the Aphrodite-generated CSS
`<style>${css.content}</style>${html}`;
- all documents on RunKit are public
require()any package directly from npm- use arrow functions, classes, template strings, and most of ES6
awaitany promise instead of using callbacks (example)- create your own embedded node.js snippets
This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.