Build & Deploy Production Ready MedusaJS Shop

Summary

In this comprehensive tutorial by Pavlo Tsyhanok, learn how to deploy a production-ready MedusaJS server and storefront. The video covers architectural overviews, necessary plugins, and step-by-step deployment on Digital Ocean and Vercel. Key components include PostgreSQL for the database, Redis for caching, Stripe for payments, and SendGrid for transactional emails. Viewers will understand how to configure backends, set up environments, manage databases, and enhance their shop's performance with efficient plugins, ensuring readiness for live e-commerce environments.

Highlights

• Pavlo Tsyhanok guides you through deploying a MedusaJS server and storefront. ✨
• Host your Medusa server on Digital Ocean for auto-scaling capabilities. 💻
• Implement PostgreSQL, Redis, and S3 spaces for efficient backend performance. 📦
• Vercel is utilized for storefront deployment with serverless functions. 🚀
• Integrate Stripe for payments and SendGrid for email handling seamlessly. 💸✉️

Key Takeaways

• Quickly deploy your MedusaJS store for production ready use! 🚀
• Set up your backend flawlessly on Digital Ocean with scaling enabled. 🌐
• Integrate powerful tools like Stripe and SendGrid for a complete e-commerce solution. 💳📧
• Streamline your server with plugins and manage your store efficiently through Vercel. 🛠️
• Learn to handle environment configurations for smooth operation and scalability. ⚙️

Overview

In this detailed walkthrough, Pavlo Tsyhanok shares insights on deploying a MedusaJS server and storefront, focusing on creating a robust and scalable e-commerce environment. From leveraging Digital Ocean's app platform for backend management to utilizing Vercel's serverless functions for the storefront, he covers a variety of strategies to ensure an optimal setup.

The tutorial emphasizes the importance of integrating key components such as PostgreSQL, Redis, and S3 spaces to boost backend performance. Pavlo demonstrates how to work with Stripe for payment processing and SendGrid for handling transactional emails, simplifying the complexity of e-commerce operations.

Viewers are guided through meticulous configuration steps, from initial server setup to environment management. The implementation of various plugins enriches the MedusaJS platform, preparing it for both current needs and future scalability. Whether for beginners or seasoned developers, this guide equips you with the knowledge to launch a successful, production-level MedusaJS store.

Chapters

