Why do some things need to go in a theme's directory instead of /public or normal one?

So, I have a GitHub Pages site. I use Hugo with it. I use the theme JuiceBar. I’ve noticed, for example, that if I try to display an image from a /static/images/ folder on my site’s root, then it won’t show up where I try to display it. However, if I put it in the /static/ folder of my theme’s directory, it’ll show up. Why is this? And at that point, why do I have a /images/ directory at root? The images in the theme’s /static/ directory are also getting put in /public, but it’s like, everytime I upload a new image to my site, I gotta put it in /public/images and my theme’s /static/ directories. Can’t I just have one spot for everything?

It’s also very annoying when I have to make the changes on the theme’s files, so when I push the changes to GitHub Pages, I have to push the changes to the fork of the theme first, then it allows me to push it to my mains site stuff.

Here you are not alone with HUGO. You have added a Theme.

Most themes also have some conceptional stuff that may make things different as in un-themed Hugo.

You will have to learn about the theme concepts and usage - Hopefully some are provided by the author.

and check out my reading suggestions here:

Anything you put in to the “static” directory (theme or project) will be copied over to “public” when you run the hugo command. If it does not, something is wrong with your setup.

You never put files manually into the “public” directory, Hugo handles that when it builds the site.

It is best practice to not edit theme files directly, instead override them by coping them to the same directory in your project and edit them there.

E.g. theme/sometheme/layouts/_default/single.html is overridden with layouts/_default/single.html

Hmmm. The whole thing with that is I never had a /layouts/ directory in my root to begin with, only in the theme’s folder of my current theme. So I manually made one at root and deleted the themes one. I guess I’ll still have to read up more on some of this stuff because even though I already have, a lot of it still isn’t making sense and I’m still stuck on why there needs to be duplicate files to begin with instead of one spot for, say, images, html files, etc.

You don’t need duplicate files, but it’s a best practice to have a complete and unmodified version of theme in the themes directory. Why?

  1. If you delete an overridden file (e.g., layouts/_default/baseof.html), Hugo will fall back to the original (e.g., themes/foo/layouts/_default/baseof.html).
  2. When a theme author makes a change, you can pull those changes into your themes directory without overwriting files that you have previously overridden.
  3. With most themes, it is quick to create a working site by placing the theme in the themes directory. That’s why the quick start guide uses this approach.

It sounds like you would benefit from any of the external learning resources listed here.

It’s labeled as “quick” but anytime I want to make changes, that’s just more folders to have to navigate through and then guess if I make the changes at my root or at the themes folder since there’s multiples of each file now, which has cost me lots of time.

I suspect there’s a conceptual disconnect here. Please see the link to external learning resources.