From 3a8aeecc91384718aa4edc6f0b27e4f57865cb42 Mon Sep 17 00:00:00 2001 From: Shahed nasser Date: Tue, 24 Oct 2023 17:41:18 +0300 Subject: [PATCH] docs: improved create-medusa-app structure --- www/apps/docs/content/admin/quickstart.mdx | 4 +-- www/apps/docs/content/cli/reference.mdx | 2 +- www/apps/docs/content/create-medusa-app.mdx | 35 ++++++++++--------- .../deployments/admin/deploying-on-vercel.mdx | 4 +-- .../storefront/deploying-next-on-vercel.mdx | 4 +-- .../add-middleware-express-route.mdx | 4 +-- .../development/api-routes/add-middleware.mdx | 4 +-- .../api-routes/example-logged-in-user.mdx | 4 +-- .../content/development/backend/install.mdx | 4 +-- .../development/services/create-service.mdx | 4 +-- .../development/services/extend-service.mdx | 4 +-- .../docs/content/plugins/file-service/s3.mdx | 4 +-- .../docs/content/plugins/payment/stripe.mdx | 4 +-- .../starters/nextjs-medusa-starter.mdx | 4 +-- .../_reusable-section.mdx | 4 +-- .../index.tsx | 12 ++++--- 16 files changed, 54 insertions(+), 47 deletions(-) rename www/apps/docs/src/components/{Troubleshooting => DetailsList}/index.tsx (57%) diff --git a/www/apps/docs/content/admin/quickstart.mdx b/www/apps/docs/content/admin/quickstart.mdx index 4bc9143492aa0..8fc02b1a5a06f 100644 --- a/www/apps/docs/content/admin/quickstart.mdx +++ b/www/apps/docs/content/admin/quickstart.mdx @@ -4,7 +4,7 @@ addHowToData: true --- import Feedback from '@site/src/components/Feedback'; -import Troubleshooting from '@site/src/components/Troubleshooting' +import DetailsList from '@site/src/components/DetailsList' import AdminLoginSection from '../troubleshooting/signing-in-to-admin.md' import CorsSection from '../troubleshooting/cors-issues.md' @@ -179,7 +179,7 @@ Can't find your language? Learn how you can contribute by translating the admin ## Troubleshooting Installation - + --- diff --git a/www/apps/docs/content/create-medusa-app.mdx b/www/apps/docs/content/create-medusa-app.mdx index 8b99e1bd5c99e..da1b6144f2f4a 100644 --- a/www/apps/docs/content/create-medusa-app.mdx +++ b/www/apps/docs/content/create-medusa-app.mdx @@ -8,7 +8,7 @@ import TabItem from '@theme/TabItem'; import Feedback from '@site/src/components/Feedback'; import DocCardList from '@theme/DocCardList'; import Icons from '@theme/Icon'; -import Troubleshooting from '@site/src/components/Troubleshooting' +import DetailsList from '@site/src/components/DetailsList' import TypeErrorSection from "./troubleshooting/create-medusa-app-errors/_typeerror.md" import OtherErrorsSection from "./troubleshooting/create-medusa-app-errors/_other-errors.mdx" import EagainError from "./troubleshooting/create-medusa-app-errors/_eagain-error.md" @@ -19,16 +19,6 @@ import InvalidTokenError from './troubleshooting/create-medusa-app-errors/_no-br # Install Medusa with create-medusa-app -In this document, you’ll learn how to use create-medusa-app to set up a Medusa backend and an admin dashboard. - -:::tip - -`create-medusa-app` allows you to install and setup a Medusa backend project with minimal configurations. If you're more familiar with Medusa or you need to have more control over the configurations of the Medusa backend, such as database connection details, you can either use the [command's options](#command-options) to customize the setup, or use the [backend quickstart instead](./development/backend/install.mdx). - -::: - -## Overview - Medusa is a toolkit for developers to create digital commerce applications. In its simplest form, Medusa is a Node.js backend with the core API, plugins, and modules installed through npm. `create-medusa-app` is a command that facilitates creating a Medusa ecosystem. It installs the Medusa backend and admin dashboard, along with the necessary configurations to run the backend. @@ -73,7 +63,10 @@ In your terminal, run the following command: -### Command Options +
+ +Command Options + The `create-medusa-app` command can accept the following options: @@ -87,7 +80,12 @@ The `create-medusa-app` command can accept the following options: - `--directory-path `: Allows specifying the parent directory path to create the directory of the new project in. - `--with-nextjs-starter`: Installs the Next.js starter storefront under the `-storefront` directory, where `` is the name of the project you enter in the first question. If the `-storefront` directory already exists, random characters are added at the end of `-storefront`. -### Example: Connect to a Vercel PostgreSQL Database +
+ +
+ +Example: Connect to a Vercel PostgreSQL Database + If you want to use a PostgreSQL database hosted on Vercel, you must use the `--db-url` option and add to the end of your connection URL `?sslmode=require`. For example: @@ -101,7 +99,12 @@ If the database already has the necessary migrations and you don't need the comm ::: -### Example: Connect to a Supabase Database +
+ +
+ +Example: Connect to a Supabase Database + If you want to connect to a Supabase database, you must use the `--db-url` option with its value beign the connection URL to your Supabase database. For example: @@ -115,7 +118,7 @@ If the database already has the necessary migrations and you don't need the comm ::: ---- +
## Step 2: Specify Project Name @@ -220,7 +223,7 @@ Based on what you're building, you can find a development path for you in the Re ## Troubleshooting - -const Troubleshooting: React.FC = ({ sections }) => { +const DetailsList: React.FC = ({ sections }) => { return ( <> {sections.map(({ title, content }, index) => ( @@ -20,11 +21,14 @@ const Troubleshooting: React.FC = ({ sections }) => { key={index} className={clsx(index !== 0 && "border-t-0")} > - {content} + {React.isValidElement(content) && content} + {!React.isValidElement(content) && typeof content === "string" && ( + content + )} ))} ) } -export default Troubleshooting +export default DetailsList