Link to a non-gatsby html page on same domain without Gatsby redirecting to 404 - nginx

Question

I have a Gatsby blog. I am writing a set of tutorial posts for coding games in create-react-app. In my Gatsby post markdown, I'm trying to link to the built version of the demo react app for that post hosted on the same server, but Gatsby keeps giving me a 404 page.
I am using nginx. All the contents of the public folder resulting from gatsby build sit in the var/www/html directory of my webserver.
The create-react-app build sits inside var/www/html/tutorials/01/, and has its own index.html file.
In my markdown I have tried both these formats of links: view the code [here](/tutorials/01/) and view the code [here](//165.227.94.249/tutorials/01/).
If you're viewing the post in your browser at //165.227.94.249/posts/tutorial-01 and click on the link, it'll take you to //165.227.94.249/tutorials/01/ but display a 404 page. But if you refresh the browser at the same URL, the working react app will be served.
How do I keep Gatsby from overriding this request and showing a 404 page instead of just letting the web server serve up the index.html file that exists at that url?

Answer 1

The internal links in your markup are automatically converted into Gatsby Link while you build. Gatsby Link is only for internal ressources from the Gatsby build. Your create-react-app app is on the same server but outside the Gatsby build process.
From the documentation:
This component is intended only for links to pages handled by Gatsby.
For links to pages on other domains or pages on the same domain not
handled by the current Gatsby site, use the normal element.
I think using the full URL inside the markup including https might be successful: https://165.227.94.249/tutorials/01/
PS: When I tried I got a connection timeout from your server.

Answer 2

You should try to disable gatsby-plugin-catch-links. In case this doesn't works try to catch the onClick event, cancel the event and trigger your own redirect.
function processExternalSameDomainLink(event) {
window.location.href = url
event.stopPropagation()
event.preventDefault()
return false
}
<a href={newTo} onClick={processExternalSameDomainLink}>