> For the complete documentation index, see [llms.txt](https://docs.create-scandipwa-app.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.create-scandipwa-app.com/deploying-your-app/storefront.md).

# Storefront

[ScandiPWA theme](/themes/extensions-and-themes.md) is capable of being bundled into the storefront.

{% hint style="info" %}
**Storefront** - a stand-alone deployment of your e-commerce platform front-end. The storefront main goal is to display the data coming from e-commerce platform API. The storefront is not the data-source, rather data-presentation.
{% endhint %}

Creating a storefront build is simple. It works out-of-the-box with any application created using Create ScandiPWA App. All you need to do is to bundle it using the [production build command](/master.md).

## Deploying the Storefront

The main challange of deploying ScandiPWA as a storefront is to properly configure the [proxy to existing Magento 2 instance](https://create-react-app.dev/docs/proxying-api-requests-in-development/). This is automatically done in development, however in production, you must configure it yourself.

### Using the CLI

To deploy an application to the **FREE** ScandiPWA static-hosting, you can use [ScandiPWA CLI](broken://pages/-MMa4JsVvBMbamKNarro). In order to do it, simply type-in following command from your theme's root:

```
scandipwa deploy
```

This will return you a link to your instance and update the `package.json` file with the `scandipwa.staticDeploy` field. This field makes you application deployment persistent. Next time you run this command, the changes will be reflected on the same instance.

The application will proxy all requests to the Magento server you defined in the `proxy` field of your `package.json`.

### Using the express server

This approach is a little-bit more complex. In order to do it you will need to install the `express` server and `http-proxy-middleware` as your theme's dependency. To do it, run:

```bash
npm i express http-proxy-middleware # for NPM
yarn add express http-proxy-middleware # for Yarn
```

Then create a new file `server.js` in the application root. Inside, paste following:

```javascript
const express = require('express');
const path = require('path');
const { createProxyMiddleware } = require('http-proxy-middleware');

const app = express();

app.use(express.static(path.join(__dirname, 'build')));

app.use(['/graphql', '/media'], createProxyMiddleware({
    target: require('package.json').proxy,
    changeOrigin: true
}));

app.get('/*', function (req, res) {
  res.sendFile(path.join(__dirname, 'build', 'index.html'));
});

app.listen(9000);
```

Now, [create a production build](/building-your-app/creating-production-build.md). Then, start the server:

```javascript
node server.js
```

The application will proxy all requests to the Magento server you defined in the `proxy` field of your `package.json`.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.create-scandipwa-app.com/deploying-your-app/storefront.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
