Get Started with Github and Github Pages This is bascially a quick and dirty cheat sheet. Michael Baggett - Imageless-Innovations - Projects Manager About Me 2023-12-15 Web Frameworks; Git Git; GitHub Git is an open source distributed version control system designed to handle everything from small to very large projects with speed and efficiency. Git is widely used for collaborative software development and Github is the leading Git platform. GitHub GitHub is a platform and cloud-based service for software development and version control using Git. It provides the distributed version control of Git plus access control, bug tracking, software feature requests, task management, continuous integration, and wikis for every project. Github was acquired by Microsoft in 2018. It is used extensively by Microsoft, including Microsoft Azure. Information on Github: GitHub Features GitHub Documentation GitHub Skills Git Actions Github Pages Basic Terminology Repository: A repository, or repo, is a storage space where your project’s history and files are kept. Branch: A branch is an independent line of development, allowing you to work on features without affecting the main codebase. Commit: A commit is a snapshot of your changes, documenting the state of your project at a specific point in time. Merge: Merging combines changes from different branches into a single branch. Origin: Origin is the default name for the remote repository on GitHub. Push: Pushing sends your committed changes to a remote repository. Tag: A tag is a reference to a specific commit, often used to mark release points. Pull: Pulling fetches changes from a remote repository to a local one. Fetch: Fetching downloads changes from a remote repository but does not automatically merge them. Stash: Stashing allows you to save changes temporarily and switch to another branch. Archive: Archiving creates a zip or tar archive of a repository. Rebase: Rebasing combines a sequence of commits into a new base commit. Bisect: Bisect helps find the commit that introduced a bug. Cherry-pick: Cherry-picking allows you to apply specific commits from one branch to another. Fsck: Fsck is a utility to perform integrity checks on the Git file system. Gc (Garbage Collection): GC is used to clean unnecessary files and optimize the local repository. Remote: Remote refers to a version of the repository hosted on a server. Diff: Diff shows the differences between commits, branches, or files. Log: Log displays a chronological list of commits. Gitk: Gitk is a graphical Git repository viewer. Am (Apply Mailbox): Am applies a mailbox file as a series of patches. Apply: Apply applies changes from a patch, file, or a set of files. Checkout: Checkout switches between branches or restores files from commits. Revert: Revert undoes a commit by creating a new commit. Reset: Reset resets the current branch to a specified commit. Add: Add stages changes, preparing them for a commit. Mv (Move): Mv renames or moves a file or a set of files. Rm (Remove): Rm deletes files from the working directory and stages the deletion. Status: Status shows the status of changes as untracked, modified, or staged. Blame: Blame shows who last modified each line of a file. Show: Show displays information about commits, tags, or branches. Clone: Clone creates a copy of a remote repository on your local machine. Init: Init initializes a new Git repository. Keyboard Shortcuts Nearly every page on GitHub has a keyboard shortcut to perform actions faster. This was just announced by Github on 2023/11/16. Best Practices Commit Often: Make small, frequent commits to capture logical changes. Branch Strategy: Use feature branches for development and keep the main branch stable. Descriptive Commits: Write clear and concise commit messages. Pull Requests: Open pull requests for code review before merging. Code Reviews: Regularly review and comment on others’ code. Documentation: Keep documentation up-to-date with code changes. Git Cheat Sheet Clone a Repository: $ git clone <repository-url> Create a Branch: $ git branch <branch-name> Switch to a Branch: $ git checkout <branch-name> Commit Changes: $ git commit -m "Your commit message" Merge Branches: $ git merge <branch-name> Push Changes: $ git push origin <branch-name> Pull Changes: $ git pull origin <branch-name> Stash Changes: $ git stash View Commit History: $ git log Check Conflicts: $ git diff Resolve Conflicts: Manually edit conflicted files and then: $ git add <conflicted-file> $ git merge --continue Abort Merge: $ git merge --abort Role of the Repository Maintainer Handling Merges: Regularly merge the main branch into feature branches to stay updated. Resolve conflicts promptly during merges. Merging from Multiple Sources: Pull changes from multiple branches using “git pull origin branch-name.” Resolve conflicts if they arise during multiple merges. Resolving Conflicts: Manually resolve conflicts in files marked by Git. Use “git add” to stage the resolved files. Complete the merge with “git merge –continue.” Stashing: Use “git stash” to save changes without committing. Apply stashed changes later with “git stash apply.” Using GitHub Pages There are many things you can do with Github, but one of the most popular is website development using GitHub Pages. For more information on using GitHub Pages and its limitations, checkout this page in the documentation. When working with GitHub Pages you will need to use a static page generator. Github has adopted the open-source static page generator Jekyll as their default solution for Github Pages. Jekyll has been maintained by Github since 2013 and the solution is well documented on their site. However, you can use any solution you like - you are not restricted to Jekyll. There are a large number of premade themes anmd add-ons available for Jekyll - more than any other static page generator. You can find Jekyll themes at Jamstack but if you do a internet search - you will find many other sites available. Jamstack seesm to have the majority of themes that are available. This site uses the open source static page generator Hugo. The starting theme was mainroad. You can find more Hugo themes at the Hugo website and Jamstack. There are plenty of options available when it comes to static page generators. Look around for the option that best suits your needs. Jamstack provides a list with over 350 different static page generators. I recommend using a starter template theme regardless of the staic page generator you choose to go with. You will want to choose a theme that already includes version formatted for mobile devices. Understanding Open-Source Licensing Terms You will find many resources online that you may want to include in your website: images, fonts, themes, templates, plug-ins etc… Before you use them in your website it is important to check the licensing terms to confirm that your use is in compliance with the agreement. You must follow any stipulations included in the agreement. When it comes to open-source resources, many of the licensing terms you will encounter grant you permission to use the resource pretty freely. But there are exceptions. Before using anything you find online check: Is there a restriction on commerical use? Is attribution required? If so - what does that entail? Not all open-source resources are entirely free: sometimes there is a free and pro version. The pro version will likely require a fee. Just because you can download it does not mean you are licensed to use it without payment. Also, for your own projects - always specify a license agreement. Here is some information on some popular open-source license agreements: MIT Licenses Creative Commons Public Domain “Creative Commons Zero” GNU Licenses Available Resources Here are some resources that are available online that may be of use to you on your project: Fonts When it comes to free and open-source fonts used on websites - Google Fonts pretty much dominates. Google also offers icons (Material Symbols). You may want to look at the Noto fonts: it is intended to be a font that is available in all languages. Google Font Collection Google Icons (Material Symbols) Images If you are looking for images for your website, I would start with these: UXWing: A collection of free icons availabel for use on non-commercial and commercial projects without attribution. The collection contains well optimized free SVG and PNG icons that can be used on interface design, web and application development. SVGRepo: 500.000+ Open-licensed SVG Vector and Icons: Search, explore and edit the best-fitting free icons or vectors for your projects using a wide variety vector library. Download free SVG vectors and icons for commercial use. Check the license terms carefully - some require attribution. The majority of the UXwing images are monochromatic (black on a transparent white background). The easiest way I have found to change the colors of an SVG file is to use this free tool: DeEditor. Other Resources Font Awesome is a collection of fonts available in two versions: free and paid. It is pretty popular and fairly easy to use. Useful Links Pro Git A free manual to Git, recommended and hosted by the Git community. A printed version is available through Amazon but it is the same material that is available here for free. Git This is the website for the open source Git community. You can download the Git package for Windows, Mac, and Linux, review the documentation, and find a GUI if you prefer it to the CLI. GitHub GitHub is a platform implementation of Git: the git commands are the same regardless of the Git platform. GitHub Flavored Markdown Specs GitHub Flavored Markdown (GFM) is the dialect of Markdown that is currently supported for user content on GitHub.com and GitHub Enterprise. This formal specification, based on the CommonMark Spec, defines the syntax and semantics of this dialect. GitHub Pages To setup your free website on hosted in your GitHub repository, follow the instrcutions here. Git Tutorial for Beginners This is free video tutorial offered by Simplilearn. It covers Github and GitLab and provides a pretty solid introduction to using Git. Getting Started with Git and GitHub The free course from Coursera that covers everything you would need to get started using Git effectively (takes about 8 hours to complete). LinkedInLearning Some shorter (under 2 hours) getting-started options: Learning GitHub and Learning Git and GitHub. Github Docs: Setting Up a Github Pages Site with Jekyll The Jekyll website provides most of what you need to get started with Jekyll on GitHub. For more information, check here. Jekyll The official Jekyll Static Webpage Builder website. Hugo The official Hugo Static Webpage Builder website. This website is built using Hugo. BuhoCMS An open-source local-content management system for static website builders. This gives you a UI for editing and creating content on your website offline.