From bdd1763bb216b1cbbc060942526cc4af7555b03c Mon Sep 17 00:00:00 2001 From: Vadim Smirnov <62517920+FuzzyReason@users.noreply.github.com> Date: Wed, 15 Sep 2021 20:12:19 +0300 Subject: [PATCH 01/10] docs: create-medusa-app article (#401) --- docs/content/how-to/create-medusa-app.md | 117 +++++++++++++++++++++++ www/docs/sidebars.js | 4 + 2 files changed, 121 insertions(+) create mode 100644 docs/content/how-to/create-medusa-app.md diff --git a/docs/content/how-to/create-medusa-app.md b/docs/content/how-to/create-medusa-app.md new file mode 100644 index 0000000000..a3394df3c0 --- /dev/null +++ b/docs/content/how-to/create-medusa-app.md @@ -0,0 +1,117 @@ +--- +title: Using create-medusa-app +--- +# Using create-medusa-app +With the new `create-medusa-app` tool you will get your [Medusa](https://github.com/medusajs/medusa) development environment ready within a couple of minutes. After completion, you will have a Medusa backend, a Gatsby or Next.js storefront, and an admin dashboard up and running on your local machine. + +Starting a new e-commerce project just got easier, now with one command. + +## Getting started with `create-medusa-app` + +Use `create-medusa-app` with your preferred package manager: + +```bash +yarn create medusa-app + +npx create-medusa-app +``` + +Behind the scenes, `create-medusa-app` is populating your database with some initial set of mock data, which helps to interact with Medusa setup intuitively straight away. + +Right after hitting one of those commands, the multistep installation process will be initiated, so the starter can be shaped right for the specific needs. + +### Destination folder + +Enter the path to the directory that will become the root of your Medusa project: + +```bash +? Where should your project be installed? › my-medusa-store +``` + +### Pick the starter you prefer + +```bash +? Which Medusa starter would you like to install? … +❯ medusa-starter-default + medusa-starter-contentful + Other +``` + +You will be presented with three options: + +- `medusa-starter-default` is the most lightweight version of a Medusa project +- `medusa-starter-contentful` almost like the default starter, but with `medusa-plugin-contentful` preinstalled +- `Other` if you have a different starter that you would wish to install from `Other` will give you the option of providing a URL to that starter. An additional question will be asked if you choose this option: + + ```bash + Where is the starter located? (URL or path) › https://github.com/somecoolusername/my-custom-medusa-starter + ``` + +For the walkthrough purposes, we assume that the selected starter is `medusa-starter-default` and proceed to the next step. + +### Selecting a Storefront + +After selecting your Medusa starter you will be given the option to install one of our storefront starters. At the moment we have starters for Gatsby and Next.js: + +```bash +Which storefront starter would you like to install? … +❯ Gatsby Starter + Next.js Starter + None +``` + +You may also select `None` if the choice is to craft a custom storefront for your product. + +`create-medusa-app` now has all of the info necessary for the installation to begin. + +```bash +Creating new project from git: https://github.com/medusajs/medusa-starter-default.git +✔ Created starter directory layout +Installing packages... +``` + +Once the installation has been completed you will have a Medusa backend, a demo storefront, and an admin dashboard. + +## What's inside + +Inside the root folder which was specified at the beginning of the installation process the following structure could be found: + +```bash +/my-medusa-store + /storefront // Medusa storefront starter + /backend // Medusa starter as a backend option + /admin // Medusa admin panel +``` + +`create-medusa-app` prints out the commands that are available to you after installation. When each project is started you can visit your storefront, complete the order, and view the order in Medusa admin. + +```bash +⠴ Installing packages... +✔ Packages installed +Initialising git in my-medusa-store/admin +Create initial git commit in my-medusa-store/admin + + Your project is ready 🚀. The available commands are: + + Medusa API + cd my-medusa-store/backend + yarn start + + Admin + cd my-medusa-store/admin + yarn start + + Storefront + cd my-medusa-store/storefront + yarn start +``` + +## **What's next?** + +To learn more about Medusa to go through our docs to get some inspiration and guidance for the next steps and further development: + +- [Find out how to set up a Medusa project with Gatsby and Contentful](https://docs.medusa-commerce.com/how-to/headless-ecommerce-store-with-gatsby-contentful-medusa) +- [Move your Medusa setup to the next level with some custom functionality](https://docs.medusa-commerce.com/tutorial/adding-custom-functionality) +- [Create your own Medusa plugin](https://docs.medusa-commerce.com/how-to/plugins) + +If you have any follow-up questions or want to chat directly with our engineering team we are always happy to meet you at our [Discord](https://discord.gg/DSHySyMu). diff --git a/www/docs/sidebars.js b/www/docs/sidebars.js index 20ed1bbe4c..085a89b5d7 100644 --- a/www/docs/sidebars.js +++ b/www/docs/sidebars.js @@ -75,6 +75,10 @@ module.exports = { type: "doc", id: "how-to/setting-up-a-nextjs-storefront-for-your-medusa-project", }, + { + type: "doc", + id: "how-to/create-medusa-app" + } ], }, { From d2a14a5d515431fee19163eae5bbce430706c707 Mon Sep 17 00:00:00 2001 From: Vadim Smirnov <62517920+FuzzyReason@users.noreply.github.com> Date: Thu, 16 Sep 2021 08:52:03 +0300 Subject: [PATCH 02/10] fix: temporarily comment out cloud related docs (#387) --- docs/content/quickstart/quick-start.md | 4 ++-- .../tutorial/0-set-up-your-development-environment.md | 6 +++--- docs/content/tutorial/2-adding-custom-functionality.md | 2 +- www/docs/sidebars.js | 8 ++++---- 4 files changed, 10 insertions(+), 10 deletions(-) diff --git a/docs/content/quickstart/quick-start.md b/docs/content/quickstart/quick-start.md index e39c21faf8..fcc16e9475 100644 --- a/docs/content/quickstart/quick-start.md +++ b/docs/content/quickstart/quick-start.md @@ -32,6 +32,6 @@ We have created two starters for you that can help you lay a foundation for your - [Nextjs Starter](https://github.com/medusajs/nextjs-starter-medusa) - [Gatsby Starter](https://github.com/medusajs/gatsby-starter-medusa) -### Link you local development to Medusa Cloud (Coming soon!) + diff --git a/docs/content/tutorial/0-set-up-your-development-environment.md b/docs/content/tutorial/0-set-up-your-development-environment.md index a93bccea3c..48583f1b00 100644 --- a/docs/content/tutorial/0-set-up-your-development-environment.md +++ b/docs/content/tutorial/0-set-up-your-development-environment.md @@ -10,7 +10,7 @@ Welcome to Medusa - we are so excited to get you on board! This tutorial will walk you through the steps to take to set up your local development environment. You will familiarize yourself with some of the core parts that make Medusa work and learn how to configure your development environment. Furthermore you will be introduced to how the plugin architecture works and how to customize your commerce functionalities with custom logic and endpoints. -As a final part of the tutorial you will be linking your local project to Medusa Cloud where you can leverage advanced tools that make it easy to develop, test and deploy your Medusa project. + ## Background Knowledge and Prerequisites @@ -107,11 +107,11 @@ If you don't already have a text editor of choice you should find one you like - It is not important which editor you use as long as you feel comfortable working with it. -## Medusa Cloud account + ## Summary diff --git a/docs/content/tutorial/2-adding-custom-functionality.md b/docs/content/tutorial/2-adding-custom-functionality.md index 0aa78ae9d7..cc0d02d652 100644 --- a/docs/content/tutorial/2-adding-custom-functionality.md +++ b/docs/content/tutorial/2-adding-custom-functionality.md @@ -252,4 +252,4 @@ You have now learned how to add custom functionality to your Medusa server, whic You have now been introduced to many of the key parts of Medusa and with your knowledge of customization you can now begin creating some really powerful commerce experiences. If you have an idea for a cool customization go ahead and make it right now! If you are not completely ready yet you can browse the reference docs further. -In the next part of this tutorial we will look into linking your local project with Medusa Cloud to make develpment smoother while leveraging the powerful management tools that merchants use to manage their Medusa store. + diff --git a/www/docs/sidebars.js b/www/docs/sidebars.js index 085a89b5d7..6d2b962185 100644 --- a/www/docs/sidebars.js +++ b/www/docs/sidebars.js @@ -43,10 +43,10 @@ module.exports = { type: "doc", id: "tutorial/adding-custom-functionality", }, - { - type: "doc", - id: "tutorial/linking-your-local-project-with-medusa-cloud", - }, + // { + // type: "doc", + // id: "tutorial/linking-your-local-project-with-medusa-cloud", + // }, ], }, { From d2739507ab182ca97087a468b02789b2a28134ea Mon Sep 17 00:00:00 2001 From: ps-89 <91064940+ps-89@users.noreply.github.com> Date: Tue, 21 Sep 2021 11:14:14 +0530 Subject: [PATCH 03/10] Fix typo in registerOptin section (#407) --- docs/content/tutorial/2-adding-custom-functionality.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/content/tutorial/2-adding-custom-functionality.md b/docs/content/tutorial/2-adding-custom-functionality.md index cc0d02d652..e04d84303a 100644 --- a/docs/content/tutorial/2-adding-custom-functionality.md +++ b/docs/content/tutorial/2-adding-custom-functionality.md @@ -56,7 +56,7 @@ In the constructor we specify that our `WelcomeService` will depend upon the `ca ### `registerOptin` -The `registerOption` function will take to arguments: `cartId` and `optin`, where `cartId` holds the id of the cart that we wish to register optin for and `optin` is a boolean to indicate if the customer has accepted or optin or not. We will save the `optin` preferences in the cart's `metadata` field, so that it can be persisted for the future when we need to evaluate if we should send the welcome or not. +The `registerOption` function will take two arguments: `cartId` and `optin`, where `cartId` holds the id of the cart that we wish to register optin for and `optin` is a boolean to indicate if the customer has accepted or optin or not. We will save the `optin` preferences in the cart's `metadata` field, so that it can be persisted for the future when we need to evaluate if we should send the welcome or not. ```javascript async registerOptin(cartId, optin) { From 4ee6c0afb2984c27e006fad88984893cedcfb535 Mon Sep 17 00:00:00 2001 From: Sebastian Rindom Date: Tue, 21 Sep 2021 08:03:18 +0200 Subject: [PATCH 04/10] docs: Carts in Medusa (#406) --- docs/content/guides/carts-in-medusa.md | 163 +++++++++++++++++++++++++ www/docs/sidebars.js | 12 +- 2 files changed, 173 insertions(+), 2 deletions(-) create mode 100644 docs/content/guides/carts-in-medusa.md diff --git a/docs/content/guides/carts-in-medusa.md b/docs/content/guides/carts-in-medusa.md new file mode 100644 index 0000000000..7d7e673954 --- /dev/null +++ b/docs/content/guides/carts-in-medusa.md @@ -0,0 +1,163 @@ +--- +title: Carts in Medusa +--- + +# Carts in Medusa + +In Medusa a Cart serves the purpose of collecting the information needed to create an Order, including what products to purchase, what address to send the products to and which payment method the purchase will be processed by. + +To create a cart using the `@medusajs/medusa-js` SDK you can use: + +```javascript +const client = new Medusa({ baseUrl: "http://localhost:9000" }) +const { cart } = await client.carts.create() +``` + +A Cart will always belong to a Region and you may provide a `region_id` upon Cart creation. If no `region_id` is specified Medusa will assign the Cart to a random Region. Regions specify information about how the Cart should be taxed, what currency the Cart should be paid with and what payment and fulfillment options will be available at checkout. Below are some of the properties that can be found on the Cart response. For a full example of a Cart response [check our fixtures](https://github.com/medusajs/medusa/blob/docs/api/docs/api/fixtures/store/GetCartsCart.json). + +```json + "cart": { + "id": "cart_01FEWZSRFWT8QWMHJ7ZCPRP3BZ", + "email": null, + "billing_address": null, + "shipping_address": null, + "items": [ ... ], + "region": { + "id": "reg_01FEWZSRD7HVHBSQRC4KYMG5XM", + "name": "United States", + "currency_code": "usd", + "tax_rate": "0", + ... + }, + "discounts": [], + "gift_cards": [], + "customer_id": null, + "payment_sessions": [], + "payment": null, + "shipping_methods": [], + "type": "default", + "metadata": null, + "shipping_total": 0, + "discount_total": 0, + "tax_total": 0, + "gift_card_total": 0, + "subtotal": 1000, + "total": 1000, + ... + } +``` + +## Adding products to the Cart + +Customers can add products to the Cart in order to start gathering the items that will eventually be purchased. In Medusa adding a product to a Cart will result in a _Line Item_ being generated. To add a product using the SDK use: + +```javascript +const { cart } = await client.carts.lineItems.create(cartId, { + variant_id: "[id-of-variant-to-add]", + quantity: 1, +}) +``` + +The resulting response will look something like this: + +```json +{ + "cart": { + "id": "cart_01FEWZSRFWT8QWMHJ7ZCPRP3BZ", + "items": [ + { + "id": "item_01FEWZSRMBAN85SKPCRMM30N6W", + "cart_id": "cart_01FEWZSRFWT8QWMHJ7ZCPRP3BZ", + "title": "Basic Tee", + "description": "Small", + "thumbnail": null, + "is_giftcard": false, + "should_merge": true, + "allow_discounts": true, + "has_shipping": false, + "unit_price": 1000, + "variant": { + "id": "variant_01FEWZSRDNWABVFZTZ21JWKHRG", + "title": "Small", + "product_id": "prod_01FEWZSRDHDDSHQV6ATG6MS2MF", + "sku": null, + "barcode": null, + "ean": null, + "upc": null, + "allow_backorder": false, + "hs_code": null, + "origin_country": null, + "mid_code": null, + "material": null, + "weight": null, + "length": null, + "height": null, + "width": null, + "metadata": null, + ... + }, + "quantity": 1, + "metadata": {}, + ... + } + ], + ... + } +} +``` + +The properties stored on a Line Item are useful for explaining and displaying the contents of the Cart. For example, Line Items can have a thumbnail assigned which can be used to display a pack shot of the product that is being purchased, a title to show name the products in the cart and a description to give further details about the product. By default the Line Item will be generated with properties inherited from the Product that is being added to the Cart, but the behaviour can be customized for other purposes as well. + +## Adding Customer information to a Cart + +After adding products to the Cart, you should gather information about where to send the products, this is done using the `update` method in the SDK. + +```javascript +const { cart } = await client.carts.update(cartId, { + email: "jane.doe@mail.com", + shipping_address: { + first_name: "Jane", + last_name: "Doe", + address_1: "4242 Hollywood Dr", + postal_code: "12345", + country_code: "us", + city: "Los Angeles", + region: "CA", + }, +}) +``` + +Note that the country code in the shipping address must be the country code for one of the countries in a Region - otherwise this method will fail. + +## Initializing Payment Sessions + +In Medusa payments are handled through the long lived entities called _Payment Sessions_. Payment Sessions cary provider specific data that can later be used to authorize the payments, which is the step required before an order can be created. The SDK provides a `createPaymentSessions` method that can be used to initialize the payment sessions with the Payment Providers available in the Region. + +```javascript +const { cart } = await client.carts.createPaymentSessions(cartId) +``` + +You can read more about Payment Sessions in our [guide to checkouts](https://docs.medusa-commerce.com/guides/checkouts). + +## Changing the Cart region + +To update the Region that the cart belongs to you should also use the `update` method from the SDK. + +```javascript +const { cart } = await client.carts.update(cartId, { + region_id: "[id-of-region-to-switch-to]", +}) +``` + +When changing the Cart region you should be aware of a couple of things: + +- If switching to a Region with a different currency the line item prices and cart totals will change +- If switching to a Region with a different tax rate prices and totals will change +- If switching to a Region serving only one country the `shipping_address.country_code` will automatically be set to that country +- If the Cart already has initialized payment sessions all of these will be canceled and a new call to `createPaymentSessions` will have to be made + +## What's next? + +Carts are at the core of the shopping process in Medusa and provide all the necessary functionality to gather products for purchase. If you want to read a more detailed guide about how to complete checkouts please go to our [Checkout Guide](https://docs.medusa-commerce.com/guides/checkout). + +If you have questions or issues feel free to reach out via our [Discord server](https://discord.gg/xpCwq3Kfn8) for direct access to the Medusa engineering team. diff --git a/www/docs/sidebars.js b/www/docs/sidebars.js index 6d2b962185..b8fadb9968 100644 --- a/www/docs/sidebars.js +++ b/www/docs/sidebars.js @@ -77,8 +77,8 @@ module.exports = { }, { type: "doc", - id: "how-to/create-medusa-app" - } + id: "how-to/create-medusa-app", + }, ], }, { @@ -89,6 +89,14 @@ module.exports = { type: "doc", id: "guides/fulfillment-api", }, + { + type: "doc", + id: "guides/checkouts", + }, + { + type: "doc", + id: "guides/carts-in-medusa", + }, ], }, ], From c715077be5c66b2809c21829d85b0f01c3499ab0 Mon Sep 17 00:00:00 2001 From: Oliver Windall Juhl <59018053+olivermrbl@users.noreply.github.com> Date: Wed, 22 Sep 2021 13:42:31 +0200 Subject: [PATCH 05/10] hotfix: Stripe cancelPayment catch block (#416) --- packages/medusa-payment-stripe/src/services/stripe-provider.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/medusa-payment-stripe/src/services/stripe-provider.js b/packages/medusa-payment-stripe/src/services/stripe-provider.js index da97bc9c01..781dabbcf4 100644 --- a/packages/medusa-payment-stripe/src/services/stripe-provider.js +++ b/packages/medusa-payment-stripe/src/services/stripe-provider.js @@ -333,7 +333,7 @@ class StripeProviderService extends PaymentService { async cancelPayment(payment) { const { id } = payment.data try { - return this.stripe_.paymentIntents.cancel(id) + return await this.stripe_.paymentIntents.cancel(id) } catch (error) { if (error.payment_intent.status === "canceled") { return error.payment_intent From 84343c88e3ad084561bb8625e47b9a4af8567d3d Mon Sep 17 00:00:00 2001 From: olivermrbl Date: Wed, 22 Sep 2021 13:52:35 +0200 Subject: [PATCH 06/10] chore(release): Publish - medusa-payment-stripe@1.1.26 --- packages/medusa-payment-stripe/CHANGELOG.md | 8 ++++++++ packages/medusa-payment-stripe/package.json | 2 +- 2 files changed, 9 insertions(+), 1 deletion(-) diff --git a/packages/medusa-payment-stripe/CHANGELOG.md b/packages/medusa-payment-stripe/CHANGELOG.md index 688e73c8d9..a38c7a8a2e 100644 --- a/packages/medusa-payment-stripe/CHANGELOG.md +++ b/packages/medusa-payment-stripe/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [1.1.26](https://github.com/medusajs/medusa/compare/medusa-payment-stripe@1.1.25...medusa-payment-stripe@1.1.26) (2021-09-22) + +**Note:** Version bump only for package medusa-payment-stripe + + + + + ## [1.1.25](https://github.com/medusajs/medusa/compare/medusa-payment-stripe@1.1.24...medusa-payment-stripe@1.1.25) (2021-09-15) **Note:** Version bump only for package medusa-payment-stripe diff --git a/packages/medusa-payment-stripe/package.json b/packages/medusa-payment-stripe/package.json index afd846d38d..74ea0729eb 100644 --- a/packages/medusa-payment-stripe/package.json +++ b/packages/medusa-payment-stripe/package.json @@ -1,6 +1,6 @@ { "name": "medusa-payment-stripe", - "version": "1.1.25", + "version": "1.1.26", "description": "Stripe Payment provider for Meduas Commerce", "main": "index.js", "repository": { From a8f06a49d78c88c77c00651f2f24fb44197f7640 Mon Sep 17 00:00:00 2001 From: ps-89 <91064940+ps-89@users.noreply.github.com> Date: Wed, 22 Sep 2021 22:07:50 +0530 Subject: [PATCH 07/10] Fix typo in Plugins in Medusa doc (#414) --- docs/content/how-to/plugins.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/content/how-to/plugins.md b/docs/content/how-to/plugins.md index 83dd41d30c..8d8c837123 100644 --- a/docs/content/how-to/plugins.md +++ b/docs/content/how-to/plugins.md @@ -10,7 +10,7 @@ The purpose of this guide is to give an introduction to the structure of a plugi Plugins offer a way to extend and integrate the core functionality of Medusa. -In most commerce solutions, you can extend the basic features but it often comes with the expense of having to build standalone web applications. Our architecture is built such that plugins run within the same process as the core eliminating the need for extra server capacaity, infrastructure and maintenance. As a result, the plugins can use all other services as dependencies and access the database. +In most commerce solutions, you can extend the basic features but it often comes with the expense of having to build standalone web applications. Our architecture is built such that plugins run within the same process as the core eliminating the need for extra server capacity, infrastructure and maintenance. As a result, the plugins can use all other services as dependencies and access the database. > You will notice that plugins vary in naming. The name should signal what functionality they provide. From ff9cc0fa417b3ecf161a81608a653c173f56993a Mon Sep 17 00:00:00 2001 From: Oliver Windall Juhl <59018053+olivermrbl@users.noreply.github.com> Date: Tue, 28 Sep 2021 19:31:50 +0200 Subject: [PATCH 08/10] docs: Deploying Medusa on Heroku (#425) --- docs/content/how-to/deploying-on-heroku.md | 198 +++++++++++++++++++++ www/docs/sidebars.js | 10 ++ 2 files changed, 208 insertions(+) create mode 100644 docs/content/how-to/deploying-on-heroku.md diff --git a/docs/content/how-to/deploying-on-heroku.md b/docs/content/how-to/deploying-on-heroku.md new file mode 100644 index 0000000000..67bb7dedee --- /dev/null +++ b/docs/content/how-to/deploying-on-heroku.md @@ -0,0 +1,198 @@ +--- +title: "Deploying on Heroku" +--- + +# Deploying on Heroku + +This is a guide for deploying a Medusa project on Heroku. Heroku is at PaaS that allows you to easily deploy your applications in the cloud. + +> We assume, that you are currently running a local instance of Medusa. If not, check out our [Quickstart](https://docs.medusa-commerce.com/quickstart/quick-start) or use `npx create-medusa-app` to set up your application in a matter of minutes. For the latter, see [this guide](https://docs.medusa-commerce.com/how-to/create-medusa-app) for a small walkthrough. + +### 1. Install the Heroku CLI + +Install Heroku on your machine: + +**Ubuntu** + +```shell= +sudo snap install --classic heroku +``` + +**MacOS** + +```shell= +brew tap heroku/brew && brew install heroku +``` + +**Windows** + +Download the appropriate installer for your Windows installation: + +[64-bit installer](https://cli-assets.heroku.com/heroku-x64.exe) +[32-bit installer](https://cli-assets.heroku.com/heroku-x86.exe) + +### 2. Login to Heroku from your CLI + +Connect to your Heroku account from your terminal: + +```shell= +heroku login +``` + +> Follow the instructions on your terminal + +### 3. Create an app on Heroku + +In your **Medusa project directory** run the following commands to create an app on Heroku and add it as a remote origin. + +```shell= +heroku create medusa-test-app +heroku git:remote -a medusa-test-app +``` + +### 4. Install Postgresql and Redis on Heroku + +Medusa requires a Postgres database and a Redis instance to work. These are added through the Heroku CLI using the following commands. + +> In this below example, we initialize the resources on free plans. This is not a valid configuration for a production environment. + +#### Postgresql + +Add a Postgres addon to your Heroku app + +```shell= +heroku addons:create heroku-postgresql:hobby-dev +``` + +You can find more informations, plans and pricing about Heroku Postgres [here](https://elements.heroku.com/addons/heroku-postgresql). + +#### Redis To Go + +Add a Redis instance to your Heroku app + +> The addon `redistogo:nano` is free, but Heroku requires you to add a payment method to proceed. + +```shell= +heroku addons:create redistogo:nano +``` + +You can find more informations, plans and pricing about Redis To Go [here](https://elements.heroku.com/addons/redistogo). + +### 5. Configure environment variables on Heroku + +Medusa requires a set of environment variables. From you project repository run the following commands:. +```shell= +heroku config:set NODE_ENV=production +heroku config:set JWT_SECRET=your-super-secret +heroku config:set COOKIE_SECRET=your-super-secret-pt2 +heroku config:set NPM_CONFIG_PRODUCTION=false +``` +> Make sure to use actual secrets in a production environment. +Additionally, we need to set the buildpack to Node.js + +```shell= +heroku buildpacks:set heroku/nodejs +``` + +#### Configure the Redis URL + +The library we use for connecting to Redis, does not allow usernames in the connection string. Therefore, we need to perform the following commands to remove it. +Get the current Redis URL: + +```shell= +heroku config:get REDISTOGO_URL +``` + +You should get something like: + +```shell= +redis://redistogo:some_password_123@some.redistogo.com:9660/ +``` + +Remove the username from the Redis URL: + +```shell= +redis://r̶e̶d̶i̶s̶t̶o̶g̶o̶:some_password_123@sole.redistogo.com:9660/ +``` + +Set the new environment variable `REDIS_URL` + +```shell= +heroku config:set REDIS_URL=redis://:some_password_123@sole.redistogo.com:9660/ +``` + +### 6. Configure Medusa + +Before jumping into the deployment, we need to configure Medusa. + +#### `medusa-config.js` + +Update `module.exports` to include the following: + +```javascript= +module.exports = { + projectConfig: { + redis_url: REDIS_URL, + database_url: DATABASE_URL, + database_type: "postgres", + store_cors: STORE_CORS, + admin_cors: ADMIN_CORS, + database_extra: + process.env.NODE_ENV !== "development" + ? { ssl: { rejectUnauthorized: false } } + : {}, + }, + plugins, +}; +``` + +#### `package.json` + +Update `scripts` to include the following: + +```json= +... +"scripts": { + "serve": "medusa start", + "start": "medusa develop", + "heroku-postbuild": "medusa migrations run", + "prepare": "npm run build", + "build": "babel src -d dist --extensions \".ts,.js\"" +}, +... +``` + +### 6. Launch you Medusa app + +Finally, we need to commit and push our changes to Heroku: + +```shell= +git add . +git commit -m "Deploy Medusa App on Heroku" +git push heroku HEAD:master +``` + +### 7. Inspect your build logs + +You can explore your Heroku app build logs using the following command in your project directory. + +```shell= +heroku logs -n 500000 --remote heroku --tail +``` + +### 8. Create a user (optional) + +As an optional extra step, we can create a user for you to use when your admin system is up and running. + +```shell= +heroku run -a medusa-test-app -- medusa user -e "some-user@test.com" -p "SuperSecret1234" +``` + +### What's next? + +You now have a production ready application running on Heroku. This can be scaled and configured to fit your business needs. + +Furthermore, you can deploy a Medusa Admin for your application, such that you can start managing your store from an interface. + +- Deploy Admin on Netlify (Coming soon) +- Deploy Admin on Gatsby Cloud (Coming soon) diff --git a/www/docs/sidebars.js b/www/docs/sidebars.js index b8fadb9968..4d5ca97c0d 100644 --- a/www/docs/sidebars.js +++ b/www/docs/sidebars.js @@ -99,5 +99,15 @@ module.exports = { }, ], }, + { + type: "category", + label: "Deploy", + items: [ + { + type: "doc", + id: "how-to/deploying-on-heroku", + }, + ], + }, ], } From b9301004797128f1a61bcb13b252b4e1d6eed09a Mon Sep 17 00:00:00 2001 From: Oliver Windall Juhl <59018053+olivermrbl@users.noreply.github.com> Date: Thu, 30 Sep 2021 12:49:12 +0200 Subject: [PATCH 09/10] docs: Deploying Medusa Admin on Netlify (#431) --- .../how-to/deploying-admin-on-netlify.md | 69 +++++++++++++++++++ www/docs/sidebars.js | 6 +- 2 files changed, 74 insertions(+), 1 deletion(-) create mode 100644 docs/content/how-to/deploying-admin-on-netlify.md diff --git a/docs/content/how-to/deploying-admin-on-netlify.md b/docs/content/how-to/deploying-admin-on-netlify.md new file mode 100644 index 0000000000..22cd735a5d --- /dev/null +++ b/docs/content/how-to/deploying-admin-on-netlify.md @@ -0,0 +1,69 @@ +--- +title: "Deploying Admin on Netlify" +--- + +# Deploying Admin on Netlify + +This is a guide for deploying Medusa Admin on Netlify. Netlify is a platform that offers hosting and backend services for applications and static websites. + +> At this point, you should have a running instance of Medusa Admin. If not, check out [these steps](https://github.com/medusajs/admin#-setting-up-admin) or use `npx create-medusa-app` to set up your application in a matter of minutes. For the latter, see [this guide](https://docs.medusa-commerce.com/how-to/create-medusa-app) for a small walkthrough. + +### 1. Install the Netlify CLI + +Install Netlify CLI on your machine using npm: + +```shell= +npm install netlify-cli -g +``` + +### 2. Login to your Netlify account + +Connect to your Netlify account from your terminal: + +```shell= +netlify login +``` + +Follow the instructions in your terminal. + +### 3. Netlify setup + +In order to deploy on Netlify, you need to create a new site, link the admin repository to the site and configure environment variables. + +The Netlify CLI is used to achieve this. + +#### Create a new site + +```shell= +netlify init +``` + +Follow the instructions in your terminal to authorize and connect your Git repository. + +The default build and deploy settings fit the needs of a Gatsby application, so leave these as is. + +#### Add an environment variable + +```shell= +netlify env:set GATSBY_MEDUSA_BACKEND_URL "https://your-medusa-server.com" +``` + +The above environment variable should point to your Medusa server. + +### 4. Push and deploy + +Finally to deploy the admin, commit and push your changes to the repository connected in step 3. + +```shell= +git add . +git commit -m "Deploy Medusa Admin on Netlify" +git push origin main +``` + +Within a couple of minutes, your Medusa Admin is live and running on Netlify. + +> If you experience CORS issues in your new setup, you might need to add your admin url as part of the ADMIN_CORS environment variable in your server setup. + +### What's next? + +If you haven't deployed your Medusa server to use with your new admin, check out our guide [Deploying on Heroku](https://docs.medusa-commerce.com/how-to/deploying-on-heroku). diff --git a/www/docs/sidebars.js b/www/docs/sidebars.js index 4d5ca97c0d..4c77faaa41 100644 --- a/www/docs/sidebars.js +++ b/www/docs/sidebars.js @@ -99,7 +99,7 @@ module.exports = { }, ], }, - { + { type: "category", label: "Deploy", items: [ @@ -107,6 +107,10 @@ module.exports = { type: "doc", id: "how-to/deploying-on-heroku", }, + { + type: "doc", + id: "how-to/deploying-admin-on-netlify", + }, ], }, ], From 4c343e718de74e0108b29738baf4f136560506b6 Mon Sep 17 00:00:00 2001 From: Oliver Windall Juhl <59018053+olivermrbl@users.noreply.github.com> Date: Fri, 1 Oct 2021 09:29:46 +0200 Subject: [PATCH 10/10] fix: Add deploy admin link to guide (#437) --- docs/content/how-to/deploying-on-heroku.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/content/how-to/deploying-on-heroku.md b/docs/content/how-to/deploying-on-heroku.md index 67bb7dedee..888c092f1b 100644 --- a/docs/content/how-to/deploying-on-heroku.md +++ b/docs/content/how-to/deploying-on-heroku.md @@ -194,5 +194,5 @@ You now have a production ready application running on Heroku. This can be scale Furthermore, you can deploy a Medusa Admin for your application, such that you can start managing your store from an interface. -- Deploy Admin on Netlify (Coming soon) +- [Deploy Admin on Netlify](https://docs.medusa-commerce.com/how-to/deploying-admin-on-netlify) - Deploy Admin on Gatsby Cloud (Coming soon)