开始使用 Medusa：开源的 Shopify 替代方案
这是关于如何开始使用 Medusa 的系列文章的第一篇。第二部分已发布，请访问“Medusa 入门指南 第二部分：打造专属服务器”。
开发者首先想到的热门电商平台有很多，Shopify 就是其中之一。Shopify 已成为众多企业搭建电商网站的首选平台之一。然而，它也存在诸多缺点，例如收费以及定制化程度有限。而 Medusa 正好可以弥补这些不足。
Medusa是一款开源的无头电商引擎，速度快且可定制。Medusa 由三个核心组件构成：无头电商部分（提供商店的 REST API）、商店前端和管理面板。您可以自由选择使用整个平台，也可以根据您的电商商店需求选择所需的组件。
在本系列教程中，您将学习如何使用 Medusa 创建电子商务商店。这包括设置开发环境、向后端、前端和管理面板分别添加功能和插件，以及使用 Medusa 设置电子商务商店可能需要的一切。
在本教程系列的这一部分，您将学习如何分别安装和运行平台的各个组件，并了解每个组件的结构，从而明白需要在哪里执行哪些操作。然后，您将学习如何使用单个命令将所有不同的组件组合在一起。
美杜莎
自定义能力
如果您只是想创建一个无需任何定制的基础网店，或者您本身不精通技术，那么 Shopify 是一个不错的选择。但是，如果您希望掌控自己的技术栈并根据业务需求进行调整，那么 Shopify 就不适合您。选择 Shopify 后，您只能使用平台默认提供的功能和架构。
另一方面，Medusa 的主要特点在于其灵活性和可扩展性。您可以同时使用所有三个核心组件，也可以选择其中部分组件，并将其与其他技术或系统结合使用或集成。
您仍然可以完整地使用它，并获得出色的开发和用户体验。后端基于 Node.js 和 Express 构建，服务器首次安装时默认使用 SQLite，您也可以选择使用PostgreSQL和Redis。
前端方面，您可以选择使用基于Next.js或Gatsby构建的入门级店铺。无论选择哪种方案，最终都会得到一个连接到无头服务器的静态网站，因此网站速度几乎可以保证很快。
至于后端，它也是用 Gatsby 构建的，并且像前端一样连接到你的服务器。
这使得 Medusa 与其他紧密耦合、复杂且速度缓慢的电商平台截然不同。Medusa 提供丰富的开箱即用功能，并允许您根据自身需求进行定制。与 Shopify 相比，Medusa 让您可以完全掌控自己的技术栈，而 Shopify 则不提供这种掌控。
定价
Shopify 的定价模式可能是一个很大的劣势，因为还有很多其他替代方案，包括 Medusa，它们都提供免费的电子商务平台。
使用和部署该平台不仅需要付费，而且很难找到免费的插件或主题。此外，由于平台缺乏灵活性，安装插件也并非易事。
这就是开源软件的优势所在。您可以免费使用和部署 Medusa。此外，还有一个开源社区为您提供支持，他们会提供免费的插件供您使用。由于 Medusa 的灵活性，安装插件非常简单。
商业应用案例
如前所述，Shopify 的灵活性不足，难以定制。这意味着许多商业应用场景，包括 B2B、电商平台、定制购物体验等等，在 Shopify 上都无法实现或无法应用。
如果您确信您的业务只会通过传统的电商模式销售产品，那可能不成问题。但是，如果您已经规划了业务增长，需要一个能够随着业务发展而扩展的电商平台，那么选择 Shopify 将会非常麻烦。
Medusa 的无头 API 和灵活性使您可以轻松创建插件，以根据您的用例定制购物体验，或根据需要将 Medusa 与其他服务集成。
先决条件
开始之前，请确保您已安装Node.js（如果尚未安装）。您还需要NPM，但它会在安装 Node.js 时自动安装。
要检查是否已安装 Node.js 和 NPM，您可以运行以下命令：
node -v
npm -v
如果每条命令的输出都显示了相应的版本号，则表示你已经安装了这些软件。否则，你需要安装它们。
设置美杜莎
Medusa 的核心是后端，它暴露了 REST API，使你的前端或管理面板能够检索或修改数据。你可以用自己的平台替换店铺或管理面板，只要该平台能够连接到 API 即可，但你的系统中至少需要 Medusa 的这部分功能。
安装美杜莎
安装 Medusa 非常简单。首先，您需要安装 CLI 工具，该工具可用于设置服务器：
npm install -g @medusajs/medusa-cli
完成这一步后，您就可以使用 CLI 在您的机器上设置一个新的 Medusa 商店：
medusa new my-store --seed
这会在 my-store 目录下创建一个新的 Medusa 安装。您可以通过更改 my-store 来更改商店或目录的名称。使用 --seed 选项，它会将包含演示产品在内的基本数据填充到数据库中。
奔跑吧，美杜莎
命令执行完毕后，即可运行服务器！首先，切换到美杜莎商店的目录：
cd my-store
然后，develop使用 CLI 工具运行命令来启动服务器：
medusa develop
默认情况下，服务器将在 [此处应填写服务器地址] 上运行localhost:9000。您可以通过在浏览器中访问 [此处应localhost:9000/store/products填写网址] 进行测试，您应该会看到一个产品 JSON 数组。由于初始数据仅包含一个产品，因此该数组中只会包含一个产品。
您可以在文档中查看完整的 API 端点列表。对于店面，所有端点都以 `.storefront` 为前缀/store；而对于管理面板，所有端点都以 `.adminpanel` 为前缀/admin。
结构概述
让我们来看一下服务器的目录结构。它应该看起来像这样：
如您所见，我们有以下目录：
data此目录存放用于初始化数据库的数据。它包含一个文件，其中包含基本商店的配置信息。这些数据是您添加我们已添加的选项seed.json时添加到商店中的数据。--seeddist此目录将存放您运行服务器构建命令时生成的文件npm run build。部署服务器时，您将运行此命令，并将dist使用此目录中已编译的文件。src在主目录中src，您可以添加任何所需的插件或进行任何所需的更改。在api子目录中，您可以为您的商店添加新的端点。在services子目录中，您可以添加可在不同端点中全局使用的新服务。在subscribers子目录中，您可以为不同的事件添加事件监听器，例如，订单生成时。uploads：将包括所有要上传的文件，例如产品图片。
搭建店铺
接下来，我们将安装并设置店铺前端。如前所述，您可以使用Gatsby starter 或Next.js starter。在本教程中，我们将使用 Next.js starter。
安装店面
要安装 Next.js 店面，只需运行以下命令：
npx create-next-app -e https://github.com/medusajs/nextjs-starter-medusa my-storefront
这将在 my-storefront 目录下创建一个 Next.js 店面。如果您想给它取其他名字，可以在命令中更改名称。
运营店铺
在运行店铺页面之前，请确保服务器已启动，因为店铺页面需要连接到服务器来获取店铺数据。要运行服务器，您可以按照上一节中的步骤操作。
要运行店铺，首先需要切换到店铺所在的目录：
cd my-storefront
然后，运行以下命令来启动店铺：
npm run dev
这将默认运行店铺页面localhost:8000。打开后，您应该会看到一个基本的店铺页面，其中包含指向不同文档的链接。您还可以查看产品并体验完整的结账流程。
添加 Stripe 集成
要添加Stripe集成，首先复制以下.env.template内容.env.local：
mv .env.template .env.local
然后，更改 Stripe 公钥的环境变量：
NEXT_PUBLIC_STRIPE_KEY=pk_test_something
结构概述
目录结构应如下所示：
components此目录包含店铺前端的各种组件，例如购物车、结账页面、导航栏等等。您可以在此处根据需要修改这些组件。context这包括一些可以通过上下文轻松切换或更改的商店设置。例如，您可以通过更改对象中context/display-context.js的值来切换是否显示完整的购物车。cartViewdefaultDisplayContextpages这包括店铺首页的各个页面。默认情况下，店铺首页包含三个页面：结账页面、产品页面和落地页。您可以在此处添加更多页面。public您可以在这里添加图片等公共资源。styles此目录包含商店的所有样式，您可以在此处进行更改以更改店面样式。utils这包括获取 Stripe 公钥等辅助函数、辅助函数、配置等。
设置管理员面板
最后，我们将安装并设置管理面板。该管理面板基于 Gatsby 构建。通过管理面板，您可以使用服务器提供的 API 来查看或修改商店中的数据，包括查看和添加产品、订单、客户等。
安装管理面板
要设置管理面板，首先需要克隆管理面板的仓库：
git clone https://github.com/medusajs/admin my-admin
然后，切换到管理面板的目录，即 my-admin。您可以通过更改上述命令中的目录来更改它。
cd my-admin
之后，您需要使用 NPM 安装依赖项：
npm install
运行管理面板
所有依赖项安装完毕后，我们就可以运行管理面板了：
npm start
这将默认打开管理面板localhost:7000。首次打开时，系统会提示您登录。您可以使用邮箱“ admin@medusa-test.com ”和密码“supersecret”登录。
登录后，您将看到一个管理面板，侧边栏可用于查看订单、客户、产品等。
结构概述
目录结构应该类似于这样：
src这里是管理面板的主要代码。您可以编辑组件、页面、上下文等等。对管理面板的任何编辑或添加都可以在这里完成。public这将包括 Gatsby 为管理面板生成的构建。static：管理面板所需的公共静态资源，例如图片。
如前所述，此管理面板使用 Gatsby 构建。虽然您不一定需要学习 Gatsby 才能设置和运行它，但对其进行更改则需要对 Gatsby 的工作原理有一定的了解，具体取决于您要进行的更改类型。
替代方案：创建美杜莎应用程序
如前所述，Medusa 将平台的三个核心组件解耦，以便您能够灵活地根据自身需求定制平台。但是，如果您确实需要使用这三个组件，则可以一次性全部安装。
Medusa 推出了create-medusa-app 工具。如果您之前使用过React，您会发现它与create-react-app类似。使用此工具，您可以一次性设置平台的三个组件。
设置美杜莎应用程序
在终端中，您只需运行以下命令：
npx create-medusa-app
接下来，您将被问及一些与店铺命名、平台不同部分想要使用的技术等相关的问题。
安装完成后，您将拥有 3 个目录。一个用于服务器，名为 ；backend一个用于店面，名为storefront；一个用于管理员，名为admin。
运行美杜莎应用程序
与第一种方法中每个组件的说明类似，当我们分别安装它们时，您需要分别运行每个组件。
Medusa 服务器是店铺和管理面板所必需的，因此请确保在运行它们之前 Medusa 服务器正在运行。
要运行 Medusa 服务器，您需要切换到后端目录，然后运行它：
cd backend
npm start
要运行 Medusa 店面，您需要切换到店面目录，然后运行它：
cd storefront
npm start
要运行 Medusa 管理后台，您需要切换到管理后台目录，然后运行它：
cd admin
npm start
结论
虽然不可否认 Shopify 的受欢迎程度和诸多优势，但了解它的一些缺点以及你还有哪些其他选择或替代方案也是很有益的。
缺乏可扩展性和所有权是选择电子商务平台时不应轻视的缺点。
针对这些缺点，Medusa 是一个绝佳的替代方案。正如您在本教程中所看到的，Medusa 是一个开源平台，能够为您提供可扩展且快速的开发体验。它的设置非常便捷，您可以轻松地对其任何组件进行更改或添加。
除此之外，Medusa 团队也随时乐意为您解答有关如何在Discord上设置 Medusa 的任何问题！
在本系列的下一部分中，您将学习如何修改服务器。这包括如何添加 API 端点、服务等等。随着本系列教程的深入，您将能够掌握并理解 Medusa 的每个组件，从而帮助您构建自己的电子商务网站。
文章来源：https://dev.to/medusajs/get-started-with-medusa-the-open-source-alternative-to-shopify-305j