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

  • @michelpomerantzeff1749
    @michelpomerantzeff1749 Жыл бұрын

    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

  • @harismehboob3557
    @harismehboob35572 жыл бұрын

    The best video I have seen to deploy the project

  • @pedroafonso2114
    @pedroafonso2114 Жыл бұрын

    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!

  • @nicklandreth2527
    @nicklandreth25273 жыл бұрын

    This is the second video of yours I have watched. You are a very good teacher. Way to break things down.

  • @elijahdr
    @elijahdr4 жыл бұрын

    What the hell, why isnt this more popular! Thanks man

  • @sirius8ly
    @sirius8ly5 жыл бұрын

    Dude!!! Thank you soooo much. I have been struggling with this for days. This worked for me. Thank you.

  • @accimeesterlin

    @accimeesterlin

    3 жыл бұрын

    You're welcome. Glad it worked for you

  • @user-gp9pq5zy2w
    @user-gp9pq5zy2w Жыл бұрын

    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. :)

  • @waqarmughal1573
    @waqarmughal1573 Жыл бұрын

    I can't thank you enough!! I have been struggling with this issue since past week. May god bless you brother.

  • @ericadeguzman6799
    @ericadeguzman67992 жыл бұрын

    Thank you! Super easy to follow. Everything else I looked at made it seem more complicated than it is.

  • @accimeesterlin

    @accimeesterlin

    2 жыл бұрын

    You're very welcome!

  • @zgregz2456
    @zgregz2456 Жыл бұрын

    OOOOOMG, thanks brother, I already had days suffering with the application not rendering, gained another subscriber.

  • @Abrahhhhh
    @Abrahhhhh Жыл бұрын

    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!!!😀

  • @christopherartrip3746
    @christopherartrip37463 жыл бұрын

    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

  • @rohangupta6847
    @rohangupta68473 жыл бұрын

    Many thanks, man!! Exactly what I was looking for! :D

  • @nagucool93
    @nagucool934 жыл бұрын

    Thanks a lot. This really is a time saver. Have been struggling since past two days to deploy

  • @accimeesterlin

    @accimeesterlin

    3 жыл бұрын

    :)

  • @ReginaScer
    @ReginaScer2 жыл бұрын

    Thank you very much. I was searching for routes!

  • @vastopolo
    @vastopolo4 жыл бұрын

    Thanks a lot!! Was struggling for a while

  • @konstantink1
    @konstantink13 жыл бұрын

    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!

  • @kamranloki3792
    @kamranloki37924 жыл бұрын

    bro how long have I been looking for this video

  • @nihadmehmedovic1911
    @nihadmehmedovic19112 жыл бұрын

    Works perfect, thank you !!!

  • @chaitanyabajpai9647
    @chaitanyabajpai96474 ай бұрын

    Thank you so much, using the hash router fixed my issue in one go

  • @abelgarrido2871
    @abelgarrido28713 жыл бұрын

    pulling my hair out trying to figure this out. thank you sir.

  • @erikshumkov4848
    @erikshumkov48484 жыл бұрын

    Thanks a lot for this video. Easy to follow and works as expected! :)

  • @accimeesterlin

    @accimeesterlin

    4 жыл бұрын

    You're welcome. Glad it was helpful! :)

  • @sebastianstephenson3176
    @sebastianstephenson31762 жыл бұрын

    thank you so much you have no idea how much i appreciate that.

  • @adiaguidry3848
    @adiaguidry38484 жыл бұрын

    Yess!! You saved me so much time!! Thanks for this video!

  • @accimeesterlin

    @accimeesterlin

    4 жыл бұрын

    You’re welcome 😉. Glad it saves you so much time.

  • @broke4583
    @broke45834 жыл бұрын

    You are AMAZING!!! This helped me so much!

  • @accimeesterlin

    @accimeesterlin

    3 жыл бұрын

    Glad it helped!

  • @egzonberisha9906
    @egzonberisha99063 жыл бұрын

    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

  • @musadanjuma6603
    @musadanjuma66034 жыл бұрын

    Thank you so much bro this realllllllly realllllly helps me!!!!!

  • @thiagomeneses6373
    @thiagomeneses63733 жыл бұрын

    Thanks man! Helped me a lot

  • @mateosierrabetancur9625
    @mateosierrabetancur96253 жыл бұрын

    just what i needed, thank you

  • @TrixyJ
    @TrixyJ3 жыл бұрын

    Felt frustrated after not finding a solution for days. Thank you for this video :)

  • @surajoberai
    @surajoberai3 жыл бұрын

    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.

  • @tecnosebastube9761
    @tecnosebastube97612 жыл бұрын

    you should have more views! This video was very helpful

  • @webdevshow
    @webdevshow5 жыл бұрын

    Thanks for such a great tutorial!

  • @nguyenquanghuy6689
    @nguyenquanghuy66892 жыл бұрын

    Thank you! Super easy to follow

  • @alizaidi5610
    @alizaidi56103 жыл бұрын

    Perfectly explained!

  • @subhrajitdey2148
    @subhrajitdey21482 жыл бұрын

    This was extremely helpful. I appreciate your effort. Thank you

  • @accimeesterlin

    @accimeesterlin

    2 жыл бұрын

    You're very welcome!

  • @wahabrehman6848
    @wahabrehman68484 жыл бұрын

    This channel criminally underrated

  • @accimeesterlin

    @accimeesterlin

    4 жыл бұрын

    Thanks Wahab

  • @medaminefh429
    @medaminefh4294 жыл бұрын

    You Just Saved Me , Thanks A lot

  • @jameswebb8397
    @jameswebb83974 жыл бұрын

    Great video, subbed!

  • @accimeesterlin

    @accimeesterlin

    4 жыл бұрын

    Thanks James

  • @casafurix
    @casafurix2 жыл бұрын

    forever and eternally grateful. thank you.

  • @sametkaraca5976
    @sametkaraca59763 жыл бұрын

    AMAZING mate ! U saved my at least 5h :D

  • @accimeesterlin

    @accimeesterlin

    3 жыл бұрын

    Glad it worked for you as wel.

  • @ericmuhire9995
    @ericmuhire99952 жыл бұрын

    Thank you brother. Very helpful 🙂. I was struggling for a couple of hours.

  • @accimeesterlin

    @accimeesterlin

    2 жыл бұрын

    No problem. Glad that helps

  • @rushaliasthana1240
    @rushaliasthana12404 жыл бұрын

    Thankyouu soo muchh!!! This worked soo well!!!

  • @mrtinn2948
    @mrtinn29483 жыл бұрын

    You saved me man, thanks!!

  • @soumalyasaha8111
    @soumalyasaha81114 жыл бұрын

    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?

  • @princekumarsingh2440
    @princekumarsingh24403 жыл бұрын

    Thank you so much bro it's really work for me

  • @israeltorres9538
    @israeltorres95384 жыл бұрын

    Great Video!!! Thank you for your help!

  • @accimeesterlin

    @accimeesterlin

    4 жыл бұрын

    Thanks Israel

  • @joelfolske5843
    @joelfolske5843 Жыл бұрын

    Thank you so much!

  • @closertothecosmos3519
    @closertothecosmos35192 жыл бұрын

    Thank you big time. I am so happy my react website runs ono github now

  • @rushabhdave6648
    @rushabhdave66482 жыл бұрын

    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

    @accimeesterlin

    2 жыл бұрын

    :)

  • @ksells
    @ksells3 жыл бұрын

    Such a simple fix, thanks so much

  • @accimeesterlin

    @accimeesterlin

    3 жыл бұрын

    Thanks

  • @DavidRamirez-cx9mt
    @DavidRamirez-cx9mt3 жыл бұрын

    Mil gracias, me re salvaste la vida. Saludos desde colombia!

  • @jumpman23nith
    @jumpman23nith2 жыл бұрын

    Thank you so much !!!!!!!!!

  • @marcovaleri7279
    @marcovaleri72794 жыл бұрын

    Thank you so much for this video

  • @SKiPER210397
    @SKiPER2103974 ай бұрын

    Nice, very helpful)

  • @aropar
    @aropar3 жыл бұрын

    thumbs up for you!

  • @mustafakosmaz178
    @mustafakosmaz1783 жыл бұрын

    I regret to refuse your video at first time. now i ve published my site on github. thanks very much

  • @ayhmhamame1333
    @ayhmhamame1333 Жыл бұрын

    thanks that was very usefull

  • @draganapetrovic8642
    @draganapetrovic8642 Жыл бұрын

    TNX A LOT!

  • @keilaurenmaxinedevries153
    @keilaurenmaxinedevries153 Жыл бұрын

    Thank you!!!

  • @giodelacruz9437
    @giodelacruz9437 Жыл бұрын

    It's 2022 and this still saved my arse

  • @RVKAWAAA
    @RVKAWAAA3 жыл бұрын

    masterful my dear friend, greetings from Argentina!

  • @accimeesterlin

    @accimeesterlin

    3 жыл бұрын

    Greeting from Atlanta, Georgia

  • @hendryprasetya9191
    @hendryprasetya91915 жыл бұрын

    Thanks dude!

  • @YetAYou
    @YetAYou4 жыл бұрын

    If I have authorization above the Router - does it change deployment or it should work?

  • @user-ll1uj2bc8q
    @user-ll1uj2bc8q10 ай бұрын

    Thank you so much

  • @piotrszczesniak
    @piotrszczesniak Жыл бұрын

    Great tutorial, thanks a lot!

  • @user-mp5bs3qk4w
    @user-mp5bs3qk4w5 жыл бұрын

    Thank you soooooo much!!!!

  • @csengerilevente9564
    @csengerilevente9564 Жыл бұрын

    Thanks!!

  • @SumitKumar-co2pm
    @SumitKumar-co2pm4 жыл бұрын

    Thanks a lot brother

  • @wesley18043
    @wesley180433 жыл бұрын

    the question is why browser router does not work in deploy, and when should we use browser router?

  • @kukkyou4647
    @kukkyou46473 жыл бұрын

    thanq so mmuch sir ji this is really heplfull

  • @camilovillegas8761
    @camilovillegas87614 жыл бұрын

    You the man!

  • @accimeesterlin

    @accimeesterlin

    4 жыл бұрын

    Thanks

  • @JptickBass
    @JptickBass3 жыл бұрын

    Thank You!

  • @SergieArizandieta
    @SergieArizandieta Жыл бұрын

    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

  • @hasst9261
    @hasst92613 жыл бұрын

    Thank you

  • @letsopeneye
    @letsopeneye2 жыл бұрын

    Thanks buddy... you fix my error

  • @accimeesterlin

    @accimeesterlin

    2 жыл бұрын

    No problem 👍

  • @Feitanxerx
    @FeitanxerxАй бұрын

    Ty buddy

  • @nwobodogeorge5370
    @nwobodogeorge53703 жыл бұрын

    Thanks. God bless.

  • @mayanksrivastav1828
    @mayanksrivastav18282 жыл бұрын

    Thank u so much Sir

  • @accimeesterlin

    @accimeesterlin

    2 жыл бұрын

    So nice of you

  • @omarmosaad2162
    @omarmosaad21623 жыл бұрын

    thanks a lot

  • @pickemparty
    @pickemparty2 жыл бұрын

    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 /

  • @soufianeodf9125
    @soufianeodf91254 жыл бұрын

    thanks man

  • @jinyoucheng8114
    @jinyoucheng81143 жыл бұрын

    Thank you so much. Next.js is also possible?

  • @shyamsoni5389
    @shyamsoni53893 жыл бұрын

    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

  • @paragshinde6989
    @paragshinde6989 Жыл бұрын

    I am getting error at git init. It showing that , The term 'git' is not recognized

  • @silkys8343
    @silkys83433 жыл бұрын

    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

  • @giulianacecchetto9307
    @giulianacecchetto93074 жыл бұрын

    Goddddd i lov u

  • @Qwade670
    @Qwade6704 жыл бұрын

    thx

  • @Ceba551
    @Ceba5513 жыл бұрын

    Does this also get rid of any refresh 404 issues when you're not on the landing page?

  • @alejandromalanche6848

    @alejandromalanche6848

    2 жыл бұрын

    No it does not, I have this same issue

  • @Ceba551

    @Ceba551

    2 жыл бұрын

    @@alejandromalanche6848 yeah turns out you have to use hash router for this to work.

  • @sakshamagarwal6852
    @sakshamagarwal68524 жыл бұрын

    If you face any error than go to settings -> pages and then change deployed branch to gh-pages

  • @valentinav8585

    @valentinav8585

    2 жыл бұрын

    2 years later but this did the trick! thanks

  • @marofe
    @marofe4 жыл бұрын

    unfortunately, hashRouter doesn't allows googlebot to rank the page, just the home page will be indexed by google

  • @torrentinocom

    @torrentinocom

    4 жыл бұрын

    I thought that google cant index react applications at all ....

  • @sevwolve757
    @sevwolve7573 жыл бұрын

    Oh, thanks! I lost 1,5 hours for find how make it

  • @chaudharypraveen98

    @chaudharypraveen98

    3 жыл бұрын

    Same here

  • @DubinArtur
    @DubinArtur2 жыл бұрын

    Чуть не обосрался вначале

  • @lene3667
    @lene3667 Жыл бұрын

    Have tried it for millions times and it still doesn’t work. I give up

  • @rebelion1
    @rebelion13 жыл бұрын

    are you Haitian? I heard the accent plus I saw your name

  • @accimeesterlin

    @accimeesterlin

    3 жыл бұрын

    Yes I am

  • @rebelion1

    @rebelion1

    3 жыл бұрын

    @@accimeesterlin oh nice ok. where in Haiti are you from, and do you do full stack developer full-time or frerelancing?

  • @rebelion1

    @rebelion1

    3 жыл бұрын

    Im an American Haitian btw

  • @songwright
    @songwright3 жыл бұрын

    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.

  • @sufyan2317
    @sufyan23174 жыл бұрын

    U literally tricked us.. Simply say "use HashRouter instead of BrowserRouter "...Anyways nice video...

  • @Jroumani
    @Jroumani3 жыл бұрын

    Thank you

  • @danielEpifanov
    @danielEpifanov4 жыл бұрын

    Thank you

  • @accimeesterlin

    @accimeesterlin

    4 жыл бұрын

    You’re welcome Infor 😊😊

Келесі