I am deploying a Node.js Express app to a VPS by Render. When I run the app on my local machine, the npm start command does a great job of serving my file when I point the browser to localhost:3001. However, after I deploy, the base directory '/' returns "Not found". I have to point my browser to example.onrender.com/public/index.html.
How do I make sure that example.onrender.com/ routes the request to public/index.html?
Thank you!
const express = require('express');
const path = require('path');
const app = express();
app.use(express.static(path.join(__dirname, 'public')));
app.get('/', function(req, res) {
res.render('index.html');
});
app.listen(3001);
Actually just had to change "Publish Directory" settings in Render to ./public
Related
Im trying to deploy angular app 13.2
ng build
This command generated dist folder
//Install express server
const express = require('express');
const path = require('path');
const app = express();
// Serve only the static files form the dist directory
app.use(express.static(__dirname + '/dist'));
app.get('/*', function(req,res) {
res.sendFile(path.join(__dirname+'/dist/index.html'));
});
// Start the app by listening on the default Heroku port
app.listen(8080,'127.0.0.1');
Using above started server, but finding this error in browser console
Any help...
I've deployed a react js application with digitalocean app platform and there's an express js file to make react js as a production application. when I deploy my application it loads smoothly. But when I deploy a new version browsers show only a white screen for the index page. But I can manually route to other pages like /about, /stlogin. Also, the console shows an error stating
Unexpected token '<' main.229b5112.chunk.js:1 . But after clearing the browser cache it loads without any problem. I tried giving a homepage to the package.json file but it didn't work.
const express = require('express');
const path = require('path');
const app = express();
app.use(express.static(path.join(__dirname, 'build')));
app.get('/*', function (req, res) {
res.sendFile(path.join(__dirname, 'build', 'index.html'));
});
app.listen(8080);
build folder and server.js are in same level.
I tried to connect angular front end with nodejs earlier I ran ng build on public folder of app and then ran localhost:3000. No error was given on compilation but app is broken now. Now do I achieve it? My folder structure is like this
client
public
app.js
client contains all angular code, public contains compiled code of angular
till I have also changed output path to ../public in angular.json.
And here is my app.js:
var express = require('express');
var path= require('path');
var cors = require('cors');
var mongoose = require('mongoose');
var bodyParser = require('body-parser');
var passport = require('passport');
var app= express();
var port = 3000;
app.set('view engine','ejs');
//app.use(express.static(path.join(__dirname, 'public')));
app.set('views', path.join(__dirname, '/views'));
app.use(express.static(path.join(__dirname, 'public')));
app.use('/api', routesApi);
app.get('/', (req,res) => {
res.send("Invalid page");
});
app.listen(port, () => {
console.log(`Starting the server at port ${port}`);
});
I think up to now you have a build of a running angular application and perfectly running node.js server.
What you have to do is host your client application. Follow the following steps to get this working.
Install http-server globally on your machine using npm install http-server -g command
Then run http-server /path/to/your/dist/folder. (You should get a dist folder after running ng build --prod)
Then run your node.js server.
And open your browser and go to http://localhost:8080
Newbie question that is driving me crazy. I am trying to build the ToDo app with the MEAN stack and I can't get the Express server to connect to Angular 2. I believe it has something to do with where I have my index.html view relative to the Angular installation, but I can't figure it out.
Your project folder struction should like below
project/server [Node]
project/server.js is your express server
// Get our API routes
const api = require('./server/routes/api');
const app = express();
// Parsers for POST data
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
// Point static path to dist
app.use(express.static(path.join(__dirname, 'dist')));
// Set our api routes
app.use('/api', api);
// Catch all other routes and return the index file
app.get('*', (req, res) => {
res.sendFile(path.join(__dirname, 'dist/index.html'));
});
project/src/index.html [angular code]
You can build angular code into dist using
ng build
This creates the dist folder with the angular 2 app built files. Now we can serve the app with express.
For run server use
node server.js
which create server
Go through https://scotch.io/tutorials/mean-app-with-angular-2-and-the-angular-cli for more information.
Thanks in advance
I generated an Angular2 project by using Angular-CLI. This is the front-end side. Now I'd like to add an Express server but I don't know how exactly should I do that.
Should I add an express app.js file into generated by Angualar-CLI "src" directory? I've tried it and what's next? To start Angular-CLI project, I need to type ng serve in CMD. To start server, I need to type node app.js.
Example of app.js
var express = require('express'),
path = require('path'),
favicon = require('serve-favicon'),
logger = require('morgan'),
cookieParser = require('cookie-parser'),
bodyParser = require('body-parser');
var app = express();
app.get('*', function(req, res) {
res.sendFile(path.join(__dirname, 'index.html'));
});
app.listen("8080", function() {
console.log("at 8080 port");
});
module.exports = app;
Well... Angular2 doesn't work when I start app by node app.js. ng serve builds all files and in mysterious for me way puts it all together.
Maybe I should create front-end and back-end completely separated? But what then? Use technology like Nginx for reverse proxy?