• 00:00 - 00:30: Introduction The introduction chapter by Pablo outlines the process of deploying a Methusa server and Meusa storefront for production-ready use. The chapter will cover the architecture, requirements, backend configuration, necessary plugins, and deployment on Digital Ocean. Additionally, it will address frontend configuration and deployment on Forel, providing a high-level overview of the process.
• 00:30 - 01:00: Tech Stack Overview The chapter provides an overview of the tech stack, starting with the hosting of the MEUSA server on Digital Ocean using the App Platform, which offers automatic scaling. The database will utilize PostgreSQL, while Redis will be used for the event bus and caching. Media files will be hosted using S3 Spaces. For the storefront, Vercel is chosen due to its provision of serverless functions that can scale effectively.
• 01:00 - 01:30: Installation of Dependencies This chapter covers the installation of necessary dependencies for setting up a project. It introduces the use of Stripe for payments, SendGrid for transactional emails, and Mele search for the search engine functionalities. The chapter emphasizes the importance of installing Node.js, which is the JavaScript runtime engine on which the Medusa server operates. It also highlights the need for Git as an essential tool for version control.
• 01:30 - 02:30: Creating and Initializing Repositories In this chapter, the focus is on creating and initializing repositories using a codebase management tool in conjunction with GitHub. The process involves setting up a parent directory to manage different components, specifically a server and a storefront. Though PostgreSQL is needed, the tutorial opts for a direct connection to Digital Ocean PostgreSQL, making it unnecessary to locally host the database.
• 02:30 - 04:00: Setting up Digital Ocean Resources The chapter titled 'Setting up Digital Ocean Resources' describes the initial setup process for Medusa app development using Digital Ocean. The narrator opens their IDE and directs to a specific directory to create the Medusa application. They copy a command for setting up the app and run it in the integrated terminal, ensuring to include a 'skip DB' flag to omit the database setup at this stage.
• 04:00 - 07:00: Configuring Medusa for Digital Ocean This chapter covers the configuration of Medusa for deployment on Digital Ocean. It discusses connecting to a PostgreSQL database hosted on Digital Ocean, providing options for using a local database, and deploying a Next.js storefront.
• 07:00 - 09:30: App Hosting on Digital Ocean This chapter covers the process of setting up an application hosting environment on Digital Ocean. It begins with waiting for the initial setup to complete, followed by initializing a Git repository. The instruction is to go into the backend folder to prepare for committing code to the GitHub repository. Additional steps likely include configuring the application, deploying code, and managing the server, though specific details are not provided in the transcript.
• 09:30 - 11:00: Admin User Creation The chapter 'Admin User Creation' covers a technical process involving Git version control system commands. The author starts by navigating to a directory and running 'git init' followed by 'git add', which stages changes. They then execute 'git commit' with a brief message to save the changes in the repository. This process is repeated for both the backend and frontend directories of the project named Med Visa store.
• 11:00 - 13:36: Setting up Storefront on Vercel In this chapter, the process of setting up a storefront on Vercel is discussed. The speaker begins by demonstrating how to create two new repositories on GitHub, specifically ‘theusa tutorial backend’ repository, and shares the necessary commands required to push the existing data to these repositories. The transcript suggests that these are preliminary steps in setting up the storefront.
• 13:36 - 16:12: Adding Plugins and Configurations In this chapter, the focus is on the practical steps to add and configure plugins within a project repository. The presenter demonstrates navigating to different directory levels, specifically the backend and frontend folders, to ensure proper integration of code updates. It involves running specific commands to commit changes within the repository, reflecting how to correctly manage version control across different parts of a project.
• 16:12 - 21:06: Testing Plugins and Integration In this chapter titled 'Testing Plugins and Integration', the process of setting up and preparing a development environment for deployment is discussed. The chapter explains how to navigate back to the main project directory, which in this case is the 'storefront folder', and how to upload the latest changes there. This involves refreshing the page to ensure updates are visible and verifying that the Next.js starter template is properly committed to GitHub. Once the codebases for both the back end and front end are connected, the next step highlighted is to prepare the back end for deployment.
• 21:06 - 27:44: Spaces Object Storage Setup In the chapter titled 'Spaces Object Storage Setup,' the process of setting up object storage on DigitalOcean is outlined. The speaker begins by logging into their DigitalOcean account and explains the necessity of creating two key resources: a Postgres database and Redis. They navigate to the databases section to initiate the creation of a database cluster, starting with Postgres.
• 27:44 - 29:30: Final Steps and Recap The chapter titled 'Final Steps and Recap' appears to focus on setting up a database for a project or a tutorial. The speaker mentions keeping settings standard and suggests adjusting them based on the size of the store one plans to run. They proceed to change the name of the tutorial database, referencing 'New York City 3' which could imply a location-based database setup for that particular region. The chapter likely wraps up the tutorial with these steps, emphasizing customization as per individual requirements.

Build & Deploy Production Ready MedusaJS Shop Transcription

