> For the complete documentation index, see [llms.txt](https://pea-story.gitbook.io/pexpa/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://pea-story.gitbook.io/pexpa/deploy/heroku/how-to-deploy-react-app-with-express.md).

# How to deploy React App with Express

![](https://1185482582-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M9iStFHsqcx7bX2Ba8R%2F-M9kYKzdZsZDC9MeeNWY%2F-M9kYUuAgFnd53AXciQY%2Fone-year-of-react-native.png?alt=media\&token=a159f89d-4447-4be9-bfd2-ac1092dae739)

&#x20;**Hey guy, Today I write a little tutorial for deploy project in React app and Express**

### **Create new React app and Express app**

```bash
create-react-app my-app
```

```bash
express my-server
```

After create project, we will change a little in folder **my-server**&#x20;

* Add folder **client** with purpose using for insert project **my-app**&#x20;

So Architecture directory should be&#x20;

```bash
|--- bin
|--- client
     |--- public
     |--- src 
     |--- .gitignore
     |--- package.json
|--- public/stylesheets
|--- routes
|--- views
|--- app.js
|--- package.json
|--- .gitignore
```

### Configuration for package.json in my-server

```bash
{
  "name": "server",
  "version": "0.0.0",
  "private": true,
  "scripts": {
    "start": "nodemon ./bin/www",
    "heroku-postbuild": "cd client && npm install && npm run build"
  },
  "dependencies": {
    "cookie-parser": "~1.4.4",
    "debug": "~2.6.9",
    "express": "~4.16.1",
    "http-errors": "~1.6.3",
    "jade": "~1.11.0",
    "morgan": "~1.9.1",
    "nodemon": "^1.19.3"
  }
}
```

#### I hope post will useful with you :grin:&#x20;