Start working on app-level documentation

docs/faq.mdx

@@ -25,15 +25,6 @@ This is the recommendation by `next-themes` to supress the warning stemming from
 
 - [@timneutkens](https://github.com/haydenbleasel/next-forge/pull/170#issuecomment-2459255583)
 
-## Why is the `api` separate from the `web` app?
-
-The API is separated from the web app for two reasons:
-
-1. To isolate functions that are not part of the main user-facing application i.e. background jobs, cron jobs, webhooks, etc.
-2. To provide a dedicated endpoint for non-web applications e.g. mobile apps, smart home devices, etc.
-
-Functionally speaking, it doesn't matter as much if you're running these projects on Vercel. Serverless functions are all independent pieces of infrastructure and can scale independently.
-
 ## Why are certain folders ignored by the linting configuration?
 
 There are three types of files that are ignored by the linting configuration:

docs/features/database.mdx

@@ -67,10 +67,6 @@ This runs the following commands:
 - `npx prisma generate` to generate the Prisma client
 - `npx prisma db push` to push the schema changes to the database
 
-## Prisma Studio
+## Visual database editor
 
-next-forge includes Prisma Studio, which is a visual editor for your database. To start it, run the following command:
-
-```sh Terminal
-pnpm dev --filter studio
-```
+next-forge includes a [visual database editor](/structure/apps/studio) that allows you to view and edit your database records.

docs/features/email/resend.mdx

@@ -28,8 +28,4 @@ await resend.emails.send({
 
 ## Previewing Emails
 
-To preview the emails templates, simply run the `email` app:
-
-```sh Terminal
-pnpm dev --filter email
-```
+To preview the emails templates, simply run the [`email` app](/structure/apps/email).

docs/mint.json

@@ -42,6 +42,10 @@
       "name": "Getting Started",
       "url": "/"
     },
+    {
+      "name": "Structure",
+      "url": "/structure"
+    },
     {
       "name": "Features",
       "url": "/features"
@@ -70,8 +74,20 @@
       "pages": ["setup/prerequisites", "setup/installation"]
     },
     {
-      "group": "Structure",
-      "pages": ["structure/apps", "structure/packages"]
+      "group": "Apps",
+      "pages": [
+        "structure/apps/api",
+        "structure/apps/app",
+        "structure/apps/docs",
+        "structure/apps/email",
+        "structure/apps/storybook",
+        "structure/apps/studio",
+        "structure/apps/web"
+      ]
+    },
+    {
+      "group": "Packages",
+      "pages": ["structure/packages"]
     },
     {
       "group": "",
@@ -101,7 +117,6 @@
             "features/design-system/typography"
           ]
         },
-        "features/documentation",
         {
           "group": "Email",
           "pages": ["features/email/clerk", "features/email/resend"]
@@ -130,7 +145,6 @@
           ]
         },
         "features/storage",
-        "features/storybook",
         "features/toolbar",
         "features/webhooks",
         {
@@ -278,7 +292,7 @@
     },
     {
       "source": "/documentation",
-      "destination": "/features/documentation"
+      "destination": "/structure/apps/docs"
     },
     {
       "source": "/documentation/fumadocs",
@@ -322,7 +336,7 @@
     },
     {
       "source": "/storybook",
-      "destination": "/features/storybook"
+      "destination": "/structure/apps/storybook"
     },
     {
       "source": "/webhooks",

docs/overview.mdx

@@ -3,11 +3,35 @@ title: Overview
 description: Overview of next-forge
 ---
 
+<Frame>
+  <img src="/images/structure/apps.png" alt="" />
+</Frame>
+
 ## What is next-forge?
 
 next-forge is a production-grade [Turborepo](https://turbo.build/repo) template for [Next.js](https://nextjs.org/) apps. It is designed to be a comprehensive starting point for new apps, providing a solid, opinionated foundation with a minimal amount of configuration.
 
-It is a culmination of my experience building web apps over the last decade and is designed to get you to build your new SaaS app as quick as possible
+It is a culmination of my experience building web apps over the last decade and is designed to get you to build your new SaaS app as quick as possible.
+
+## How it works
+
+next-forge is a monorepo, which means it contains multiple packages in a single repository. This is a common pattern for modern web applications, as it allows you to share code between different parts of the application, and manage them all together.
+
+The monorepo is managed by [Turborepo](https://turbo.build/repo), which is a tool for managing monorepos. It provides a simple way to manage multiple packages in a single repository, and is designed to work with modern web applications.
+
+The monorepo contains the following apps:
+
+| App | Documentation | Port | Recommended URL |
+| --- | ----------- | ---- | --------------- |
+| `api` | [API](/structure/apps/api) | 3002 | `api.acme.com` |
+| `app` | [App](/structure/apps/app) | 3000 | `app.acme.com` |
+| `docs` | [Docs](/structure/apps/docs) | 3004 | `docs.acme.com` |
+| `email` | [Email](/structure/apps/email) | 3003 | |
+| `storybook` | [Storybook](/structure/apps/storybook) | 6006 | |
+| `studio` | [Studio](/structure/apps/studio) | 3005 | |
+| `web` | [Web](/structure/apps/web) | 3001 | `acme.com` |
+
+While you can choose to run these apps on the subdomain of your choice, the recommended subdomains are listed above. Remember to add them to your [environment variables](/features/env) under `NEXT_PUBLIC_APP_URL`, `NEXT_PUBLIC_WEB_URL`, and `NEXT_PUBLIC_DOCS_URL`.
 
 ## Philosophy
 

docs/structure/apps/api.mdx

@@ -0,0 +1,13 @@
+---
+title: API
+description: The next-forge API explained
+---
+
+next-forge exports the API from the `apps/api` directory. It is designed to be run separately from the main app, and is used to run serverless functions e.g. webhooks and cron jobs.
+
+The API is separated from the web app for two reasons:
+
+1. To isolate functions that are not part of the main user-facing application i.e. background jobs, cron jobs, webhooks, etc.
+2. To provide a dedicated endpoint for non-web applications e.g. mobile apps, smart home devices, etc.
+
+Functionally speaking, it doesn't matter as much if you're running these projects on Vercel. Serverless functions are all independent pieces of infrastructure and can scale independently.

docs/structure/apps/app.mdx

@@ -0,0 +1,8 @@
+---
+title: App
+description: The next-forge main app explained
+---
+
+next-forge exports the main app from the `apps/app` directory. It is designed to be run on a subdomain of your choice, and is used to run the main user-facing application.
+
+The main app is built with [shadcn/ui](https://ui.shadcn.com/) and is designed to be a starting point for your own projects. It includes a variety of components, hooks, and utilities to help you get started.

docs/structure/apps/email.mdx

@@ -0,0 +1,10 @@
+---
+title: Email
+description: The email of next-forge
+---
+
+To preview the emails templates, simply run the `email` app:
+
+```sh Terminal
+pnpm dev --filter email
+```

docs/structure/apps/studio.mdx

@@ -0,0 +1,10 @@
+---
+title: Studio
+description: The studio of next-forge
+---
+
+next-forge includes Prisma Studio, which is a visual editor for your database. To start it, run the following command:
+
+```sh Terminal
+pnpm dev --filter studio
+```

docs/structure/apps/web.mdx

@@ -0,0 +1,5 @@
+---
+title: Web
+description: The web of next-forge
+---
+