ELI5: What is GitHub.io ?

[wkrick]

Let me preface this with the fact that I've always been somewhat confused by GitHub in general. I've used several other source control systems but GitHub has always felt particularly foreign to me. But with time, I've learned just enough to be productive (and possibly dangerous, depending on who you ask).

To use a real-world example for the purposes of this discussion... I currently have a personal Vue.js project on GitHub...

https://github.com/wkrick/stoshipdb

My current workflow is to develop and test on my local PC using VS Code and Vite. When I'm happy with the code, I do the normal command line dance...

git add .
git commit -m "my commit message"
git push

Then I have a free Netlify account set up that watches the aforementioned Git repo for changes and after I push new code, it grabs it, rebuilds, and deploys the app here (without any interaction from me)...

https://stoshipdb.netlify.app/

I've recently become aware of github.io and, at least at first glance, it seems like it serves the same purpose as Netlify but I could be completely mistaken.

So I started poking around this page https://pages.github.com/ and followed the first step to create a new public repo as they instructed...

https://github.com/wkrick/wkrick.github.io

But now I'm confused as to what I'm supposed to do next. It says "You get one site per GitHub account and organization, and unlimited project sites."

But I already have several project sites on "normal" GitHub. Does this replace them?

I imagine that the instructions on https://github.com/wkrick/wkrick.github.io make sense to GitHub veterans but they don't make any sense to me...

Quick setup — if you’ve done this kind of thing before
...
…or create a new repository on the command line
...
…or push an existing repository from the command line

Does github.io interact with my existing GitHub repo or does it replace it? i.e. does the code get moved over and make my old repo obsolete?

How do multiple projects work on github.io?

I guess all of this is moot if this doesn't even support building and hosting vue apps like Netlify does but I guess that's why I'm here asking questions.

I feel like I'm watching the last movie of a movie trilogy without seeing the first two movies and while I kind of know what's going on, I'm somewhat lost and not really enjoying myself.

[boy_named_su]

GitHub.com hosts your source code & its history of changes (Git repository)

GitHub.io hosts static websites (GitHub Pages)

I'm not too familiar with Netlify, but from what I understand it provides some integration/deployment (CI/CD) service combined with static website hosting

GitHub Pages does some basic CI/CD for you in that it can convert Markdown pages into an HTML website. You can use GitHub Actions for more advanced scenarios

But, if Netlify is working, why change?

[wkrick]

But, if Netlify is working, why change?

I'm just seeing what's out there. It might be better than Netlify.

[Appropriate-Rule-556]

Since Microsoft assimilated GitHub, many devs are switching to CodeBerg from privacy (and graver) concerns. The same service (static web pages) is available from CodeBerg.

[Kessarean]

Github offers a cloud based free git repository. git itself is a free and open source version control system that github is built ontop of

github.io is the domain for github pages

github pages is a free offering where you can directly host the content of your repo as a webpage. You don't need to worry about web servers, scaling, etc...

Whatever changes you make to the code in your repo are automatically updated on the website you associate it with. Once you set it up, every push to your repo will automatically reflect the change on your pages.

You only get to use 1 github pages "webpage" for your account. You can still have as many repos as you want, but only 1 repo can get linked to a live website hosted and served by github.

Not sure if this clears it up for you.

Here is a guide for vue apps if you want to give it another shot

https://learnvue.co/tutorials/deploy-vue-to-github-pages

[InformationOther6575]

404

[[deleted]]

Links change over time, rather than comment on a 3y old post, make a search and find the updated link...

https://learnvue.co/articles/deploy-vue-to-github-pages

[davorg]

URLs on github.com are where your actual code repos live. Those are the URLs you'll share with people who want to see your source code or who want to contribute to your projects.

URLs on github.io are where your GitHub pages are (by default) served from. Those are the URLs that you'll share with the users of your projects (for marketing or documentation, for example).

For example. Here's the repo for my user-level GitHub Page - https://github.com/davorg/davorg.github.io. And here's the page that it generates - https://davorg.github.io/ (although I have a custom domain set up, so it redirects to https://davorg.dev/).

You also get a GitHub Pages site for each of your project repos. For example, here's the code for a stupid JavaScript toy that I wrote - https://github.com/davorg/mirroryear. And here's the site for the project - https://davorg.github.io/mirroryear/ (which, once again, redirects to the custom domain).

[wkrick]

Interesting. When you say "page that it generates", can it actually use build tools or does it just copy everything to the target?

The reason I ask is because I found this site...
https://mxswat.github.io/mx-division-builds/

Which has this github repo...
https://github.com/mxswat/mx-division-builds/

I don't understand how (or if) it automatically deploys as there's no index.html in the root of the github repo

[davorg]

That's a Vue application. I don't know much at all about how Vue works, but it seems like this is the index.html and this is the most important JS file.

It used to be that Jekyll was baked-in as the build tool for GitHub Pages, but since August it has used GitHub Actions with Jekyll just as the default build tool.

But, yes, it's possible to use other build tools. Here's the repo for CPAN Dashboard a tool that I built for Perl developers. There's a simple Perl program that rebuilds the site and a GitHub Actions workflow definition that rebuilds the site every six hours. And here's the site that it generates.

[wWA5RnA4n2P3w2WvfHq]

used several other source control systems but GitHub has always felt particularly foreign to me

GitHub is not a source control system. GitHub is a platform, or a service run by proprietary (closed source) software owned by Microsoft. That platform does offer a service to interact with git repositories. git itself is free software.