React App con TailwindCSS y Deploy en Heroku Pt. 2

Continuando con la parte anterior de configuración de React y Tailwind ahora solo toca la configuración para el deploy en Heroku.

Primera parte

React App con TailwindCSS y Deploy en Heroku Pt. 1

1. Crear servidor con Express.js

En la raíz de nuestro proyecto creamos un archivo llamado server.js

Copiamos y pegamos el siguiente código en nuestro nuevo archivo:

const express = require('express');
const favicon = require('express-favicon');
const path = require('path');
const port = process.env.PORT || 3000;
const app = express();
app.use(favicon(__dirname + '/build/favicon.ico'));
// the __dirname is the current directory from where the script is running
app.use(express.static(__dirname));
app.use(express.static(path.join(__dirname, 'build')));
app.get('/ping', function (req, res) {
return res.send('pong');
});
app.get('/*', function (req, res) {
res.sendFile(path.join(__dirname, 'build', 'index.html'));
});
app.listen(port);

En resumen creamos un servidor de forma rápida que ira a nuestra carpeta de “/build” que haremos en pasos siguiente y se ejecutara en nuestro deploy de heroku.

1.1 Instalación de Express