rsnext/examples/styled-jsx-with-csp

Styled-JSX with Content Security Policy

This example showcases how you can use nonce for style-src directive in Content Security Policy with styled-jsx.

Checkout the demo and notice the following,

• style-src directive in Content-Security-Policy response header.
• meta tag to pass on the nonce to styled-jsx for client-side rendering.
• style tags with nonce attributes.

Deploy your own

Deploy the example using Vercel or preview live with StackBlitz

How to use

Execute create-next-app with npm, Yarn, or pnpm to bootstrap the example:

npx create-next-app --example styled-jsx-with-csp styled-jsx-with-csp-app

yarn create next-app --example styled-jsx-with-csp styled-jsx-with-csp-app

pnpm create next-app --example styled-jsx-with-csp styled-jsx-with-csp-app

Deploy it to the cloud with Vercel (Documentation).