How to set up a subdirectory for GitHub Pages deployment?

Other Questions Github
1

I’m trying to change my website setup. Right now, my React frontend is hosted on GitHub Pages while my ASP.NET backend runs on an AWS EC2 instance with Nginx. I want to move my frontend from the main domain to a subdirectory.

I’ve made several changes:

  • Adjusted the base to ‘/abc/’ in vite.config
  • Updated package.json with the new homepage
  • Added an A record in DNS
  • Modified the Nginx configuration to proxy to GitHub Pages

However, when accessing my website, I encounter a 404 error. I’m not sure if I’m missing a step or if there’s a better way to implement this setup.

Here’s a simplified version of my updated Nginx configuration:

server {
  listen 80;
  server_name mysite.com;

  location /newpath/ {
    proxy_pass https://myrepo.github.io/project/;
    proxy_set_header Host $host;
  }
}

Any assistance would be appreciated.

2

I’ve dealt with similar issues before, and it can be frustrating. One thing that’s not immediately clear from your setup is whether you’ve updated your React router to account for the new base path. Make sure you’ve wrapped your routes with a component if you’re using React Router.

Another potential issue could be with your build process. Ensure that your assets are being referenced correctly with the new base path. You might need to update your build script to include the --base=/abc/ flag if you’re using create-react-app.

Lastly, don’t forget to clear your browser cache and try in an incognito window. Sometimes cached resources can cause unexpected behavior when making these kinds of changes. If none of these solve it, you might want to check your GitHub Actions workflow (if you’re using one) to ensure it’s deploying to the correct branch and directory.

3

hey ryan, sounds like a tricky setup! have u tried adding a trailing slash to ur proxy_pass? like this:

proxy_pass https://myrepo.github.io/project/;

Sometimes that can fix 404 issues. also, double-check ur github repo settings to make sure the pages are actually being served from the right branch/directory. Good luck!