Deploying an angular app to heroku from github subdirectory

-

 


1.Check Node and Npm version

2.Create Angular App

3.Run app(ng serve)

4.Add "heroku-postbuild": "ng build --prod" and "start": "node server.js"  in scripts in package.json

5. Add  "engines": {    "node": "local machine version",    "npm": "local machine version"  } in package.json

6.Take devDependencies(@angular/cli,@angular/compiler-cli,typescript) to dependencies  in package.json

7.install express server. npm install express path --save

8.Create server.js file in root directory and put this .

const express = require('express');

const path = require('path');

const app = express();

app.use(express.static('./dist/appname'));

app.get('/*', (req, res) =>

    res.sendFile('index.html', {root: 'dist/appname/'}),

);

app.listen(process.env.PORT || 8080);

9. add "start": "node server.js" in scripts in in package.json

10.init git repo: (git remote add origin <new_repo_url> and commits and push )

11.login to heroko

12.create app 

13.connect to GitHub repo 

14.if necessary ,add buildpacks(https://github.com/timanovsky/subdir-heroku-buildpack)  and nodejs and set PROJECT_PATH=Subdirectory folder name from setting 















15.select branch to Deploy 

Comments

Post a Comment

Popular posts from this blog

Provision AWS EC2 Instance and RDS with Terraform, and Deploy Spring Boot App to EC2 Instance via GitHub Action Pipeline

-
Image
  These days, Terraform is a popular tool for managing infrastructure as code. Manually creating AWS EC2 instances and deploying Spring Boot applications to them can be challenging. In this tutorial, I will demonstrate how to use Terraform to provision an AWS EC2 instance and an AWS RDS MySQL database, and then deploy a Spring Boot project to that EC2 instance using a GitHub Action pipeline. Prerequisites: To follow this tutorial, you need to have the following prerequisites: An AWS account Terraform installed on your local machine. GitHub Account A Spring Boot Project Putty What We will do : Create AWS EC2 & RDS(MYSQL) Instance using Terraform Deploy Spring Boot Project in that EC2 Instance Using GitHub Action Create AWS EC2 & RDS(MYSQL) Instance using Terraform: Step 1: Create and Configure an AWS Free Tier Account AWS offers a free tier account with a 12-month free offer that allows you to use most of its resources for educational purposes. To get started on AWS, you fi...
Read more

JQuery UI Autocomplete, custom HTML structure for result?

-
$( '#myAutocomplete' ).autocomplete( {     source: availableTags,     multiselect: true ,     open: function ( e, ui )     {         var             acData = $( this ).data( 'ui-autocomplete' ),             styledTerm = termTemplate.replace( '%s' , acData.term);         acData             .menu             .element             .find( 'div' )             .each( function ()             {                 var me = $( this );                 console .log(me);                 me.html(me.text().replace(acData.term,                     s...
Read more

Easy Ui Jquery easyui-textbox change onChange event

-
$( '#LastName' ).textbox({ onChange: function (newValue, oldValue) { console.log( 'onchange fired...textbox, newValue:' + newValue + ";oldValue:" + oldValue); $( "#Fullname" ).textbox({ value: $ ( '#FirstName' ).val().trim() + " " + $( '#MiddleName' ).val().trim() + " " + $( '#LastName' ).val().trim() }); } }); <tr> <td> <label style= "font-size: 12px" > First Name : </label> </td> <td> @* <input name= "FirstName" id= "FirstName" class= "easyui-textbox" required= "true" ></input> *@ @* <input name= "FirstName" class= "easyui-textbox" ...
Read more