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
Related
What all options we have to deploy react web application to Azure?
Few options which I have already explored are: Azure web app, Container instance, Azure blob storage as static website.
What all other options we have to deploy the react web app to Azure? What option is better for react app (With regards to Availability, cost, maintenance)?
Also, To run react app, all we need is artifacts (like js, css, images etc.) which we can get by running simply build command so do we really need server to execute the code? can we not directly host it to some storage and then browsing it?
I have done one of the tutorial for aws amplify (the todo app). When it was done I had no more need for it so I deleted the application from the cloud.
Then one though hit me. If I have the source code locally (or hypothetically in git) for my amplify application, can't I somehow recreate the app in the cloud again from the source? if I understood it completely it is supposed to be infrastructure-as-code.
Currently, Amplify CLI doesn't support this.
Amplify is not an Infrastructure as Code.
From the AWS Documentation:
AWS Amplify is a set of tools and services that can be used together or on their own, to help front-end web and mobile developers build scalable full stack applications, powered by AWS. With Amplify, you can configure app backends and connect your app in minutes, deploy static web apps in a few clicks, and easily manage app content outside the AWS console.
Even if it's not supported, apparently there is some way to add services to the newly created Amplify from the existing Amplify backend.
https://github.com/aws-amplify/amplify-cli/issues/3505#issuecomment-597897873
I am running a React application on a Windows Server. I can access to it from browser using both the local machine and another pc on the same local network, but not from an external network.
I've tried both the development mode, ip:3000, and production mode with ip:5000.
Now I am wondering if it's a networking issue or I need to do something in my React code.
I didn't find anything in the documentation.
What do you do to make available an application to others?
Thanks.
You can setup firebase to you react app and deploy you application on firebase console.
Login in firebase using google account
Create project and app
Complete firebase setup to the project
Create Build and Deploy app on firebase.
Follow below link for steps :
https://medium.com/#aleemuddin13/how-to-host-static-website-on-firebase-hosting-for-free-9de8917bebf2
https://medium.com/swlh/how-to-deploy-a-react-app-with-firebase-hosting-98063c5bf425
Firebase project has free subdomains on the web.app and firebaseapp.com domains. You can access via these links.
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
We are developing a single page application using AngularJs having an index file at the root which will be served by web server to client. Backend for this application is a HTTP restful on a different server. Currently when developing this SPA application, we are using Node with express server. We need to deploy this application to azure. There are two deployment options available.
Deploy either as web application on azure (I think its IIS server in this case)
Or deploy on IIS using IIS Node module
We need to have a rewrite rule, which will serve index page for every other request to server in both cases.
Which one is better deployment model? Only IIS or iisnode module with IIS server or if anyone can suggest another option available for SPA on Azure?
The most straight forward would be to deploy it as an Azure App Service Web App (Previously Azure Website). It supports node and you can do your rewrite rules in web.config system.webServer section.
You can read the Azure App Service "Hello world" on Node here
Azure can run Express.js apps out-of-the-box, and has been able to for some time now. You don't need to worry about writing a web.config or anything.
Quick tutorial: Here
Basically, you need to copy the /bin/www file to /server.js, and edit the var app = require('../app'); to read var app = require('./app');
Then run it like any other Azure app.