10 GitHub Features - DrAlzahraniProjects/csusb_fall2024_cse6550_team4 GitHub Wiki
GitHub is a web-based platform that provides tools for version control and collaborative software development. It allows developers to host their projects, track changes, collaborate with others, and manage code efficiently.
GitHub is built around Git, a distributed version control system created by Linus Torvalds, the founder of Linux.
https://github.com/
1.1. Installation
1.2. Configuration
1.3. Implementation
1.4. Usage
1.5. Troubleshooting
2.1. Installation
2.2. Configuration
2.3. Implementation
2.4. Usage
2.5. Troubleshooting
3.1. Installation
3.2. Configuration
3.3. Implementation
3.4. Usage
3.5. Troubleshooting
4.1. Installation
4.2. Configuration
4.3. Implementation
4.4. Usage
4.5. Troubleshooting
5.1. Installation
5.2. Configuration
5.3. Implementation
5.4. Usage
5.5. Troubleshooting
6.1. Installation
6.2. Configuration
6.3. Implementation
6.4. Usage
6.5. Troubleshooting
7.1. Installation
7.2. Configuration
7.3. Implementation
7.4. Usage
7.5. Troubleshooting
8.1. Installation
8.2. Configuration
8.3. Implementation
8.4. Usage
8.5. Troubleshooting
9.1. Installation
9.2. Configuration
9.3. Implementation
9.4. Usage
9.5. Troubleshooting
10.1. Installation
10.2. Configuration
10.3. Implementation
10.4. Usage
10.5. Troubleshooting
Role: Cloud-based development environment
Details:
- GitHub Codespaces provide a fully-configured development environment directly in your browser, eliminating the need to set up your local environment
- It supports Visual Studio Code extensions and includes a terminal, allowing you to clone repositories, code, debug, and push changes
- Ideal for onboarding new team members quickly or for working from any device
Setting up Codespace:
- Click on the “Code” button (the green button near the top of your repository’s file view)
- In the dropdown menu, select the Codespaces tab
- You will see an option to "Create codespace on main" (or the default branch). If you want to create a Codespace for a specific branch, select the appropriate branch from the dropdown
- Click “Create codespace on [branch]” to start creating your Codespace
- GitHub will then spin up the cloud development environment. This may take a few seconds or minutes depending on your environment configuration
Once your Codespace is created, you will be taken to a browser-based VS Code editor. From here, you can:
- Write and edit code.
- Open terminal windows.
- Install dependencies.
- Run tests and applications.
- Use all features you normally get in a local VS Code environment.
- The Codespace environment will come with your repository cloned and ready to work on.
-
Codespaces simplifies development by offering immediate setup and ensuring consistent environments across team members. Key benefits include:
-
Instant Setup: Developers can start working without manual environment setup.
-
Consistent Configuration: Ensures uniformity across team environments, making onboarding smoother.
-
Running Applications
-
Once the application starts, Codespaces sets up specific ports to make testing and previewing seamless.
-
Accessing Codespaces
-
Codespaces can be accessed directly from the repository page on GitHub or through the VS Code desktop app with the Codespaces extension, allowing for flexibility between browser and desktop environments.
Role: Host project website
Follow these steps carefully to set up GitHub Pages
Go to Settings
Navigate to the Settings tab of your GitHub repository and scroll down to GitHub Pages. Access GitHub Pages Configuration
Click on the "check it out here" link to access the GitHub Pages settings. Select a Branch
In the dropdown menu (currently showing “None”), select your branch (e.g., master or main). Save and Retrieve URL
Click Save. A URL will appear at the top in the format https://.github.io/. This is the URL for your hosted webpage. Completion
Congratulations! You have successfully hosted your first web page for free on GitHub Pages
Details:
- GitHub Pages allows you to create websites for your projects directly from the repository
- You can use Markdown files or static site generators like Jekyll to build and deploy the site
- This is typically used for documentation, blogs, or even fully-featured project landing pages, and it’s hosted for free by GitHub
Steps:
- Create a new GitHub repository
- Clone it locally (optional) and add your website files (e.g., index.html)
- Commit and push your changes
- Enable GitHub Pages in the repository settings
- Access your site at https://username.github.io/repository-name/
GitHub Pages is useful for showcasing projects, documentation, or personal websites
Example: Host a documentation site for your project using GitHub Pages
Here is a screenshot of pages created
Page Not Displaying? Ensure the selected branch has a valid index.html file. URL Errors: Confirm the repository name matches the one in the URL. https://github.com/DrAlzahraniProjects/csusb_fall2024_cse6550_team3.wiki.git
Role: Project documentation (SRS, overall architecture design, low-fidelity prototype)
Details:
- The GitHub Wiki is a space within the repository for writing comprehensive documentation
- It's ideal for sharing information like Software Requirements Specifications (SRS), design documents, and architecture overviews
- Teams use it for capturing the project’s evolving documentation (e.g., technical decisions, guides, how-tos)
https://github.com/DrAlzahraniProjects/csusb_fall2024_cse6550_team4/wiki
- Set up the home page, organizing topics with text, links, and images
- Central Hub: Document Software Requirements Specifications (SRS), architecture, and prototypes
steps:
- Navigate to the Repository
- Open GitHub in your browser
- Go to the repository where you want to create or view a Wiki
-
In the Wiki tab, you will see an option to create your first page if you haven’t created any yet. Click on "Create the first page"
-
Enter a title for your Wiki page in the title field. The title will be the page's URL, so name it appropriately (e.g., "Getting-Started" for a tutorial page)
-
Write your content in the body section. The GitHub Wiki supports Markdown formatting, which allows you to use headers, lists, links, images, tables, code blocks, etc
- Missing Wiki Option? Check if the Wiki feature is enabled in repository settings
- Formatting Issues: Use Markdown syntax for correct formatting
Role: Real-time coding assistance
A GitHub account. One of the supported IDEs: Visual Studio Code, Neovim, or JetBrains IDEs. Basic familiarity with using plugins/extensions in your preferred IDE. Installing GitHub Copilot
Open Visual Studio Code. Open the Extensions View. Use the shortcut Ctrl+Shift+X. Search for “GitHub Copilot." Install GitHub Copilot Click "Install" to add GitHub Copilot to your IDE
Enabling GitHub Copilot in Your IDE Sign In
After installation, sign in to your GitHub account through the IDE when prompted Authorize Access
Authorize GitHub Copilot to access your GitHub account and repositories Enable Copilot
Follow the setup prompts within the IDE to enable GitHub Copilot
Adjust GitHub Copilot settings in your IDE as desire
Example: Use Copilot to auto-generate functions based on comments (e.g., typing // calculate sum)
Details:
- GitHub Copilot Chat is an AI-powered tool that integrates directly into your IDE (such as VS Code)
- It helps you in real-time by suggesting code snippets, providing explanations for existing code, and assisting with debugging
- Think of it as a collaborative coding partner that can answer specific coding questions, generate code based on descriptions, and streamline your workflow
Steps
- Sign up for GitHub Copilot on GitHub
- Install the GitHub Copilot extension in your IDE (e.g., Visual Studio Code)
- Authenticate your GitHub account in the IDE
- Start a new project or open an existing one
- Use GitHub Copilot by typing code and accepting suggestions
- Write comments for context-aware suggestions
- Explore GitHub Copilot Labs for additional features (if available)
- Configure settings as needed
No Suggestions? Check if Copilot is enabled and signed in Lagging? Disable other extensions to improve performance
Role: Code completion
A GitHub account. One of the supported IDEs: Visual Studio Code, Neovim, or JetBrains IDEs. Basic familiarity with using plugins/extensions in your preferred IDE. Installing GitHub Copilot
Open Visual Studio Code. Open the Extensions View. Use the shortcut Ctrl+Shift+X. Search for “GitHub Copilot." Install GitHub Copilot Click "Install" to add GitHub Copilot to your IDE
Enabling GitHub Copilot in Your IDE Sign In
After installation, sign in to your GitHub account through the IDE when prompted Authorize Access
Authorize GitHub Copilot to access your GitHub account and repositories Enable Copilot
Follow the setup prompts within the IDE to enable GitHub Copilot
- Adjust GitHub Copilot settings in your IDE as desired
Example: Use Copilot to auto-generate functions based on comments (e.g., typing // calculate sum)
Details:
- GitHub Copilot X is a more advanced version of GitHub Copilot, offering AI-powered code completions as you type
- It understands context from your comments and code, suggesting entire functions or blocks of code
- This feature helps improve productivity by reducing the amount of repetitive code you need to write and ensuring that the code is contextually accurate
Steps
- Sign up for GitHub Copilot X on GitHub
- Install the GitHub Copilot X extension in your IDE (e.g., Visual Studio Code)
- Authenticate your GitHub account in the IDE
- Open a project or file in your IDE
- Use the GitHub Copilot X chat interface to ask questions and get code suggestions
- Receive inline suggestions while coding
- Use contextual understanding by writing comments
- Explore advanced features like test generation and documentation
- Provide feedback for improvements
- Configure settings as needed
No Suggestions? Check if Copilot is enabled and signed in Lagging? Disable other extensions to improve performance
Role: Workflow automation
Before you can use GitHub Copilot X, ensure that you have
A GitHub Account Copilot Subscription: Ensure you have access to GitHub Copilot X. VS Code or Codespaces Setup: Copilot X is available within Visual Studio Code or GitHub Codespaces. Installing GitHub Copilot X in Visual Studio Code
Install VS Code.
Enable GitHub Copilot X Extension
In VS Code, open the Extensions panel (Ctrl + Shift + X). Search for GitHub Copilot and install it. The latest version should include Copilot X features if you have access. Sign In to GitHub
After installing the extension, click the GitHub icon in the bottom-left corner of VS Code. Log in to your GitHub account to authenticate Copilot X. Enable Copilot X
Once logged in, you may need to enable Copilot X from the GitHub Copilot settings or join the beta program if it’s still in limited release. Using GitHub Copilot X in Codespaces
Navigate to Your Repository
Open your repository in GitHub Create a Codespace
Click the Code button and choose Create codespace on main This will open your repository in GitHub Codespaces with VS Code-like functionality **Enable Copilot X
Log in to GitHub within the Codespace to start using Copilot X
Customize workflows, triggers, and permissions using .yml files in .github/workflows
Example: Automate code testing upon each pull request using Actions workflows
Details:
- GitHub Actions allow you to automate tasks like testing, building, and deploying your code
- You define custom workflows using YAML files that trigger based on events like pushing code, making pull requests, or releasing software
- Common use cases include CI/CD pipelines, automatic testing, deployment to cloud services, and running scheduled maintenance scripts
Steps:
-
Go to the repository and click the "Actions" tab.
-
Choose a workflow template or create a custom workflow file
-
Define the workflow in a YAML file (.github/workflows)
-
Commit the workflow file to activate the workflow
- Trigger and monitor the workflow automatically on events like push or pull requests
- Use prebuilt actions and secrets for automating tasks securely
Here the workflow in actions
Role: Task organization
Go to your repository on GitHub. Open projects
Click on Projects.
Create or link a project
Type your project name and click to link your project
View Linked Project
Click on your linked project to view its current status
Table View of Project Status
The project status will be displayed in a table view
- Table View of Project Status: Organize tasks in a board or table format for clarity
- Customize Columns: Set up columns (e.g., To Do, In Progress, Done) to visualize task status
Details:
- GitHub Projects offers Kanban-style boards for tracking tasks and managing project work
- It allows teams to create, organize, and prioritize tasks, making it easier to manage workflows
- You can link issues and pull requests to specific tasks to track progress, assign team members, and view overall project timelines
Steps:
- Go to the repository and click the "Projects" tab
- Click "New Project" and choose a template
- Name the project and create columns.
- Add issues, pull requests, or notes as cards to the project
- Track progress by moving cards across columns
- Use automation, collaborate, and filter tasks to manage the project effectively
Project Not Visible? Confirm the project is linked correctly to the repository. Task Not Updating? Refresh the board or check for updates in linked issues or pull requests. Learn More about projects: Projects
https://github.com/DrAlzahraniProjects/csusb_fall2024_cse6550_team3/projects
Role: Use for 5 tabs (General, Q&A, announcements, ideas, and polls)
Navigate to the discussions tab
Go to the Discussions tab in your repository. Start a new discussion
Click on New Discussion. Choose a category
Select a category and provide a clear title and description for your discussion. Submit the discussion
Click Submit to start the conversation
Set Up Categories: Define categories like General, Q&A, Ideas, and Announcements Manage Moderation Settings: Configure permissions for creating, responding to, and moderating discussions
Details:
- GitHub Discussions is a space for open-ended conversations within a repository
- It provides five tabs:
- General for ongoing conversations
- Q&A for questions and answers
- Announcements for project updates
- Ideas for brainstorming and suggesting new features
- Polls to gather feedback from the community
- It helps facilitate collaboration and communication within the team and the broader community of contributors
Steps
- Go to the Repository and click the "Discussions" tab
- Click "New Discussion" to start a conversation
- Choose a Category (e.g., Q&A, Ideas, General)
- Add a Title and Description for your discussion
- Submit the Discussion by clicking "Start Discussion"
- Engage by replying, reacting, and marking answers if needed
https://github.com/DrAlzahraniProjects/csusb_fall2024_cse6550_team4/discussions
Discussion Categories Not Available? Check repository settings for Discussions permissions. Missing Responses? Refresh the page or check notifications. 9 Issues Role: Assign tasks, track progress, and communicate
GitHub Issues provides powerful capabilities for assigning tasks, tracking progress, and facilitating communication within software development projects
Role: Assign tasks, track progress, and communicate
Click on New Issue Fill in Issue details
Enter a title and provide a detailed description of the issue Optionally, add labels, assign team members, or set a milestone Submit the Issue
Click Submit to create the issue
Labels: Use labels to categorize and prioritize issues Assignees: Assign issues to specific team members for ownership
Issues help track bugs, feature requests, and documentation updates Example: Use issues to list and manage tasks required for a new feature rollout
Details:
- GitHub Issues allow teams to track bugs, enhancements, and other tasks
- You can assign tasks to team members, set labels, milestones, and priorities
- Each issue has its own comment thread, which is ideal for discussing progress, providing updates, and closing out tasks when completed
Steps
- Go to the repository
- Click on the "Issues" tab
- Click "New Issue"
- Add a title and description, and fill out the issue template if there’s one
- Add labels, assign team members, or milestones
- Submit the issue
- Participate in discussions and track the issue’s progress
https://github.com/DrAlzahraniProjects/csusb_fall2024_cse6550_team4/issues
Issue Not Visible? Check repository permissions and visibility settings Notifications Not Received? Ensure notifications for assigned or watched issues are enabled https://github.com/DrAlzahraniProjects/csusb_fall2024_cse6550_team3/issues 10 Pull Requests Role: Review and merge changes
GitHub pull requests play a crucial role in reviewing and merging code changes
Role: Review and merge changes
Go to your repository on GitHub Open pull requests
Click on Pull Requests
Create a new pull request
Click on New to create a pull reques
Set Up Reviewers: Assign reviewers for pull requests to manage feedback. Customize Merge Options: Configure merge settings (merge commit, squash, rebase) to control merging behavior
Details:
-
Pull requests (PRs) are a critical part of the GitHub workflow for team-based development
-
It has 5 stages which includes:
- Create branch
- Create a pull request
- Discuss changes
- Merge changes
-
They allow developers to propose changes, request reviews, and discuss the code before merging it into the main branch
-
PRs support code reviews, inline comments, and approval processes, ensuring that only thoroughly-reviewed code gets merged
-
GitHub also provides CI/CD integration within pull requests to automatically run tests and checks on the proposed changes
https://github.com/DrAlzahraniProjects/csusb_fall2024_cse6550_team4/pulls
Thorough Code Review
Pull requests facilitate a thorough code review by allowing reviewers to examine proposed changes line by line. Collaboration and Feedback
Contributors can leave comments, suggest specific code modifications, and engage in discussions about the changes. Multiple reviewers can collaborate on the review process, including commenting, approval, and requests for modifications. Quality Control
Pull requests go beyond code merges—they foster collaboration and enforce code quality checks. Reviewers leave comments on specific lines, suggest changes, or ask questions as part of the review. Approval and Merging
Once the code is satisfactory, reviewers approve the pull request. After review, approval, and conflict resolution, the pull request is ready for merging. Select the merge option that best suits your project’s workflow.
Conflicts When Merging? Resolve conflicts in GitHub or locally before completing the merge Reviewer Notifications Missing? Ensure reviewers are assigned and have notifications enabled