how should I deploy of react-redux api website? - reactjs

I have React website code (with redux code also to integrate API in website) when I host it on Github-pages or Netlify or firebase, it shows front end only, API is not integrated on hosting (API works fine on localhost)
how to integrate redux API on hosting (for free or paid)?

Could you please share the code? As long as the API is served using a suitable backend server that is hosted appropriately, changing the BASE_URL should do the trick. I am assuming the code that you have deployed still used localhost:5000 or any localhost base url. Like you had in dev environment.

Related

Why is my React App not pulling API on Vercel or Nettlify?

So I made a mini web app that uses an API from jservice.io to make a trivia app. Everything works fine until I tried deploying it on Vercel or Netlify. The api is not being pulled for some reason on them. Its made in React so when I made a build locally and it still works.
My only guess is that 'jservice.io' is not a secure website.
Any Ideas?
My Site was down because the API I was using wasn't on a secure site.

How to use custom domain for Serverless app with React frontend?

I finished my Udacity Cloud Developer nanodegree and I want to make a custom domain to showcase on my portfolio.
The stack I use includes: Api Gateway, Lambda, DynamoDB, Nodejs, S3 and Serverless framework. Frontend is : React.
However, Im stuck on comprehending how to deploy the full app, with React frontend?
Something like: anc.com would navigate to my app. I found many solutions mentioning about using serverless-domain-manager.
But what about my React front end? I read some solutions saying to deploy static web using S3.
But my app currently has S3 to store the uploaded images.
If I deploy my frontend with S3, do I have to make 2 S3 buckets?
Currently, I have to use 2 terminals, SLS deploy for backend, and npm run start to run the front end at localhost.
My github code:
https://github.com/ploratran/DogLookBook
The team at Serverless has also released a tool called components, one of which looks like its perfect for what you want to do; it automatically handles everything on the cloud to get your React files hosted and a domain assigned too: https://github.com/serverless-components/website

How to deploy a Flask+React application to Azure Web Service

I have been working on this app on my localhost, which has Flask as the backend (localhost:5000) and React as the front end (localhost:3000), and they have been communicating well. Now I am supposed to put it up online so that other ppl can see it as well - I didn't have much experience in Azure, but how can I deploy these two components(React&Flask) into one URL on Azure web app service? (Before I had some experience in using FTP to upload the 'build' folder to a "site/wwwroot" folder to put up a simple React app without any backend)
Newest
After testing, the python project is deployed in the webapp, the react project is deployed in the virtual application, and the normal node project is also deployed in the virtual application.
Deploy the flask python project to the windows environment, the normal deployment method will fail, please be sure to follow this blog document (third-party document) to operate, it works for me.
Running Flask app with HttpPlatformHandler in Azure App Services
The effect is shown in the figure. You can see that the normal node project can be accessed normally, but the react project is not. I think there are some bugs. (Has raised a support ticket to confirm)
The deployment method of virtual application is recommended to adopt the publishing method shown in the figure below.
Privious
It is recommended to choose windows when creating azure web app, because windows supports virtual application.
We can deploy flask app normally and deploy react app in virtual app.
Under normal circumstances, the process.env.port of the two webapps is the same and will not interfere with each other because of the virtual path.
Reference post:
1. Vue Frontend and Express backend on same Azure web app Service
2. Azure Front Door Is Not Maintaining Custom Domain in Browser

On hosting my react app on heroku, api calls doesn't work

I'm trying to host my react app on Heroku. I have VM instance on google with a flask rest API, the rest API works well, the react app also works in my local but when I host it, the API calls doesn't work on the react app. I have my API calls like this: axios.get(http://10.0.0.1:8080/user) (the 10.0.0.1 is just illustrative).
Its not API issue, i've accessed it from other sources.
Any suggestions, please help!!

Microservices architecture tutorial for springboot and react in production

My project contains two apps. Backend – springboot and a frontend - React.
I am using the spring-boot app only as a rest API to fetch data from the database. The React app frontend will call the API. Up until now, we were using only one environment (Windows) so production build was one jar that actually contains both apps and a tomcat. That was quite simple so by adding a proxy in the package.json file to point to the backend and some maven(frontend-maven-plugin) plugin the building process is simple.
Now we need to change the system architecture so each app will be hosts on a different windows machine.
I was trying to use express to host the react app but I am struggling with the proxy setup for the backend (spring) app from the express server. All the tutorials that I found actually using the express server as the backend API but I need the express server only for hosting the production build.
Is there a good tutorial that shows how to set up this type of architecture in production env.
Thank you

Resources