• 00:00 - 00:30 hello guys my name is Pablo and in this video I will show you how to deploy your methusa server and meusa storefront for production ready use so in this video we'll quickly go over architecture and requirements we will configure our backend and uh all necessary plugins we will deploy it on digital ocean and we will configure our front and deploy it on forel so so this is a high overview of
• 00:30 - 01:00 our uh tax stack we're going to be hosting our meusa server on digital ocean with the app platform that will automatically scale our app uh we're going to use postgress SQL for our database red is for event bus and caching and S3 spaces to um host our media files uh for storefront we're going to use versel which offers uh serverless functions that uh can SK really well and
• 01:00 - 01:30 we are going to use stripe for payments send grid for transactional emails and Mele search for uh our search engine so the first thing I have to do is I have to make sure I have all necessary uh dependencies installed on my machine and the first one that we will need is nodejs this is Javascript runtime engine on which uh Medusa server runs we will will need git as our
• 01:30 - 02:00 codebase management tool we we're going to be using it with a GitHub and we will need postra SQL uh database uh as well but in this tutorial I will be directly connecting it to digital ocean post SQL so it won't be necessary so the first thing I'm going to do is I'm going to create a uh Parent Directory for both server and uh storefront on my
• 02:00 - 02:30 desktop and I will open it in my IDE and I'll proceed to dogs to create a Medusa app I'll copy this command here and I'll open my integrated terminal and uh while running this command I will also add flag skip DB
• 02:30 - 03:00 because we want to install our um database later I'm going to be connecting it directly to uh postgress database on digital ocean but if you're running a local database U you can uh do it without the flag and it will prompt you to connect to a database I will um select to to deploy a next G storefront as well
• 03:00 - 03:30 and I will wait until it uh finish setting up and our setup is complete the next step that I'm going to do is I'm going to initialize git and commit code to our GitHub repositories so I'm first uh going to go into my backend folder
• 03:30 - 04:00 and I'll run get in it then I will run get add at root and then I'll run get commit and I'll add a very short message plus then I'll do the same for my front end uh directory so I will go back to my parent and I'll go to my Med Visa store
• 04:00 - 04:30 and do the same things then I'll go to my GitHub and I'll create two new repositories so I'll create first theusa tutorial backend and I'll keep it public I'll copy this uh those commands here below to push the existing
• 04:30 - 05:00 repository and I'll go back to my parent and I'll go to my backend folder I'll run those commands and if I refresh my screen I have committed my code base here and I will do the same for my front end
• 05:00 - 05:30 go back to my parent go back to my storefront folder and upload it here and if I refresh the page I have my nextjs stter template committed to GitHub after we have our code base for both back end and front end connected The Next Step would be preparing our back end for uh deployment
• 05:30 - 06:00 on U digital ocean so I've already logged in to digital ocean and we would need to create uh two resources we would need postgress uh database and we would need rdus so I'll go to my databases and I'll create database cluster and I will first start with postgress
• 06:00 - 06:30 database I'll keep all settings standard but you can depending on the size of the store you're planning to run you can addit these accordingly so I'll change the namea tutorial database post uh New York City 3
• 06:30 - 07:00 and I will repeat this the same for my redus I'll create database cluster I'll select redus I keep everything standard and create database cluster
• 07:00 - 07:30 so it will take some time to create those usually uh not more than 10 minutes so while my databases are creating I'm going to uh proceed to Medusa talks and I'm going to go to deploy section I'll select digital ocean and I'll follow instructions uh necessary to prepare my server for deployment to digital ocean so the first thing we have
• 07:30 - 08:00 to do is to change the startup command and pack a Json so I'll copy this command here I'll go to my IDE I'll open my package Json file and here I'll change my start command to run migrations and I'll save the file
• 08:00 - 08:30 then uh the database connection string string is uh a bit different for digital ocean so we need to edit our Medusa config as well so I'll go to my Medusa config file and here our database connection string here I'll replace it with the code from documentation
• 08:30 - 09:00 we will also need to add project config so I'll copy copy this uh code here and I'll navigate to my project config it's right here you can see it's called Uh in modules export so I'm going to add the line of code here we will also be using Ras
• 09:00 - 09:30 so I will uncomment redus event bus and cach service modules here and I will also uncommon that line to enable redus and I'll save the file we will also need to make changes to get ignore file U that file is uh preventing uh some of the files to be
• 09:30 - 10:00 committed to your git this is usually done for security purposes you don't want to commit your um EnV file because uh it contains uh sensitive keys but in that case we need to uh remove yarn lock and package lock. Json so I'll remove those and save the file and that's that concludes our
• 10:00 - 10:30 initial backend preparations for uh for our uh server part so I'll navigate back to my Parent Directory and I'll navigate inside of my server directory and I'll commit code to GitHub so I'll run git add root get commit with a very simple message and get
• 10:30 - 11:00 p and it will update my repository on GitHub updated just now so if I open myusic config address all the uh edits are saved here so the next step would be creating an app hosting on digital ocean I already have my GitHub uh provider connect connected here so I'll create an
• 11:00 - 11:30 app I will select GitHub and it will load all of my repositories and I'll select meusa tutorial back end I'll keep other settings standard so here I will actually edit configurations for uh my my app
• 11:30 - 12:00 deployment and I'll change resource size to 2 GB of RAM um for dedicated compute and I'll set my um containers to Autos scale and you can adust those settings depending on the expected volume your store will have but that essentially will take care of automatic uh scaling and you can always um adjust these settings as you go
• 12:00 - 12:30 so I'll hit save here I will also change my port because Medusa uh production runs on Port 9000 and I'll hit save for the environmental variables I'm going to follow the suggested documentation variables so I'll just copy this code here
• 12:30 - 13:00 and I'll click edit and I'll click bulk editor and I will paste everything in here and beware that um you should replace those uh secret values with uh generated uh secure generated values but for now I'll keep them standard and for the those Dynamic values we have to enter our um our database uh
• 13:00 - 13:30 uh values here so I'll keep it as is for now and I'll come back to it once I uh deploy the app and I'll just add it the name hit save I will edit the region to New
• 13:30 - 14:00 York and I'll review everything and create resources so the next step would be attaching our redus and postgress to this app so you would click on Create and create or attach database so in our case we already created both post and
• 14:00 - 14:30 arus so I also like previously created digital ocean database and I'll go with postgress and enter default values click attach database and repeat the same process for redus so it will attach resource resources door
• 14:30 - 15:00 app and then we can go in and configure our environmental variables so here um I will start typing uh the dollar sign and uh bracket and it will pull the quick list of uh of options I can select so I'll select my uh postris database and in this case this is user username so I'll select
• 15:00 - 15:30 username and I'll just select this port and replace DB with my uh database name and same thing for redus so it's redus and it's database URL and that is automatically created by digital ocean we won't need that and I'll head
• 15:30 - 16:00 save and that should initiate uh another deployment for us so I'll go to my build logs and we can monitor progress here now our build is complete and we proceed to deployment stage so it will run migrations and create all necessary
• 16:00 - 16:30 items in the database and we got the message that our deployment is successful and we can see the link here so if we go there and type Health we see that our app is healthy and if I add SL app the login panel will welcome us but now the uh the problem is I did not
• 16:30 - 17:00 create a u admin user so we would have to connect from our local machine to the database and create the user so the way to do that we have to go to our databases select our postris database go to the settings um edit our trusted resources and add our IP address here here so it's
• 17:00 - 17:30 trusted and I will have to open my um local Medusa backend go to my EnV file I will uh rename that to remove the [Music] template and enter our database credentials here so because we modified how our uh database uh con is built we will have to use these uh these
• 17:30 - 18:00 values here so I'll go and to myv I'll paste that and I will remove those parts of the code and I'll replace all and I will enter my credentials
• 18:00 - 18:30 here I can actually copy everything here and just copied like this delete the rest and save the
• 18:30 - 19:00 file so I'll open Medusa docs and I will search create admin user I'll copy this command [Music] here I'll make sure I'm in my U admin folder I'll paste the command and uh this you can added the password and and email and I'll run this
• 19:00 - 19:30 [Music] command and it will uh let me in my uh my dashboard so as you can see it it gave me a bunch of errors but it still creates uh the user so I'll click on
• 19:30 - 20:00 begin setup I will create a sample product it will uh create a matria t-shirt for me and I will go to the settings and guys this is important step you need to create a region for your store and I already have uh European region and I'll add uh North
• 20:00 - 20:30 America us tax 1% I'll add Canada and I'll add United States I'll select manual payment provider and manual fulfillment provider and I'll head create region so the next step uh we'll take is to is
• 20:30 - 21:00 prepare our storefront for deployment on verel so I will go to verel I'll open my versel and I will add new project I'll select uh get repository with Meda tutorial frontend and here I'll need to configure my environmental variables and I can reference the EnV local file here
• 21:00 - 21:30 so I will select uh default public region here I will change my default regions to EU and I will copy my Medusa backhand URL so that URL is where our back end is hosted so I'll copy the link and I'll paste it here and make sure
• 21:30 - 22:00 there is no uh trailing slash otherwise you will get an error and I'll enter our next public base URL but we don't have it yet because we haven't deployed it um I'll deploy it and add it later so I'll hit deploy and our deployment is successful so I'll go to my dashboard and I can visit the URL and
• 22:00 - 22:30 here our store but if I go to the store here are products and I can select the product added to court and I can check it out and our delivery is empty so I'll go
• 22:30 - 23:00 back to my Medusa admin I'll add a shipping option [Music] here of $1 save it and make sure that my uh fulfillment method is visible click save and close and go back to my checkout and and now I can select
• 23:00 - 23:30 test continue to payment test payment and place the order and if I go back to my admin I can see my order here so the next step would be adding plugins to our store and the first one I'm going to do is Main search is to enable uh product search uh in our store
• 23:30 - 24:00 um in this case I'm going to be using hosted version but melee search is op source and you can always self host it but for this tutorial I'll go and I'll create a new project and right now it's creating so I'll open official documentation and search Mele search
• 24:00 - 24:30 and follow the instructions to install it so I'll copy the command I'll come back to my IDE make sure I'm on my Meda server folder run the command it will install the plugin and I will have to configure my envs so I'll copy the EnV template
• 24:30 - 25:00 here I would need uh my master key and I'll need my host and I'll save it next we will have to configure our meusa config file and add uh it to plugins so if you copy this here um these options example it uh it wouldn't
• 25:00 - 25:30 work because it needs uh to follow uh this structure and obviously want more than just uh the product ID so I have prepared my config will be available in the public repository so I'm going to copy the config go to my DJs config and add it to the list of plugins and save the
• 25:30 - 26:00 file um the next step is I would have to add uh configuration to the nextjs store template so I will go to my nextjs uh storefront folder I'll go to my store config.js and I'll enable enable future search
• 26:00 - 26:30 true save the file and I will enter these envs directly into my uh versel so on my versel I can go to settings environmental variables and add them here so I'll copy my end point I'll copy my public
• 26:30 - 27:00 key and public key is default search API key and I'll copy my index products I will come back to my Parent Directory and I'll go into my Medusa storefront and I'll get ad
• 27:00 - 27:30 get commit get push so I updated my uh Medusa storefront with the latest environmental variables on verel and it will push those it will redeploy based on my GitHub
• 27:30 - 28:00 commit after um that I'll will configure my stripe plugin so I will navigate and I will search stripe in Medusa talks and I'll follow the official tutorial so I'll open my stripe I already have my stripe account created so I go to developers API keys so these keys I'll use uh while configuring my strip plugin
• 28:00 - 28:30 and I'll follow installation so I'll come back to my ID I'll go back to my parents and go into my Medusa uh server folder and I'll run npm install M uh payment strip plugin and it will install the plugin next uh I will need to configure my uh
• 28:30 - 29:00 Medusa uh config file and I'll copy code go back to my Medusa plugins and add the plugin here and I will need to include my envs so I'll create new envs for
• 29:00 - 29:30 stripe and I'll need the back web hook secret as well so for my secret key it's here so you can copy that value here and enter it here and for my web hook secret I go to web hugs I'll create a new endpoint I will copy our admin
• 29:30 - 30:00 link of where it's hosted on digital ocean I'll paste it here DOA tutorial and I will select all events for now and click create and add endpoint and I will click reveal signing
• 30:00 - 30:30 key I'll copy the key and I'll paste it here and save the file we would need to add stripe envs to our nextjs storefront as well so if I look at the EnV local template uh it has next public strap key so I would need that environmental variable and I'll go to my uh
• 30:30 - 31:00 versel EnV settings I'll copy stripe uh publishable key and I'll paste it here and click save and I will copy my domain here and add it to my envs as well I'll edit it and paste the value here
• 31:00 - 31:30 hit save go back to my deployment and I'll just redeploy it to have all the uh envs applied after we have finished configuring our strip plugin the next one will be send grid to send transactional emails um to our clients on the e-commerce store so so I already have set up my uh send grid account you
• 31:30 - 32:00 can follow tutorials online on how to set it up uh for yourself but I will go back to Med docs and search send grid and I will follow the instructions on how to set up S grid so first thing I will install the plugin I'll make sure I am in my Medusa um server folder so there is meusa
• 32:00 - 32:30 tutorial storefront this is my storefront and matusa tutorial this is my server folder and I'll run npm install Medusa plugin s grid and that will install the plugin uh next I would add these uh Keys EnV keys to myv file
• 32:30 - 33:00 and I will also add the order placed line here and I will go with the standard example here for my Medusa config save the file and come back to my envs so first we will would need to create an API Keys you can go to
• 33:00 - 33:30 settings API Keys create API key I'll go with full access do some tutorial I'll copy the key paste it here the email from this going to be an email that uh you have set up your
• 33:30 - 34:00 account to work with in my case this is my personal Gmail and we will need to create a dynamic template so you can read all the guides on um Dynamic templates how to create it but I'll create a very simple one go to
• 34:00 - 34:30 my email API Dynamic [Music] templates create Dynamic template uh I'll call it Medusa tutorial uh new template order placed and I'll add the [Music] version I'll go with code [Music] editor and I'll just just say thank you for your
• 34:30 - 35:00 order and I'll add ID as well to test uh the dynamic values I'll save it come back and here I can find my template ID and I'll add it to my envs here and save it
• 35:00 - 35:30 so once that's uh once that's complete we can um commit our code our backend server code to our GitHub so I'll go get add root get commit and get push so while my repository is being updated I'll copy all all these environmental
• 35:30 - 36:00 variables and I'll come back to my digital ocean I'll go to my app platform I'll go to my Medusa tutorial app I'll go to settings and I'll select component here Medusa tutorial and I'll click addit en envs I'll I'll hit on bulk editor and I'll just paste all these
• 36:00 - 36:30 envs here at the end I'll delete comments and I will hit save hit save save and it will update our en variables and Trigger redeployment so I'll go to my build logs and our deployment is successful I'll go
• 36:30 - 37:00 to my live app and I'll add app at the end so we can see it here and let's test out our plugins so the first plugin I want to test is a Mele search so I'll go to my uh storefront and I'll go to search and I'll type T I'll type some random
• 37:00 - 37:30 character so here it seems like it's working just to be sure I'm going to open melee search dashboard and I'll open search preview and I will type t-shirt and use as you can see see we're indexing title description uh thumbnail
• 37:30 - 38:00 and handle so that's working now let's test our strip so before testing our stripe we have to actually activate it on the backand so I will go to my regions and I will addit the region details and payment provider I'll add stripe and I'll hit save and close and and I'm going to be using temporary email to test my uh send grid
• 38:00 - 38:30 integration as well so I'll copy this email and I'll come back to my storefront and I'll search for product t-shirt I'll select the product add to cour go to my court go check out and fill out information
• 38:30 - 39:00 here and I'll paste my test email here select delivery option and I'll choose credit [Music] cord and I'll enter test number continue and review and place
• 39:00 - 39:30 order and the order is successful Let's test our transactional email and this uh transactional email work we got the email with the dynamic value order ID and it says thank you for your order and let's see it on Medusa I go to orders here is my new
• 39:30 - 40:00 order and says payment evading so I'm going to open stripe I go to payments and as we can see I got a new payment and the status is uncaptured here's our customer so I'm going to go back to my Medusa admin and hit uh capture payment and it says successfully captured payment so if I refresh this page you will see that uh my payment is
• 40:00 - 40:30 indeed captured so our search working our uh sang GD integration for transactional emails working and our STP for uh capturing payment working you might consider is to U addit the course store course uh settings on your U backand uh EnV configurations so I can add it and
• 40:30 - 41:00 restrict my uh store so I don't have any store course yet so I'll add store course and I will restrict it to my storefront URL
• 41:00 - 41:30 and it will redeploy uh my project and our new deployment is successful and just to make sure my store course is working properly I'm just going to access my product and make sure I'm hitting uh Medusa server I can add it to
• 41:30 - 42:00 court go to my court go to check out and as you can see it's working [Music] fine and the last plugin that we're going to install is uh spaces object storage plugin uh that will help us store our media files on a digital ocean so so I'll go ahead and I will create a new
• 42:00 - 42:30 storage I'll create a spaces bucket and I'll leave everything standard and I'll name it Medusa [Music] tutorial bucket and I'll create spaces bucket and I'll open official Medusa dos for the spaces plugin and I will follow installation uh tutorial here so I'll
• 42:30 - 43:00 copy the command and I'll make sure I'm in my Medusa server uh folder and I'll run the command I'll copy e andb variables and I'll paste them here
• 43:00 - 43:30 I'll save the file and I will copy plugins config and I will paste it right here where um where my plugins uh configures I'll save the file and I will go go to my digital ocean and I will generate uh the API key
• 43:30 - 44:00 for the uh spaces object storage so I'll go to API and I'll go to spaces key and I'll generate a new key and I'll copy my secret key because I won't be able to see it another time
• 44:00 - 44:30 I'll go to EnV and I'll paste my secret here key right here I'll also copy my key ID and I'll paste it here I will come back to the spaces uh uh configuration on Medusa docs and I will follow the
• 44:30 - 45:00 instructions here space region space bucket and space URL so space URL I can grab from here I will go to my object storage again I'll select my bucket and I'll copy my origin end point so that would be my space URL uh my space name would be Medusa tutorial bucket and my space region would be New
• 45:00 - 45:30 York City 3 and my uh it my end point is my region. digital oceans spaces.com so I'll copy this value here and I'll paste it here and I'll save the file so once that done I'll go get add get commit
• 45:30 - 46:00 K push that will update my uh remote repository and I'll copy these EnV variables and I'll add them to my digital ocean app so I'll go to app platform I'll select my app I'll go to settings I'll pick Medusa tutorial backand as my
• 46:00 - 46:30 resource and I'll addit my environmental variables and I'll just paste my spaces envs here and hit save and hit save again and that should prompt a new deployment and I'll go to my build logs and wait until my server is deployed and our deployment went live so I'm
• 46:30 - 47:00 going to open the admin URL open my dashboard and I'll go and test our spaces plugin so I'll create a new product I'll say test product and I will add a thumbnail
• 47:00 - 47:30 and I'll click publish product and if I open Digital ocean and refresh my uh spaces bucket I'll see that I have this image here now so the next step I will need to configure my store phone to accept uh images from my bucket and I'll need to grab my um bucket URL and I'll open my uh IDE I'll navigate to Parent Directory and to my
• 47:30 - 48:00 Medusa uh storefront and I'll open my storefront and I'll go to next. config.js and I will need to add and I will need to add the URL and the remote patterns so I'll grabb the URL
• 48:00 - 48:30 here and I'll replace it here this I can now delete I'll save the file and I will I will commit it to GitHub so when I open my verell it should trigger new deployment and as you can see it's building and our build and deployment complete so I'm going to visit the page I'll go to menu
• 48:30 - 49:00 store and as you can see our product uh image is loaded from the digital Ocean and the URL can be found right here so it's from the digital ocean spaces bucket it works great so to recap we have successfully deployed our uh Medusa server to digital ocean uh app platform with autoscaling
• 49:00 - 49:30 and our nextjs storefront to versol serverless along with all necessary plugins for your store to function and production environment and scale well thank you for watching if you have any questions reach out uh to me you can find me on Discord and official Medusa uh server uh you can also post your questions and help I often time look there and um have a nice day