Deploy React Apps with React Router to Github Pages
Фильм және анимация
In this video, I am going to show how to deploy your React app with React Router to Github Pages
🔔 Don’t forget to subscribe 🔔
kzread.info...
Interested in supporting this channel? Please use this link bit.ly/2Lfuf46
🤗 Let’s connect 🤗:
👉 LinkedIn: / esterling-accime-324a4181
👉 Twitter: / accimeesterlin
👉 Facebook: / accimeesterlin1
👉 Instagram: / accimeesterlin
Related Videos:
✅ React State: • Understand React State...
✅ API Request with Fetch: • HTTP Request with Fetc...
✅ Controlled vs Uncrolled Inputs: • Controlled vs Uncontro...
✅ Different ways to get input values: • Different ways to get ...
✅ React Props Default children and custom props: • React props explained ...
✅ React LifecyCycle Hooks: • React LifeCycle Hooks ...
✅ React Ref and CreateRef: • React Refs and createRef
✅ 3 Different ways to style a React Component: • 3 different ways to st...
✅ React Axios - HTTP Request: • HTTP Request with Axio...
✅ Import images from public folder: • How to import images i...
✅ Import and Default Keywords: • How to import/export C...
✅ Different type of React Components: • Different type of Comp...
✅ Add new item into an array: • Manipulating array in ...
✅ React Virtual DOM: • React Virtual DOM expl...
✅ Extend Keywords in Reactjs: • Extends Keywords - Rea...
✅ React Fragment: • What is React Fragment...
✅ Multiple Elements in JSX: • Multiple Elements in J...
✅ React CreateElement No JSX: • React CreateElement - ...
✅ Get started with Reactjs - Create React App: • Get started with React...
Пікірлер: 132
Duuuuuude!!! That is gold! Thank so much!!! I have been struggling with this for days now... 3 years later and you're still saving lives with this
The best video I have seen to deploy the project
It worked ! At first glance I thought that your video was outdated because it's from 4 years ago, but your solution worked nice and clean, thank you so much!
This is the second video of yours I have watched. You are a very good teacher. Way to break things down.
What the hell, why isnt this more popular! Thanks man
Dude!!! Thank you soooo much. I have been struggling with this for days. This worked for me. Thank you.
@accimeesterlin
3 жыл бұрын
You're welcome. Glad it worked for you
Thank you so much!!! I am really new to developing and I could not figure out what I was doing wrong until I came across your video. Thank you again, you're amazing. You won over a new subscriber. :)
I can't thank you enough!! I have been struggling with this issue since past week. May god bless you brother.
Thank you! Super easy to follow. Everything else I looked at made it seem more complicated than it is.
@accimeesterlin
2 жыл бұрын
You're very welcome!
OOOOOMG, thanks brother, I already had days suffering with the application not rendering, gained another subscriber.
Amazing video man better explanation than most overated "Pro coders" you did an amazing job man I am proud off you I subscribed to your channel!!!😀
okay so i had so much trouble getting my portfolio site up and i started to think it had something to do with react router, but i couldnt find anyone else talking about it. Let me just say, for about 4 hours I was debating my career :). Thank you for this :D
Many thanks, man!! Exactly what I was looking for! :D
Thanks a lot. This really is a time saver. Have been struggling since past two days to deploy
@accimeesterlin
3 жыл бұрын
:)
Thank you very much. I was searching for routes!
Thanks a lot!! Was struggling for a while
Very helpful video that explains in such clear manner on how it is possible to resolve such tricky and not noticeable issue. Thank you so much!
bro how long have I been looking for this video
Works perfect, thank you !!!
Thank you so much, using the hash router fixed my issue in one go
pulling my hair out trying to figure this out. thank you sir.
Thanks a lot for this video. Easy to follow and works as expected! :)
@accimeesterlin
4 жыл бұрын
You're welcome. Glad it was helpful! :)
thank you so much you have no idea how much i appreciate that.
Yess!! You saved me so much time!! Thanks for this video!
@accimeesterlin
4 жыл бұрын
You’re welcome 😉. Glad it saves you so much time.
You are AMAZING!!! This helped me so much!
@accimeesterlin
3 жыл бұрын
Glad it helped!
Thank you man, i was strugling a looott cuz I didn't know that there are two differente types of deploying react app with router and without it
Thank you so much bro this realllllllly realllllly helps me!!!!!
Thanks man! Helped me a lot
just what i needed, thank you
Felt frustrated after not finding a solution for days. Thank you for this video :)
I have been trying this since yesterday. There is nowhere written use HashRouter instead of BrowserRouter while deploying react app using gh-pages. Thanks for sharing the knowledge.
you should have more views! This video was very helpful
Thanks for such a great tutorial!
Thank you! Super easy to follow
Perfectly explained!
This was extremely helpful. I appreciate your effort. Thank you
@accimeesterlin
2 жыл бұрын
You're very welcome!
This channel criminally underrated
@accimeesterlin
4 жыл бұрын
Thanks Wahab
You Just Saved Me , Thanks A lot
Great video, subbed!
@accimeesterlin
4 жыл бұрын
Thanks James
forever and eternally grateful. thank you.
AMAZING mate ! U saved my at least 5h :D
@accimeesterlin
3 жыл бұрын
Glad it worked for you as wel.
Thank you brother. Very helpful 🙂. I was struggling for a couple of hours.
@accimeesterlin
2 жыл бұрын
No problem. Glad that helps
Thankyouu soo muchh!!! This worked soo well!!!
You saved me man, thanks!!
Thanks Accime. I followed this approach, however I have a different problem. While clicking the navbar it is working fine to navigate to a different page as shown by you, but if it is a button the page can't show up the desired page. Any clue?
Thank you so much bro it's really work for me
Great Video!!! Thank you for your help!
@accimeesterlin
4 жыл бұрын
Thanks Israel
Thank you so much!
Thank you big time. I am so happy my react website runs ono github now
I thank You for sharing this valuable information was struggling a lot to find my problem's solution... You just made my day thanks brother
@accimeesterlin
2 жыл бұрын
:)
Such a simple fix, thanks so much
@accimeesterlin
3 жыл бұрын
Thanks
Mil gracias, me re salvaste la vida. Saludos desde colombia!
Thank you so much !!!!!!!!!
Thank you so much for this video
Nice, very helpful)
thumbs up for you!
I regret to refuse your video at first time. now i ve published my site on github. thanks very much
thanks that was very usefull
TNX A LOT!
Thank you!!!
It's 2022 and this still saved my arse
masterful my dear friend, greetings from Argentina!
@accimeesterlin
3 жыл бұрын
Greeting from Atlanta, Georgia
Thanks dude!
If I have authorization above the Router - does it change deployment or it should work?
Thank you so much
Great tutorial, thanks a lot!
Thank you soooooo much!!!!
Thanks!!
Thanks a lot brother
the question is why browser router does not work in deploy, and when should we use browser router?
thanq so mmuch sir ji this is really heplfull
You the man!
@accimeesterlin
4 жыл бұрын
Thanks
Thank You!
Nice video, i saw too many videos n configuration en packetjson, base name of the browserrouter, but ty ur explications r so good n be of utility for me
Thank you
Thanks buddy... you fix my error
@accimeesterlin
2 жыл бұрын
No problem 👍
Ty buddy
Thanks. God bless.
Thank u so much Sir
@accimeesterlin
2 жыл бұрын
So nice of you
thanks a lot
Setting the homepage in the package.json file still shows the following message The project was built assuming it is hosted at / You can control this with the homepage field in your package.json I am not sure why its not recognizing the entry i put in the json file and seems to default to /
thanks man
Thank you so much. Next.js is also possible?
Hi, I am using this.props.history.push({ pathname:`some path`, state:{ object :object} }) ; on handleSubmit click And reading the data into routed component like this.props.location.state.objectName.field This is working fine when I am using BrowserRouter even when i refresh the page i get the values on page BUT when I am using Hashrouter and I refresh the page I get error saying Can not read properties of undefined Please help
I am getting error at git init. It showing that , The term 'git' is not recognized
Thanks a lot for this video. I have one issue related with my react project that is quotes generator. my quotes generator is working with port 3000 but after deploy its not displaying in the site. pllllllllllllllllllllleeeeeeeeeeeeeeese help me
Goddddd i lov u
thx
Does this also get rid of any refresh 404 issues when you're not on the landing page?
@alejandromalanche6848
2 жыл бұрын
No it does not, I have this same issue
@Ceba551
2 жыл бұрын
@@alejandromalanche6848 yeah turns out you have to use hash router for this to work.
If you face any error than go to settings -> pages and then change deployed branch to gh-pages
@valentinav8585
2 жыл бұрын
2 years later but this did the trick! thanks
unfortunately, hashRouter doesn't allows googlebot to rank the page, just the home page will be indexed by google
@torrentinocom
4 жыл бұрын
I thought that google cant index react applications at all ....
Oh, thanks! I lost 1,5 hours for find how make it
@chaudharypraveen98
3 жыл бұрын
Same here
Чуть не обосрался вначале
Have tried it for millions times and it still doesn’t work. I give up
are you Haitian? I heard the accent plus I saw your name
@accimeesterlin
3 жыл бұрын
Yes I am
@rebelion1
3 жыл бұрын
@@accimeesterlin oh nice ok. where in Haiti are you from, and do you do full stack developer full-time or frerelancing?
@rebelion1
3 жыл бұрын
Im an American Haitian btw
I'm having a problem with this video. In your video, the code in your index.js file looks like this: import React from "react"; import ReactDOM from "react-dom"; import './index.css'; import App from "./App"; import { BrowserRouter as Router } from 'react-router-dom'; ReactDOM.render( , document.getElementById("root")); When I create a new React app, my code looks like this: import React from 'react'; import ReactDOM from 'react-dom'; import './index.css'; import App from './App'; import reportWebVitals from './reportWebVitals'; ReactDOM.render( , document.getElementById('root') ); Do you see the problem? There is nothing in my index.js file that refers to BrowserRouter or Router. Where am I supposed to put HashRouter? Maybe the problem is that this video is two years old.
U literally tricked us.. Simply say "use HashRouter instead of BrowserRouter "...Anyways nice video...
Thank you
Thank you
@accimeesterlin
4 жыл бұрын
You’re welcome Infor 😊😊