# Deployment

{% hint style="success" %}
[Get $200 free credits on Digital Ocean](https://m.do.co/c/e4c24293fe5d).
{% endhint %}

Your React client will run in development mode by default. When you want to deploy to a live server, you must build the front-end and serve the static files.

```javascript
// build the client
cd client && npm run build

// serve the client
npm run serve
```

You can run this file before you deploy or set it as a `post-build` script in `package.json` if your hosting provider supports post-build scripts. Gravity includes the [Heroku](https://heroku.com) `post-build` script for you already.

{% hint style="warning" %}
You need to set server.open to false in vite.config.js before deploying.
{% endhint %}

## Running The Client & Server Together

If you want to serve the static files in the same production environment as your server, you will need to add the following lines to `server.js`

````javascript
// serve static files in production
if (process.env.NODE_ENV === 'production'){

  app.use(express.static(path.join(__dirname, 'client/dist')));

  app.get('*', (req, res) => {
    res.sendFile(path.join(__dirname + '/client/dist/index.html'))
  });
}
```
````

## Environment Variables

You must ensure you set up your [environment variables](/gravity-server/environment-variables.md) in your production environment.&#x20;

## Heroku Deployment Tutorial

{% embed url="<https://www.youtube.com/watch?v=TkVwVHbzukw>" %}


---

# Agent Instructions: 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:

```
GET https://docs.usegravity.app/gravity-web/deployment.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
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.
