Node js as http server and host angularJS SPA

Question

I have an application written on angularJS and built by grunt. Is there a way I can create a http server from node js and host it there. Please share any code snippet or document which would help. Thanks

Consummate

get a tutorial for node.. How to get started with and thats it.... You don't have to ask on stackoverflow – Ceroplastics

Rohit, Can you share a link. I could get a lot of document and tried few code snippets. I could create a server. But that not taking up my application. – Consummate

if you are getting some issue while configuring the app, do post that here... Node.js will take more time to learn than what you seems to be giving... So keep patience and try more... Although I can give you some link but I think you know to google yourself as well... – Ceroplastics

If you are having trouble and have a specific error that you need assistance with, feel free to update the question. As it and the comments are written now, it appears that you are asking for links to tutorials or other off site resources, which is off topic for Stack Overflow due to these questions generating large amounts of opinionated answers and spam. – Bove

Answer 1

1. (simplest) if you don't have any server side logic, you can simply serve client side AngularJS/HTML/css via http-server module from npm. https://www.npmjs.com/package/http-server Just install it via $>npm install -g http-server and go to your client folder, type http-server and hit enter.

2. If you have server side code written, (ExpressJS or restify web api) then use $>nodemon server.js

3. If you are looking at options for production applications, consider forever/pm2 https://www.npmjs.com/package/pm2 https://www.npmjs.com/package/forever

Sacker

Yes, I also keep client & server separate. I run client using http-server and server using nodemon/forever. when you go to production, you can choose to deploy client on cloudfront/CDN. (Pls accept the answer if it worked for u, by pressing right button). – Sacker

I know this is a very old post. But how do u get the right css/styling to be displayed with the client code? – Flickinger

Answer 2

Use the following code in your app.js file.

var express = require('express');

var path = require('path');
var bodyParser = require('body-parser');
var app = express();

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: false}));
app.use(express.static(path.join(__dirname, 'public')));

/* GET home page. */
app.get('/', function(req, res, next) {
  //Path to your main file
  res.status(200).sendFile(path.join(__dirname+'../public/index.html')); 
});

module.exports = app;

Run the app.js file using node app.js

Amandine

thanks just what I needed. I am guessing i should put my entire angular app in public/ folder – Pantelleria

You cannot use url for routing in this method That is you can browse through the pages of your angular application but if you reload the page you will get a 404 error from your nodejs app insted of routing to the angular app's page – Fertile

Answer 3

This example work for me with any case

Eeven if you have base-url or not

source code here

var express = require('express');
var path = require('path');
var bodyParser = require('body-parser');
/**
 * This server should host angular appliation with or without base-url
 * The angular static resources should be under `./public`
 */
var app = express();
app.use(function(req, res, next) {
  console.log('Time:', Date.now() + ":", req.originalUrl)
  next()
})
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({
  extended: false
}));
app.use(express.static(path.join(__dirname, 'public')));
app.use('/base-here-if-any', express.static(path.join(__dirname, 'public')))

app.get('*', function(req, res, next) {
  //Path to your main file
  res.status(200).sendFile(path.join(__dirname + '/public/index.html'));
});


const port = 3000


app.listen(port, () => console.log(`Example app listening on port ${port}!`))

Chandrachandragupta