Not able to deploy my static react app

Question

Not able to deploy my static react app

Riz 10

Screenshot from 2024-04-20 18-08-52

Screenshot from 2024-04-20 18-08-39

Screenshot from 2024-04-20 18-11-09

These are my folder structure , and don't know where i am doing mistake .most probably it could be in the file

AmaranS 7,290 Reputation points Microsoft External Staff

2024-04-20T13:20:01.8633333+00:00
Hi ,

It seems like you're having trouble deploying your static React app, and you suspect the issue might be related to your folder structure or files. Let's break it down:

Folder Structure: Your folder structure seems to consist of frontend and backend directories, along with some configuration files like .gitignore, Dockerfile, etc.

React App: Your React app is likely within the frontend directory, containing files like index.html, package.json, etc.

Deployment Issue: It's unclear what specific problem you're facing with deployment. Are you using Docker for deployment, or some other method? Are you deploying to a hosting service like AWS, Heroku, or deploying locally?

To help you further, I need more information:

Deployment Method: How are you trying to deploy your React app? Are you using Docker, a hosting service, or something else? - Error Message: If there's an error message you're encountering during deployment, sharing that would be helpful. - Expected Outcome: What is the desired outcome of your deployment? Are you trying to deploy it to a server for public access, or are you deploying it for local development/testing?

With this information, I can provide more specific guidance on troubleshooting your deployment issue.
Riz 10 Reputation points

2024-04-20T13:55:38.6233333+00:00

Here I am not using docker , I am deploying static react app to azure , by following this module

https://learn.microsoft.com/en-gb/training/paths/azure-static-web-apps/?wt.mc_id=azurewebapps_startups_content_cnl_csamw .

And I am not able to deploy it . If you need more info i can provide you .

Thanks for your reply .
AmaranS 7,290 Reputation points Microsoft External Staff

2024-04-20T14:30:44.18+00:00
Hi @Riz,

we are sorry to hear you're facing this issue.

Here are the detailed steps to configure a static web app deployed React app to serve JavaScript content properly.

Ensure your React app is being built correctly and artifacts are generated in the /build folder that gets deployed. Test locally.

Add a mime-types.json file to the client folder to specify JavaScript mime-type

Validate the build artifacts contain your JS bundles with the .js extension and not something like .txt.

Check the App Service logs in Kudu for any errors processing the JavaScript files during deployment.

Enable diagnostics logging and trace failed requests to see how JavaScript files are handled.

Additionally reference thread link:

https://learn.microsoft.com/en-us/answers/questions/1462755/how-to-depoly-react-project-to-azure-web-app-or-we

https://learn.microsoft.com/en-us/answers/questions/271960/react-scripts-not-found-on-deployment-to-azure-sta

https://learn.microsoft.com/en-us/answers/questions/709680/react-app-deploying-in-azure-app-services

If the issue persists after trying these steps, please let us know.