I am currently working on an Angular website that communicates with a RESTful API running on node.js that I built only for this app. They are two separate projects that runs on different ports.
While developing, I make the Angular app communicating with the local API. In production, the path to the API will be the IP address of the server. This is not a lot of work but I then need to change the address every time I want to deploy to production.
So here is some questions (sorry if this is a duplicate, I couldn't find it) :
Is it possible to create a two-sided variable (in grunt, in angular) in order to use some address (localhost) for development and another address for production ?
Maybe I got it all wrong and I should merge the API with the app ? I would have one big web server running on the same port and I could use relative paths and get rid of hostnames. How can I do to merge the express routes for the API with the angular routes ?
Thank you !
Related
I need to update the web app of a client of mine. That webapp uses Nest as a backend (along with Prisma and SQLite) and React as a frontend. Everything seems to run off of a VPS running Ubuntu.
I have a couple of questions since i've never used a VPS before :
How do I check the configuration of the VPS so that I can update the front-end and/or the backend without crashing the whole system and losing all the DB data ?
Is it necessarily using nginx ?
Thank you in advance
Let's say I have a React app and want to connect locally to my local Tomcat server (for ultimately consuming REST endpoints from my React app). I have 2 questions;
Is there a standard local workspace setup recommended by React to point to our localhost running backend services?
Is there an easy/configurable setup, where I have both options e.g. switch from connecting to actual backend service TO say using mock
endpoint responses on my local i.e. by a simple config change ?
Note: I am trying to avoid hardcoding any absolute URLs on my client-side i.e. In my client side code, I would just have the endpoint defined as "mycontext/my/endpoint" and say if my React app is running on say http://localhost, then it should automatically construct the full endpoint as http://localhost/mycontext/my/endpoint
You can define environment variables, which could include the address of the API server you'd like to use. Then you would simply change that variable any time you wish to hit a different API server (be it localhost or remote).
If you are using Create React App to bootstrap your setup, you can also use the proxy setting in your package.json.
I completed an online React course and deployed my application to Heroku. During development, I used the 'json-server' module found at https://github.com/typicode/json-server. This served up a folder on my computer which contained a simple json file and a few images for my website while conforming with the REST API. What do I need to do to get the server to operate independently of my machine so that my application can fetch the data ? I have zero experience doing this.
if you mean you want to create a server for your site,
first of all, you need to get a server, which can run nodejs , then you need to deploy and run your JSON server via a nodejs(express) app.
then you can connect to your server via your website/app
in order to do these things, you can follow tutorials
there are lots of tutorials about it.
hope you got the idea.
For an angular app that completely relies on external API to retrieve and store data, is NodeJS necessary for deployment? What are the other possible methods of deployment? Currently, I use it for local development and plan on using it in combination with Nginx for production. However, NodeJS is not doing anything except launching index.html. So should I remove NodeJS altogether and simply use Nginx alone?
One solution is to host it using any web host, they all equally host HTML only sites, and this solution is pretty inexpensive. Hosts like Hostgator, web.com etc., will allow you to upload the site via FTP.
A second choice is to host it using a web server (Nginx), but this is probably the most costly. You can host your own server in any cloud service (Amazon would be EC2 for instance) and then host your files there. This is probably not a good option for you. The only reason to use this type of solution is if you need the server to host code, so if you were using node to talk to a database for instance.
A 'pro' option may be to put them in S3 on AWS, and host it that way, it is pretty inexpensive.
Here is a link explaining how to host on Amazon - http://docs.aws.amazon.com/AmazonS3/latest/dev/WebsiteHosting.html
http://docs.aws.amazon.com/AmazonS3/latest/dev/website-hosting-custom-domain-walkthrough.html
I've an angularjs project with an express 4 backend, both hosted in one cloud9-ide workspace. The node backend is running under process.env.IP (0.0.0.0) and process.env.PORT (8080). The Angular Project is living under a 'client' subfolder needs access to the backend within the workspace. The Angular App needs it's own port - right? How can I accomplish this task?
Thank you for helping me out, Günther
I'm not entirely sure what an 'angular project' means. From what I know from Angular it is more common to run Angular code on the client. This is probably why it is in a folder called 'client'.
If this is the case then express will serve the angular files to the client over the port specified. Angular will run in the browser and do all it's magic there.
If this is the case the answer to your question would be that you don't need another port and all should work as you've set it up.
Do note that Cloud9 only supports 1 port that is accessible from the outside. For most express + angular apps this is all you need.