R
Railway

✋|help

PERN Application with React Router -- WebSocket connection to 'xxx' failed:

Ppawtang5/24/2023
I read a previous thread where it was suggested to use serve when running the client in production mode, but this solution does not work with React Router in my understanding. Could it be as simple as changing my client start script? This is my first time hosting an application. "scripts": { "start": "react-scripts start", "build": "react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject" },
PPercy5/24/2023
Project ID: 3bf7a56e-38fc-403a-92fa-0dcccfe80e97
Ppawtang5/24/2023
3bf7a56e-38fc-403a-92fa-0dcccfe80e97
BBrody5/24/2023
react router is client side right?
Ppawtang5/24/2023
Yessir server scripts: "scripts": { "test": "echo "Error: no test specified" && exit 1", "start": "nodemon index.js &", "run dev": "nodemon index.js" },
BBrody5/24/2023
does react router require the server to redirect all requests to index.html?
Ppawtang5/24/2023
I'm all ears What's bad here
BBrody5/24/2023
^
Ppawtang5/24/2023
I don't think so? index.html is in the client side and only contains some metadata and the root for injecting the react build
BBrody5/24/2023
is your react app a spa app?
Ppawtang5/24/2023
const App = () => {
return (
<>
<ToastManager />
{/* <ToastManager toastStack={toastStack} /> */}
<Routes>
<Route path="/" element={<Landing />} />
<Route path="about" element={<About />} />
<Route path="contact" element={<Contact />} />
<Route path="signup" element={<Signup />} />
<Route path="login" element={<Login />} />
<Route path="dashboard" element={<Dashboard />} />
<Route path="suppliers" element={<ManagerSuppliers />} />
<Route path="materials" element={<ManagerMaterials />} />
<Route path="transactions" element={<ManagerTransactions />} />
</Routes>
</>
);
};

ReactDOM.render(
<BrowserRouter>
<ToastProvider>
<UserProvider>
<App />
</UserProvider>
</ToastProvider>
</BrowserRouter>,
document.getElementById("root")
);
const App = () => {
return (
<>
<ToastManager />
{/* <ToastManager toastStack={toastStack} /> */}
<Routes>
<Route path="/" element={<Landing />} />
<Route path="about" element={<About />} />
<Route path="contact" element={<Contact />} />
<Route path="signup" element={<Signup />} />
<Route path="login" element={<Login />} />
<Route path="dashboard" element={<Dashboard />} />
<Route path="suppliers" element={<ManagerSuppliers />} />
<Route path="materials" element={<ManagerMaterials />} />
<Route path="transactions" element={<ManagerTransactions />} />
</Routes>
</>
);
};

ReactDOM.render(
<BrowserRouter>
<ToastProvider>
<UserProvider>
<App />
</UserProvider>
</ToastProvider>
</BrowserRouter>,
document.getElementById("root")
);
Bear with me I'm honestly quite stupid. I don't know if it counts as a SPA if it's technically rendering all of this content in the single html page "index.html" or if the inclusion of a router that builds URLs dynamically means its not a SPA
BBrody5/24/2023
is there only one .html file named index.html in the build folder?
Ppawtang5/24/2023
Yes
BBrody5/24/2023
then its a single page app
Ppawtang5/24/2023
Awesome 🙂 thanks again for the support.
BBrody5/24/2023
let me know if you need any clarification
Ppawtang5/24/2023
I'll give it a shot now Oh, serve should be installed in client folder yeah? or does it matter vs global
BBrody5/24/2023
it looks like you have modified your scripts quite a bit, please go back to the default start scripts before you start that guide should be installed as a project dependency and that is what npm i serve will do
Ppawtang5/24/2023
Nice, I'm online, no web socket errors, client and server are happy. thanks.
BBrody5/24/2023
sanity check, can you show me your current scripts?
Ppawtang5/24/2023
"scripts": { "test": "echo "Error: no test specified" && exit 1", "start": "node index.js", "run dev": "nodemon index.js" }, "scripts": { "dev": "react-scripts start", "start": "serve build -s -n -L -p $PORT", "build": "react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject" },
BBrody5/24/2023
why did you send two
Ppawtang5/24/2023
First was server. Irrelevant
BBrody5/24/2023
ahhh okay all looks good to me!

Looking for more? Join the community!

Want results from more Discord servers?
Add your server
Recommended Posts
Custom domain not availableHi everyone. I had 3 different projects in my account and had 2 different environments. But I deciddeployment crashed and didn’t restart?I had my settings on always restart, but it didn’t just now, just sat crashedGoDaddy / CloudFlareim having many issues with godday, my site is working but in rail dont the green check and i want toHow can i access Ghost shell?So i am making some changes on the configurations: which is basically changing it to my language - bIssue with Railway CLI auth (404)Hey ! When I run `railway login` or `railway whoami` I get this error (freshly installed, internet Memory ProblemI am running into a memory error when I try to use the app with my full array of JSON data. My JSON server errorPlease me app is failed and I can´t view the logs for know why.App not buildingI have an python app for a discord bot. This is my second one on railway actually the first one is flutter webhi i want to deploy flutter web on railway anyone how to do this ?Restart doesn't actually restartSeems like a service failed after it couldn't connect to a DB... i tried to restart but it never resDeployment fails on productionMy deployments builds started failing without any change. 6 hours ago my deployments started to faUse "pnpm install" for installation in this project.I´m getting this error , how can i solve it?my code is still running even tho the deploy is stoppedeManual deploymentIs it possible to select a GitHub branch and manually begin a deploy? Or do all deploys always have Error 401 while browsing the pages, while calling the backend worksHi there, I’m having an issue trying to get the angular frontend part to work. I’ve deployed it withCan you deploy Angular apps to railway?I'd like my backend and frontend deployed in one place if possible, so I'm just wondering if AngularWrong billing methodOn the page: https://railway.app/account/usage The Bill Breakdown billing is written backwards in thDeployment failing since Railway incident reportI pushed a very small update to my api project, at the same time as a reported Railway incident. SiBuild from Dockerfile doesn't startHey. Hey, I've been struggling with this for over 8 hours, so far I can't deploy my Laravel/Svelte/IRailway Developer Plan Question!Good morning, guys! How's it going? I have a question regarding Railway plans. For example, if I ch