feat(mermaid): add mermaid rendering support

Author: kentcdodds

docs/mdx.md

@@ -153,3 +153,20 @@ video.
 ```tsx
 <EpicVideo url="https://www.epicweb.dev/workshops/full-stack-foundations/styling/intro-to-full-stack-foundations-workshop" />
 ```
+
+## Mermaid
+
+You can use [mermaid](https://mermaid.js.org/) to create diagrams.
+
+```mermaid
+sequenceDiagram
+    Alice->>John: Hello John, how are you?
+    John-->>Alice: Very Great!!!!!
+    Alice->>John: See you later!!
+```
+
+This is rendered on the server using a Cloudflare Worker because I can't stand
+things not being rendered on the server and popping in after the page has
+loaded!
+
+If the connection is slow, the diagram will be rendered on the client.

example/exercises/01.nested-routing/01.problem.outlet/README.mdx

@@ -12,6 +12,15 @@ this exercise. 😌 Sup: `this is some code`
 
 <LinkToApp to="/whatever">Go to whatever</LinkToApp>
 
+## Mermaid
+
+```mermaid
+sequenceDiagram
+    Alice->>John: Hello John, how are you?
+    John-->>Alice: Really Great!
+    Alice->>John: See you later!!
+```
+
 ### DiffLink example
 
 <DiffLink app1={0} app2={4} />

example/package.json

@@ -5,11 +5,11 @@
     "title": "Web App Fundamentals 🔭",
     "subtitle": "Learn the foundational tools and skills of building web applications",
     "product": {
-      "host": "www.epicai.pro",
+      "host": "www.epicreact.dev",
       "slug": "react-fundamentals",
       "logo": "/images/logo.svg",
-      "displayName": "EpicAI.pro",
-      "displayNameShort": "Epic AI",
+      "displayName": "EpicReact.dev",
+      "displayNameShort": "EpicReact",
       "discordChannelId": "1285244676286189569",
       "discordTags": [
         "1285246046498328627",