update next.js starter in main docs

www/apps/book/app/learn/storefront-development/nextjs-starter/page.mdx

@@ -1,12 +1,16 @@
 import { Prerequisites } from "docs-ui"
 
 export const metadata = {
-  title: `${pageNumber} Next.js Starter`,
+  title: `${pageNumber} Next.js Starter Storefront`,
 }
 
 # {metadata.title}
 
-In this chapter, you’ll learn how to install and use the Next.js Starter storefront.
+The Medusa application is made up of a Node.js server and an admin dashboard. The storefront is installed and hosted separately from the Medusa application, giving you the flexibility to choose the frontend tech stack that you and your team are proficient in, and implement unique design systems and user experience.
+
+The Next.js Starter storefront provides rich commerce features and a sleek design. Developers and businesses can use it as-is or build on top of it to tailor it for the business's unique use case, design, and customer experience.
+
+In this chapter, you’ll learn how to install the Next.js Starter storefront separately from the Medusa application. You can also install it while installing the Medusa application as explained in [the installation chapter](../../installation/page.mdx).
 
 ## Install Next.js Starter
 
@@ -15,32 +19,44 @@ In this chapter, you’ll learn how to install and use the Next.js Starter store
     text: "Node.js v20+",
     link: "https://nodejs.org/en/download"
   },
+  {
+    text: "Git CLI tool",
+    link: "https://git-scm.com/downloads"
+  },
   {
     text: "At least one region in the Medusa application.",
   },
 ]} />
 
-1. Clone the `v2` branch of the [Next.js Starter](https://github.com/medusajs/nextjs-starter-medusa):
+If you already have a Medusa application installed with at least one region, you can install the Next.js Starter storefront with the following steps:
+
+1. Clone the [Next.js Starter](https://github.com/medusajs/nextjs-starter-medusa):
 
 ```bash
 git clone https://github.com/medusajs/nextjs-starter-medusa my-medusa-storefront
 ```
 
-2. Change to the `my-medusa-storefront` directory, install the dependencies, and rename the template environment variable:
+2. Change to the `my-medusa-storefront` directory, install the dependencies, and rename the template environment variable file:
 
 ```bash npm2yarn
 cd my-medusa-storefront
 npm install
 mv .env.template .env.local
 ```
 
-3. While the Medusa application is running, start the Next.js storefront:
+3. Set the Medusa application's publishable API key in the `NEXT_PUBLIC_MEDUSA_PUBLISHABLE_KEY` environment variable. You can retrieve the publishable API key in on the Medusa Admin dashboard by going to Settings -> Publishable API Keys
+
+```bash
+NEXT_PUBLIC_MEDUSA_PUBLISHABLE_KEY=pk_123...
+```
+
+4. While the Medusa application is running, start the Next.js Starter storefront:
 
 ```bash npm2yarn
 npm run dev
 ```
 
-Your Next.js Starter Storefront is now running at `localhost:8000`.
+Your Next.js Starter storefront is now running at `http://localhost:8000`.
 
 ---
 

www/apps/book/app/learn/storefront-development/page.mdx

@@ -1,18 +1,27 @@
+import { CardList } from "docs-ui"
+
 export const metadata = {
   title: `${pageNumber} Storefront Development`,
 }
 
 # {metadata.title}
 
-Storefronts are built separately from the Medusa application. They interact with the Medusa application through the Store API routes.
-
-You're free to choose how to build your storefront. You can start with our Next.js starter storefront, as explained in the next chapter, or build a storefront from scratch using your preferred framework or tech stack.
-
-<Note title="Tip">
-
-To learn how to build a storefront from scratch, check out the [Storefront Development guides](!resources!/storefront-development).
-
-</Note>
+The Medusa application is made up of a Node.js server and an admin dashboard. Storefronts are installed, built, and hosted separately from the Medusa application, giving you the flexibility to choose the frontend tech stack that you and your team are proficient in, and implement unique design systems and user experience.
+
+You can build your storefront from scratch with your preferred tech stack, or start with our Next.js Starter storefront. The Next.js Starter storefront provides rich commerce features and a sleek design. Developers and businesses can use it as-is or build on top of it to tailor it for the business's unique use case, design, and customer experience.
+
+<CardList
+  items={[
+    {
+      text: "Install Next.js Starter Storefront",
+      href: "!resources!/nextjs-starter"
+    },
+    {
+      text: "Build Custom Storefront",
+      href: "!resources!/storefront-development"
+    }
+  ]}
+/>
 
 ---
 

www/apps/book/generated/edit-dates.mjs

@@ -8,8 +8,8 @@ export const generatedEditDates = {
   "app/learn/fundamentals/workflows/workflow-hooks/page.mdx": "2024-12-09T10:44:33.781Z",
   "app/learn/debugging-and-testing/logging/page.mdx": "2024-09-30T08:43:53.135Z",
   "app/learn/more-resources/page.mdx": "2024-07-04T17:26:03+03:00",
-  "app/learn/storefront-development/page.mdx": "2024-09-11T10:58:59.290Z",
-  "app/learn/storefront-development/nextjs-starter/page.mdx": "2024-07-04T17:26:03+03:00",
+  "app/learn/storefront-development/page.mdx": "2024-12-10T09:11:04.993Z",
+  "app/learn/storefront-development/nextjs-starter/page.mdx": "2024-12-10T09:05:18.960Z",
   "app/learn/fundamentals/page.mdx": "2024-07-04T17:26:03+03:00",
   "app/learn/fundamentals/admin-customizations/page.mdx": "2024-10-07T12:41:39.218Z",
   "app/learn/fundamentals/workflows/workflow-timeout/page.mdx": "2024-10-21T13:30:21.372Z",

www/apps/book/sidebar.mjs

@@ -479,13 +479,6 @@ export const sidebar = numberSidebarItems(
       path: "/learn/storefront-development",
       title: "Storefront Development",
       chapterTitle: "Storefront",
-      children: [
-        {
-          type: "link",
-          path: "/learn/storefront-development/nextjs-starter",
-          title: "Next.js Starter",
-        },
-      ],
     },
     {
       type: "link",

www/apps/book/utils/redirects.mjs

@@ -103,6 +103,11 @@ const redirects = async () => {
       destination: "/learn/fundamentals/:path*",
       permanent: true,
     },
+    {
+      source: "/learn/storefront-development/nextjs-starter",
+      destination: "/resources/nextjs-starter",
+      permanent: true,
+    },
   ]
 }