Share
Explore

Node.js Page Hosting - Uploading files to GitHub rather than doing GIT COMMIT from the local git repository.

megaphone
As per a recent change to GITHUB authentication, you will now see this error:

remote: Permission to ProfessorBrownBear/20240119A.git denied to computationalknowledge.

fatal: unable to access 'https://github.com/ProfessorBrownBear/20240119A/': The requested URL returned error: 403

Error 403 Forbidden error error occurs when trying to access a repository.
This error indicates a permissions issue. You need to login at the git command line with your git account credentials
To log in to your Git account via the command line, especially for GitHub, you need to set up authentication using either HTTPS or SSH. Since GitHub no longer supports password authentication for Git operations, you'll need to use a personal access token (PAT) for HTTPS or set up an SSH key. Here's how to do both:

Using HTTPS with a Personal Access Token (PAT)

Generate a Personal Access Token (PAT) on GitHub:
Go to your GitHub account settings.
Find the “Developer settings” section.
Select “Personal access tokens” and then “Generate new token”.
Give your token a descriptive name, select the scopes (permissions) you need, and create the token.
Important: Make sure to copy the token and keep it somewhere safe, as you won’t be able to see it again after leaving the page.
Using the PAT on the Command Line:
When you perform Git operations (like git clone, git fetch, git push, etc.), use your GitHub username, and when prompted for a password, enter the PAT instead of your GitHub password.

Using SSH

Generate an SSH Key Pair:
Open a terminal or command prompt.
Run ssh-keygen -t ed25519 -C "your_email@example.com", replacing your_email@example.com with your email.
Follow the prompts to create the key pair and save it to a file (typically in ~/.ssh/id_ed25519).
Add the SSH Key to the SSH-Agent:
Start the ssh-agent in the background: eval "$(ssh-agent -s)"
Add your SSH private key to the ssh-agent: ssh-add ~/.ssh/id_ed25519
Add the SSH Public Key to GitHub:
Copy your SSH public key to the clipboard. On Linux or macOS, you can use pbcopy < ~/.ssh/id_ed25519.pub or xclip -sel clip < ~/.ssh/id_ed25519.pub.
Go to GitHub, navigate to “Settings” → “SSH and GPG keys”.
Click “New SSH key”, paste your key, and save it.
Clone Repositories Using SSH:
When cloning repositories, use the SSH URL instead of the HTTPS URL.

Additional Tips

Remember: After setting up SSH or PAT, you don’t need to “log in” each time you use Git. Git will remember your authentication method.
Cache Credentials: If you're using HTTPS, you can cache your GitHub credentials for a period of time using Git’s credential helper: git config --global credential.helper cache.
Choose the method that suits your workflow best. For a more secure and convenient method, SSH is generally preferred, but PATs work well too, especially if you're working in environments where SSH is not ideal.
You can upload your web content directly to GitHub without using the command line, and this method bypasses the need for Git command line authentication. This approach is straightforward and useful if you're not comfortable with Git commands or if you're dealing with a small number of files. Here's how you can do it:


Since this set of procedures takes us far afield from our web development focus (and is more properly a Devops consideration), we will stay focused on our core goal of getting our web pages hosted on an public website.
(Note: You can use a number of hosting providers to do this easily, but this would require entering credit card information which we don’t want to do in class).

Steps to Upload Files to GitHub for GitHub Pages

Log in to GitHub: Go to and log in with your credentials.
Create a New Repository (if you haven't already):
Click on the "+" icon at the top right corner and select "New repository".
Name your repository. For a user site, the repository name should be <yourusername>.github.io.
Choose whether the repository should be public or private.
Initialize the repository with a README if you like (optional).
Click "Create repository".
Navigate to Your Repository:
Go to the main page of the repository.
Upload Files:
Click on the "Add file" button and select "Upload files".
Drag and drop your website files or use the file chooser to select and upload them. This includes your HTML, CSS, JavaScript, and any other assets you have for your website.
Once the files are selected, you'll see a list of them. Ensure you have all necessary files, including an index.html, which is the entry point for your website.
Commit the Changes:
After uploading, scroll down to the "Commit changes" section.
Add a commit message that briefly describes your update.
Choose to commit directly to the main branch.

Enable GitHub Pages:

Go to the repository's settings.
Find the "Pages" section in the menu.
Under "Source", select the branch you want to deploy (usually main or master).
Click "Save", and GitHub Pages will deploy your site.
Access Your Website:
Once GitHub Pages has deployed your site, you can access it at https://<yourusername>.github.io (for user sites) or at the provided GitHub Pages URL for project sites.

Considerations

File Size Limit: GitHub has a file size limit for uploads (usually 100 MB). If your website contains large files, you might need to use Git commands.
Updates and Maintenance: For future updates, you'll need to repeat the file upload process unless you decide to use Git.
Version Control: Directly uploading files doesn't provide the version control benefits of using Git. If your project grows in complexity, you might want to learn Git for better management.
This method is suitable for basic websites and for users getting started with GitHub Pages. However, as your project grows, using Git can offer more control and efficiency in managing your website's content.
Want to print your doc?
This is not the way.
Try clicking the ⋯ next to your doc name or using a keyboard shortcut (
CtrlP
) instead.