Deploying React app via FTP to Azure WebApp - reactjs

Question

I followed this tutorial to deploy a react app to and Azure WebApp
https://medium.com/#to_pe/deploying-create-react-app-on-microsoft-azure-c0f6686a4321
After I uploaded the Build folder via FTP, when I access the url i get the following message:
"You do not have permission to view this directory or page."
I tried with and without the web.config file.
Log Presented by the App
I then tried adding this to the web.config file but then it just renders a white page with the correct Page Title.
<defaultDocument enabled="true">
<files>
<add value="build/index.html" />
</files>
</defaultDocument>
I assume because it can't access the referenced .js files in the index.html.

Answer 1

I went to deployment options. Configured my local Git Repository.
Configured my local Git. Then inside the build folder ran:
git init
git add .
git commit -m "initial build"
git remote add <azure your-git-clone-url>
git push azure master
And it now runs

Answer 2

I've also followed the tutorial that you've tried.
Sometimes it works and sometimes it doesn't work.
Problem
Even after I've restarted my server, the new static content was not reflected to endpoint. (eg. https://my-endpoint.azurewebsites.net)
Or routing is not updated properly with my web.config.
Environment
Webapp(Node 10.14 + Windows), FileZilla of MacOS
Source Code: React-boilerplate
Solution
Copy and paste all files in build directory into server's webroot directory except web.config
Then, copy and paste web.config
Comment
I don't know why Azure not works as my expectation.
I've made several Azure Web app for deployment. Whenever I've created new Azure web app, some instance is updated with web.config trigger and other instance is updated with index.html trigger. However, depending on my experience, web.config looks final trigger.
If you trouble with some 4xx, 5xx error which is not mentioned in tutorial page from your Web app , just delete web app and create another new one. I also tried to connect DevOps CI/CD pipeline in Azure to Web app. However, after success build and deployment process, my site is not updated and there was no files in directory of server(I checked via FileZilla)
After that, direct FTP deployment not working. The only solution for me was deleting it and creating new Web app.
I spent my 2-3 days due to this issue. If anybody have advice or right guide or right information about Azure's internal logic for my case, please comment it for saving my few weeks in future.
Web.config
Below is mine from the tutorial
<?xml version="1.0"?>
<configuration>
<system.webServer>
<rewrite>
<rules>
<rule name="React Routes" stopProcessing="true">
<match url=".*" />
<conditions logicalGrouping="MatchAll">
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
<add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
<add input="{REQUEST_URI}" pattern="^/(api)" negate="true" />
</conditions>
<action type="Rewrite" url="/" />
</rule>
</rules>
</rewrite>
</system.webServer>
</configuration>