This is happening because users aren’t being served the index.html which bootstraps your app when they visit those URLs directly.
For surge, you can add a 200.html file which contains the same contents as the index.html you’re deploying (or just rename it to 200.html) – this will then be served to users at any URL they visit which doesn’t correspond to a static file, allowing your app to start running.
Edit: looks like you’re using create-react-app. This works when you’re developing locally because create-react-app‘s react-scripts package handles serving your index.html as a fallback for these requests.
The react-scripts user guide has sections on how to handle this when deploying to GitHub Pages and surge.sh (as above).