Heroku vs Netlify

Which is better?

While I haven't figured which one is truly better than the other, I have figured out (the hard way) what each is better for.

Heroku

Heroku has the benefit of being able to handle full stack applications well and is aimed more towards backend development. Creating a Rails or Node/Express backend comes with its own buildpacks which get applied to the site upon the file being imported.

Backend deployment is great on Heroku, but with some build scripts involved such as the one I used with my most recent project, was able to deploy the front end along-side keeping this hosted project in one location.

Here is the code used for deployment:

// ./package.json

"scripts": {
  "heroku-postbuild": "NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run build --prefix client"
}

Code used for serving the frontend from index.js on the server:

// ./index.js

const express = require("express");
const path = require("path");
require("dotenv").config();

const app = express();

if (process.env.NODE_ENV === "production") {
  app.use(express.static(path.join(__dirname, "../client/build")));

  app.get("*", (req, res) =>
    res.sendFile(
      path.resolve(__dirname, "../", "client", "build", "index.html")
    )
  );
} else {
  app.get("/", (req, res) => res.send("Please set to production"));
}

// Keep this code above the error handling middleware call

With those two snippets the node app goes live after configuring which branch to deploy and setting environment variables.

Netlify

Netlify was my targeted place to host my previous application on, but learned that because I was using a type of framework for the server was not able to deploy successfully.

Netlify is build for frontend projects as a SPA or as a standalone web page. Frontend frameworks will work with netlify quite easily as the build folder will be generated and be read from to display the page.

As a side effect of being limited to frontend deployment only, this allows the site to react quite fast and has virtually no "spin-up" time to become interactive.

The downside is that it will not work with backend frameworks, unless you have implemented server-less functions which will act as a backend without any runtime or framework getting in the way.

Deploy on Netlify

Deployment is rather plain with a couple of choices:

• NetlifyCLI or
• connect your Git account

Both method achieve the same result, but by connecting to the Git repo allows for a deployment in just a couple minutes.

Once logged in:

• repo selection
• branch to deploy
• DEPLOY!

Monorepo

A monorepo or frontend directory nested inside a parent directory just needs a little specificity during the branch selection > ./client or ./frontend whichever is the fronted to be deployed this will work.

A redirect for an API calls to where the backend (if any) is hosted will need to be reflected within the api call since development checks for a local instance of a running server.

Conclusion

Heroku is based on backend deployment which can be a little slow if the server is left sleeping, but has the benefit of serving a full-stack application after small configuration.

Netlify is based on frontend deployment and does not allow for any backend frameworks aside from server-less functions to be used in the same manner.