Easily Set Up an Ecommerce Store with Docker and Medusa
Tags: javascript, webdev, programming, opensource
Published: 2022-11-29 13:23:25

[Medusa](https://medusajs.com/) is an open source headless ecommerce platform that allows developers to create their own customizable and extendable online store. With Medusa, developers can have a fun time building distinctive e-commerce sites.

Medusa is composed of three components: the headless backend, the admin dashboard, and the storefront.

In this tutorial, you’ll set up the Medusa backend server with Docker by running only a few commands. You’ll then install the admin and storefront and link them to the Medusa server.

## What is Docker?

Docker is an open source containerization tool that allows you to build, test, deploy, and manage applications quickly using lightweight virtualized environments called containers.

These *Docker containers* have everything that the application needs to run, including libraries, system tools, code, and runtime. Docker containers are based on *Docker images*.

A Docker image is a template file that acts as a set of instructions to run containers. The easiest way to build a Docker image is by using a plain-text file called *Dockerfile* that contains all the specifications for creating the image. 

A simple Dockerfile looks like the following:

```docker
FROM alpine
CMD ["echo", "Hello Medusa!"]
```

## Prerequisites

Before continuing in this article, you need to install a few tools and software:

1. Node.js: You need Node.js and NPM to install [@medusajs/medusa-cli](https://www.npmjs.com/package/@medusajs/medusa-cli). If you haven’t installed Node.js yet, install it from [here](https://nodejs.org/en/download/).
2. Git: Git is a version control system. Medusa uses it behind the scenes while creating a project. You can install it from [here](https://git-scm.com/downloads).
3. Docker: You need Docker to set up your server. You can download and install Docker on your system from [here](https://www.docker.com/).

## Setting up Your Development Server with Docker

Once you have installed the tools from the prerequisites section, you are good to follow along to set up your development server with Docker.

Install the Medusa CLI using the following command:

```bash
npm install -g @medusajs/medusa-cl
```

Now that you have installed the Medusa CLI, create a new Medusa project using the following command:

```bash
medusa new my-medusa-store
```

Once the project is created, go to the newly-created project directory named `my-medusa-store`. This directory will have the following files and folders:

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bqjph59t4xk0qm6d5ewo.png)

Now, you can find some familiar files like `Dockerfile` and `docker-compose.yml` as seen above. The explanation of these files is beyond the scope of this article. For the time being, you should just understand that the Dockerfile is used to build the image for the Medusa server.

In addition to this, the compose file also includes two images, Postgres and Redis, which are essential for running the server.

Now that you have a Docker Compose file, you can run a container. Before running any Docker container, make sure your Docker Desktop is running successfully.

As already discussed, you need to create the image yourself; use the following command to build the image and run containers using that image:

```bash
docker compose up --build
```

The command will take some time to build the image and run the required containers. If you see the following output at the end, then your local Medusa server is up and running on port `9000`.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/l2yxqo45w0v9wzbbny6s.png)

If you get any error saying `./develop.sh: no such file or directory`, then replace the last line in the Dockerfile with the following:

```docker
ENTRYPOINT ["sh", "develop.sh"]
```

Once done, run the previous command again to start your containers.

Your server database is empty of data as of now. 

You can optionally seed your server with demo data. Since the server is running inside a Docker container, you will need to execute the seed command inside that container.

Run the following command in a different terminal to seed your database with demo data:

```bash
docker exec medusa-server-default medusa seed -f ./data/seed.json
```

## Test Your Medusa Server

Once you have the server up and running, you are ready to test your Medusa server. You can go to [http://localhost:9000/store/products](http://localhost:9000/store/products) on your browser to check whether you have set up your server correctly. If you haven’t seeded the database in the previous step, you will see the below output:

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/b1tp48hxee1yt47tzq7y.png)

However, if you seeded the database, you will see JSON data with an array of products and other details.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ramfkgtyqko19enppi2c.png)

Congratulations, you just set up your first Medusa server with Docker!

## Set up your Next.js Storefront

In this section, you’ll to set up your Next.js Storefront to provide your customers with a great experience browsing your ecommerce store.

First, clone the Next.js Starter Medusa repository from GitHub using the command:

```bash
npx create-next-app -e https://github.com/medusajs/nextjs-starter-medusa my-medusa-storefront
```

Next, navigate into the cloned repository folder and get your environment variables ready using the command:

```bash
cd my-medusa-storefront/
mv .env.template .env.local 
```

Now you are ready to start up your project using the command:

```bash
npm start
```

### Test Storefront

Once the frontend server starts up, you can visit [http://localhost:8000/store](http://localhost:8000/store) on your browser to see your products. Your storefront will look similar to the below:

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/krig4bdk3v26fbi9mv9l.png)

If you look clearly, these are the same products that your server has returned in JSON format.

## Set up Medusa Admin

In this step, you’re going to set up Medusa Admin. Medusa Admin allows you to manage your ecommerce store’s data including products, orders, settings, and more.

To start with, clone the Medusa Admin repository on GitHub and navigate to the cloned repository folder:

```bash
git clone https://github.com/medusajs/admin.git
cd admin
```

Next, install all the dependencies using the NPM command:

```bash
npm install
```

Further, start the development server for Medusa Admin:

```bash
npm start
```

### Test Admin

Once the development server starts up, you can visit [http://localhost:7000](http://localhost:7000) to see your admin panel. The admin panel initially asks you for login credentials. If you have already seeded the data, the admin username is *admin@medusa-test.com* and the password is *supersecret*.

However, if you haven’t seeded the data, you can create an admin user by running the below command on the Medusa server:

```bash
medusa user -e admin@email.com -p some-password
```

Once the admin user is created, you can log in and start adding products as shown in the demo below:

{% embed https://youtu.be/CJuBwLDJoZI %}

Note that in the above demo, the server has data already seeded.

## Additional Configurations

You can set the environment variables used in the project by changing their values in the `docker-compose.yml` file. The `docker-compose.yml` file contains an environment section in the different services wherein all of your environment variables used by that specific container are mentioned.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xftmo14pxfkze3was3de.png)

You can add a new environment variable as `KEY`: `VALUE`. An example of the same is given below:

```docker
environment:
	...other environment variables...
	MY_VAR: ABCD123
```

In the above example, `MY_VAR` is the name of the environment variable and `ABCD123` is the value of that environment variable.

Once you run a Docker container using this `docker-compose.yml` file, your container will have these environment variables already set.

You can learn about adding more configurations to your Medusa server in [this documentation](https://docs.medusajs.com/usage/configurations/).

## Conclusion

Docker makes it very easy to pack, ship, and deliver code. In this tutorial, you set up your first Medusa server with Docker by running just a few commands.

You can check out [Medusa’s documentation](https://docs.medusajs.com/) to learn more about Medusa and its features. You can explore more about Docker in [their documentation](https://docs.docker.com/).

> Should you have any issues or questions related to Medusa, then feel free to reach out to the Medusa team via [Discord](https://discord.gg/F87eGuwkTp).