Deploy react + node.js project to IIS - node.js

I managed to deploy only the frontend (ran build command and added a site with the built folder path to IIS), I saw that iisnode is required in order to make it work..
How can i deploy the backend aswell into the IIS?

Related

How To Deploy Angular 8 Project to Server cpanel

I have developed one application using angular 8 and nodejs(MEAN) for website.Tested in my local server, working perfectly.But i do not know how to deploy in cpanel(I have cpanel access).
Please help anyone to find solution.
My folder structure is like below:
myproject - main folder name:
client - (angular application)
server - (NodeJS script)

Index.html is missing while generating reactjs build. How can we deploy react and nodejs project to production?

I have created my project with Create React App and for a server using nodeJs but when deploying to production, the file index.html is missing in build folder. I've checked the public folder and the template of index.html is still there.
Refer to react-create-app documentation. Creating a production build
When running in development mode, create-react-app spins up a server that serves everything from the public folder.
Thus, in production, your express app also needs to serve everything from the public folder.
server.use(express.static("public"));

Heroku deployment confusion: Vue.js frontend with Flask backend

I currently a web app involving a Vue.js frontend with a Flask backend acting as a REST API. They are divided into the client and server folders in my repo, respectively. I am looking to deploy it to Heroku via the Github deployment feature but am running into some errors and questions I need clarified.
All code can be found in this Github Repo: https://github.com/justintranjt/thrive-test
In development, I have been running the application like so:
In one terminal run thriveApp.py. In another terminal run npm run dev. Navigate to localhost:8080 which is the local server running
the Vue.js application.
Is this how the application will be run on Heroku? Or is the Vue application run using npm run build? In that case I would have to take the produced build folder and serve it in the Flask application, correct?
In addition, some of my links between the frontend and backend specify localhost:8080 and localhost:5000 (8080 is Vue and 5000 is Flask) which work locally. But will this work when deployed to Heroku?
<b-form>
<b-button variant="primary" href="http://localhost:5000/loginPage">Login via CAS</b-button>
</b-form>
As you can see here, I have a button in my Vue application that links to a login page routed by my Flask application. Will I have to change the portion of the URL that says localhost:5000 when running on Heroku?
Finally, When I currently try to build the application on Heroku only the Python portion of the code is recognized as modules from the Vue app specified by package.json are not installed while plugins for Python specified by requirements.txt ARE installed by Heroku.
I have a feeling all of these questions are generally related to each other. Any other advice or tips regarding Heroku deployment would also be helpful as I'm quite confused about deployment at the moment.
Is this how the application will be run on Heroku?
No! npm run dev spins up an entire development server with vue in dev mode and hot reloading. That's a lot of overhead, especially when it comes to file sizes.
Or is the Vue application run using npm run build?
Kind of. Vue doesn't need to run on your server at all, it's all client-side. npm run build bundles and minifies your files to a dist folder, you'll be left with only html, css and javascript - this is all of the frontend code that needs to be on your production environment - no need to deploy any of the source files. All you need to do is serve those static files from any server. This could be done by your flask, or just any apache, nginx etc.
But will this work when deployed to Heroku?
That will be very tricky to setup. It's one of the reasons why I would not deploy front- and backend on the same (virtual) server.
modules from the Vue app specified by package.json are not installed
If you deploy your bundled frontend instead of the source code this wont be an issue anymore. I still recommend serving the frontend from a different environment.

deploy angular/Nodejs Application in heroku

I have separte angular folder and a seperate Nodejs folder for the application.
I want to deploy it in heroku but apparently ondly a nodejs app can be deployed. Is there a solution to deploy my angular/nodejs app?
Otherwise does anyone have an idea on how to combine the angular project folder inside the nodejs project folder ?
You can serve your angular app as a static content on your node js app.
This depend how your node app is built, for example with express you can just put the files in the public directory.

Angular-universal - Production Issues

I have created Angular-universal app with reference to this Angular GitHub Repository. I have used node express for server-side rendering.
I have built using this command
npm run build:prod:ngc
now I got the client and the server folder in the dist folder. No other files there like index.html.
Previously I developed the angular2 app using CLI, on building that it create a dist folder with bundle.js, index.html, and CSS files. I used to upload that particular thing to shared hosting. The app was working fine. But in angular universal I am confused. I am stuck on how to proceed further for production. I have the shared hosting, Please help me how to host the project in shared hosting.
With universal you have to set up the server first and then start the server to listen at some port(80 normally :P)..
normally.. once you setup the node server on the hosting area, you can just go to your source code and start the server using cmd:-
sudo PORT = 80 npm run server (if ubuntu)
to listen at port 80 and then you can access the site then using IP/domain name.

Resources