responsive design built with react, react-router, vitejs and tailwind

Community feedback

• 

  Yehan Nilanga•670

  @Yehan20Posted over 1 year ago

  Hey congrats for making the solution , I Belive the issue is that since we refresh the use params hook gives you undefined so it will give 400 status error. Therefore you can basically get the exertions from the URL when you refresh the page and then call the API request, i assume you are using the useParams hook to get the country code when clicked , so you can do this

      let { id } = useParams(); //
      if (id === undefined) {
          id = (window.location.pathname).split('/')[2]
      } 
  //https://restcountries.com/v3.1/alpha/id/ - this will be the new url then it would fetch the data
  

  so now you have the country code, and then you can send it with your AJAX request to get the data , I hope this helped.

  Marked as helpful

  0
• 

  P

  Luciano Lima•1,290

  @LucianoDLimaPosted over 1 year ago

  Hi, great job on finishing this project, it looks really good!

  I see that you're hosting the website through github pages, I found this post on stack overflow that might help you: https://stackoverflow.com/questions/71984401/react-router-not-working-with-github-pages

  I encountered the same issue and managed to solve it but I was using vercel and not github pages, so my solution would not work for you, but hopefully this post I linked above will be helpful

  Marked as helpful

  0

  ---

  

  karim•220

  @karimAoulallayPosted over 1 year ago

  Thank you very much@LucianoDLima

  0