+
+ Edit src/views/MainPanel.js and save to reload.
+
+
+ )
+});
+```
+
+More information can be found [here](https://tailwindcss.com/docs) to learn about tailwindcss.
+
## Isomorphic Support & Prerendering
By using the isomorphic code layout option, your project bundle will be outputted in a versatile universal code format allowing potential usage outside the browser. The Enact CLI takes advantage of this mode by additionally generating an HTML output of your project and embedding it directly with the resulting **index.html**. By default, isomorphic mode will attempt to prerender only `en-US`, however with the `--locales` option, a wide variety of locales can be specified and prerendered. More details on isomorphic support and its limitations can be found [here](./isomorphic-support.md).
diff --git a/docs/isomorphic-support.md b/docs/isomorphic-support.md
index 1783f9d1..a8be063e 100644
--- a/docs/isomorphic-support.md
+++ b/docs/isomorphic-support.md
@@ -31,6 +31,32 @@ npm pack -- --isomorphic
npm pack-p -- --isomorphic
```
+If you are using React18, you need to call `hydrateRoot` instead of `createRoot` to hydrate prerendered HTML.
+Enact CLI provides a global variable `ENACT_PACK_ISOMORPHIC` to selectively call those two APIs in your app's `index.js`.
+If you build with isomorphic option, `ENACT_PACK_ISOMORPHIC` will be `true`, otherwise `false`.
+For more detailed information, please refer to the [React 18 migration guide](https://reactjs.org/blog/2022/03/08/react-18-upgrade-guide.html#updates-to-client-rendering-apis).
+
+Whithin your **src/index.js** file, add a conditional statement to render or hydrate your app:
+```js
+/* global ENACT_PACK_ISOMORPHIC */
+import {createRoot, hydrateRoot} from 'react-dom/client';
+
+import App from './App';
+
+const appElement = (