From e57a5aaa0766d45b6c6bf5005fa17f9ac3ab60f0 Mon Sep 17 00:00:00 2001
From: Misha Kaletsky <15040698+mmkal@users.noreply.github.com>
Date: Fri, 13 Oct 2023 22:55:51 -0400
Subject: [PATCH] Link to nextjs docs re app-directory SSR (#946)

---
 sections/advanced/server-side-rendering.mdx | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/sections/advanced/server-side-rendering.mdx b/sections/advanced/server-side-rendering.mdx
index a049c186..9b2d3ac5 100644
--- a/sections/advanced/server-side-rendering.mdx
+++ b/sections/advanced/server-side-rendering.mdx
@@ -84,6 +84,10 @@ Refer to [our example](https://github.com/vercel/next.js/tree/canary/examples/wi
 
 On this version, you [only need to add](https://github.com/vercel/next.js/blob/canary/examples/with-styled-components/next.config.js) `styledComponents: true,` at the compiler options in the `next.config.js` file and modify `_document` file with `getInitialProps` as in this [example](https://github.com/vercel/next.js/blob/canary/examples/with-styled-components/pages/_document.tsx) to support SSR.
 
+#### App directory
+
+For routes defined in the `app/` directory, in Next.js v13+, you'll need to put a sytled-components registry in one of your layout files, as [described in Next.js docs](https://nextjs.org/docs/app/building-your-application/styling/css-in-js#styled-components). Note that this depends on styled-components v6+. Also note that the `'use client'` directive is used - so while your page will be server-side rendered, styled-components will still appear in your client bundle.
+
 ### Gatsby
 
 [Gatsby](https://www.gatsbyjs.org/) has an official plugin that enables server-side rendering for styled-components.