we manually import every thing from the "react-router-dom", that is how it works in react, does not come by default, like your videos, helping me a lot, thankyou for doing these series.
I had an issue where clicking on any of the a href links in the layout caused the entire screen to go blank. To fix this, I changed the a href tags to Link components from react-router-dom, and it worked perfectly. Thanks for the tutorial!
Hi there. First of all I really appreciate your efforts for putting up this wonderful series on Electron and React. I am new to this tech but I am following your tutorials from start till here. Surprisingly for some weird reason, when I remove component tag from index.tsx and added Routes section just like you did and followed every step of your but I get a blank screen and nothing else. I do not know what is done wrong by me. If I run the react app independently (by running npm run inside app folder) it shows every thing fine in the browser but when I run the app inside electron environment, I only get blank screen not sure why. Can you please suggest any troubleshooting tips?
I have the same problem. I did everything on video. I don't know what moment I missed. It seems that I did everything on video, but something seems to be missing in my code. Blank white screen
Can I send you my code for help? When I do "npm run start" after being in "cd app" (the CRA and renderer I THINK), everything shows up as expected but on a browser. When I do "npm run start" when being in "cd electronapp" (the main process I THINK), nothing shows up in the actual electron app. It's just blank. I am wondering if this is because in main.js, we set "pathname: path.join(__dirname, './app/build/index.html')" and in the index.html, there is no actual content?
@@amitavroydev Hello, thank you for your support. I am wondering if you were able to take a look? You should've received an email from me a few weeks ago. Thank you.
Well, I will be honest here - I am not an expert with Electron JS. Still figuring out things. However, if we see - fundamentally we are developing two apps. One node app and the other is a React based app. Both have very different requirements and hence, I think it's fine. Like it's possible that there will be some packages which I would like to add only to the renderer process and some only for the backend process. The only thing which I want to improve on is - right now, I need to manually start the two apps. I know I can use concurrently to do that. Will explore it.
Hey just for future context for everyone else, I asked GPT 4 about this and it seems like 2 seperate package.json files is a fairly common practice. "The use of two package.json files in Electron applications is actually a common and accepted practice, especially in projects where the Electron (main process) and React (renderer process) parts of the application are developed somewhat independently. This approach is often referred to as the "two package.json structure." Here's why it's done and some considerations:"
@@45_rishabhtripathi65 Well the hot reloading has nothing to do with Electron. So, can you check if your project by default is able to do hot reload? By running the app on browser
@@ukaszukawczyk6282 thanks alot man. your tip saved me a lot of time. I was wondering what I am doing wrong here. but using HashRouter made things work. But when I clicked on the Links (Home and Work) as mentioned in the tutorial, I get blank screen and I get an error on the console "electron: Failed to load URL: file:///D:/ with error: ERR_FILE_NOT_FOUND" Please help
Hey im not sure why but when i press Work, my app goes blank white, it states that (node:13520) electron: Failed to load URL: file:///C:/work with error: ERR_FILE_NOT_FOUND
we manually import every thing from the "react-router-dom", that is how it works in react, does not come by default, like your videos, helping me a lot, thankyou for doing these series.
Thanks for the feedback
I had an issue where clicking on any of the a href links in the layout caused the entire screen to go blank. To fix this, I changed the a href tags to Link components from react-router-dom, and it worked perfectly. Thanks for the tutorial!
Thanks for sharing! 🙏
thank you
It did not work at begin but I use HashRouter instead of BrowserRouter and from react-dom component instead of
Yeah, it's an old video and people did face similar problem
Hi there. First of all I really appreciate your efforts for putting up this wonderful series on Electron and React. I am new to this tech but I am following your tutorials from start till here. Surprisingly for some weird reason, when I remove component tag from index.tsx and added Routes section just like you did and followed every step of your but I get a blank screen and nothing else. I do not know what is done wrong by me. If I run the react app independently (by running npm run inside app folder) it shows every thing fine in the browser but when I run the app inside electron environment, I only get blank screen not sure why. Can you please suggest any troubleshooting tips?
What error are you getting in console?
I have the same problem. I did everything on video. I don't know what moment I missed. It seems that I did everything on video, but something seems to be missing in my code. Blank white screen
What is the error in console?@@spacexnix
@@amitavroydev the catch is that there are no errors in the console
is your application running when you just run the react app?@@spacexnix
Can I send you my code for help?
When I do "npm run start" after being in "cd app" (the CRA and renderer I THINK), everything shows up as expected but on a browser.
When I do "npm run start" when being in "cd electronapp" (the main process I THINK), nothing shows up in the actual electron app. It's just blank.
I am wondering if this is because in main.js, we set "pathname: path.join(__dirname, './app/build/index.html')" and in the index.html, there is no actual content?
Do you have it on GitHub?
I sent you an email because the reply wasn't working@@amitavroydev
im having the same problem. Its working on the browse, but when I run it on electron, nothing is showing
It's been some time since I have worked on this project.
Need some time
@@amitavroydev Hello, thank you for your support. I am wondering if you were able to take a look? You should've received an email from me a few weeks ago. Thank you.
Hey I really liked it but don't you think having multiple package.json isn't ideal ?
Well, I will be honest here - I am not an expert with Electron JS. Still figuring out things. However, if we see - fundamentally we are developing two apps. One node app and the other is a React based app. Both have very different requirements and hence, I think it's fine.
Like it's possible that there will be some packages which I would like to add only to the renderer process and some only for the backend process.
The only thing which I want to improve on is - right now, I need to manually start the two apps. I know I can use concurrently to do that. Will explore it.
@@amitavroydev Do checkout my comment on your umm.. second episode maybe. :)
Hey just for future context for everyone else, I asked GPT 4 about this and it seems like 2 seperate package.json files is a fairly common practice.
"The use of two package.json files in Electron applications is actually a common and accepted practice, especially in projects where the Electron (main process) and React (renderer process) parts of the application are developed somewhat independently. This approach is often referred to as the "two package.json structure." Here's why it's done and some considerations:"
For me nothing inside BrowserRouter is not working. Any idea why?
Well it is a bit difficult to say without looking at the code. Can you share the code through github? Can definitely help
How did you reflect the changes without building the react?
Create react app hot reliadt
@@amitavroydev Can you please explain once again, my electron app isn't reflecting changes.
@@45_rishabhtripathi65 Only the hot reload is not working or no changes are getting reflected?
@@amitavroydev Only the hot reload isn't working. I have to build it again to display the changes.
@@45_rishabhtripathi65 Well the hot reloading has nothing to do with Electron. So, can you check if your project by default is able to do hot reload? By running the app on browser
this work for me BrowserRouter was not working
Yeah a few others also faced the same problem.
THanks
This routes will not work in Production
Why ?
@@amitavroydev cause in development it usages loadURL on the other side in production is usage loadFILE
@@nahidfaraji5069can I know how to fix this bug?
@@harizizzudin try to replace BrowserRouter into HashRouter
@@ukaszukawczyk6282 thanks alot man. your tip saved me a lot of time. I was wondering what I am doing wrong here. but using HashRouter made things work. But when I clicked on the Links (Home and Work) as mentioned in the tutorial, I get blank screen and I get an error on the console "electron: Failed to load URL: file:///D:/ with error: ERR_FILE_NOT_FOUND" Please help
can i share my code and get some help? my routes arent populating
Sure, you can ping me on Discord and we can check
I have similar issues
can anyone help me? I want make frameless window draggable in electron react js
Even i am not aware of it. Would recommend joining the discord community and ask there.
change
BrowserRouter ---> HashRouter
------>
Yes
Hey im not sure why but when i press Work, my app goes blank white, it states that
(node:13520) electron: Failed to load URL: file:///C:/work with error: ERR_FILE_NOT_FOUND
Check the router. That might be causing the problem
i checked the coment below they said to use Link from react router dom and it worked.