How to deploy static pages on Heroku

What is Heroku?

Try our first deployment

$ touch index.html
$ code index.html
<!DOCTYPE html>
<html>
<head>
<title>Deployment Example</title>
</head>
<body>
<h1>Deployment example</h1>
<p>Simple example of static pages deployment on heroku.</p>
</body>
</html>
$ git add index.html
$ git commit -m "Index file"
$ git push
!     No default language could be detected for this app.HINT: This occurs when Heroku cannot detect the buildpack to use for this application automatically.See https://devcenter.heroku.com/articles/buildpacks!     Push failed

Why does that happen?

$ touch package.json
$ code .
{
"name": "My Beautiful Project",
"author": "Rui Coelho",
"version": "0.0.1",
"description": "My beautiful static page project",
"scripts": {
"start":"serve",
}
"dependencies": {
"serve":"^11.3.2"
}
}
$ git add package.json
$ git commit -m "Node server"
$ git push

Bonus points

$ npm i --save reload
$ npm run dev

Ignore files before commit

$ touch .gitignore
node_module
package-lock.json

Conclusions

Source Code

--

--

--

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

How to set up the NodeJS Express project

Dog Runs and Flying Cars

Swagger / OpenAPI Intro

6 things you (probably) didn’t know you could do in chrome dev tools.

Integration and unit testing with Jest for NodeJS and Mongoose

Micro Front-Ends: Web Components

Coding Academy: Week 20

Using Redux with React Native

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Rui Coelho

Rui Coelho

More from Medium

How to display product swatches in your in Shopify 2.0 Dawn theme

Create and publish a VS Code theme.Step by step.

How to Add Icon and Splash Screen to your Ionic App

Vue— What is it? — Ch 01