├── .github ├── auto-assign.yml ├── holopin.yml └── workflows │ └── auto-assign.yml ├── COMMUNITY_GUIDELINES.md ├── CONTRIBUTORS.md ├── LICENSE ├── README.md ├── community-website ├── .eslintrc.json ├── .gitignore ├── README.md ├── components │ ├── DarkModeButton.tsx │ └── NavBar.tsx ├── confetti-js.d.ts ├── netlify.toml ├── next.config.js ├── package-lock.json ├── package.json ├── pages │ ├── _app.tsx │ ├── api │ │ └── hello.ts │ ├── community-guidelines.tsx │ ├── community-members.tsx │ ├── contributors.tsx │ ├── educational-resources.tsx │ ├── index.tsx │ └── learn-git-and-github.tsx ├── postcss.config.js ├── public │ ├── cvcs&dvcs.png │ ├── earth-asia-solid.svg │ ├── favicon.ico │ ├── git-3-tier-architecture.png │ ├── gitVSgithub.png │ └── vercel.svg ├── styles │ ├── Home.module.css │ ├── LearnGitAndGitHub.module.css │ └── globals.css ├── tailwind.config.js ├── tsconfig.json └── utils │ └── utils.ts └── images └── HackToberFest.PNG /.github/auto-assign.yml: -------------------------------------------------------------------------------- 1 | # Set to true to add reviewers to issues/PRs 2 | addReviewers: true 3 | 4 | # Set to 'author' to add issue's/PR's author as a assignee 5 | addAssignees: author 6 | 7 | # A list of reviewers to be added to issues/PRs (GitHub user name) 8 | reviewers: 9 | - melvincwng 10 | 11 | # A number of reviewers added to the issues/PRs 12 | # Set 0 to add all the reviewers (default: 0) 13 | numberOfReviewers: 0 14 | 15 | # A number of assignees to add to the issues/PRs 16 | # Set to 0 to add all of the assignees 17 | # If unset, it uses numberOfReviewers, hence also setting reviewers as assignees 18 | numberOfAssignees: 0 19 | 20 | # A list of keywords to be skipped the process if issue/PR's title include it 21 | skipKeywords: 22 | - wip 23 | -------------------------------------------------------------------------------- /.github/holopin.yml: -------------------------------------------------------------------------------- 1 | organization: yfosp 2 | defaultSticker: cluciwd4c06100fl8nkzx8dle 3 | stickers: 4 | - id: cluciwd4c06100fl8nkzx8dle 5 | alias: Your-First-Open-Source-Contribution-Badge 6 | # - id: 7 | # alias: 8 | # more stickers 9 | -------------------------------------------------------------------------------- /.github/workflows/auto-assign.yml: -------------------------------------------------------------------------------- 1 | name: Auto Assign 2 | on: 3 | issues: 4 | types: [opened] 5 | pull_request_target: 6 | types: [opened] 7 | push: 8 | jobs: 9 | run: 10 | runs-on: ubuntu-latest 11 | steps: 12 | - uses: wow-actions/auto-assign@v1 13 | with: 14 | GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} 15 | CONFIG_FILE: .github/auto-assign.yml 16 | -------------------------------------------------------------------------------- /COMMUNITY_GUIDELINES.md: -------------------------------------------------------------------------------- 1 | # Community Guidelines (Code of Conduct) 2 | 3 | Like any other open-source organization, this organization is made up of a diverse group of individuals from around the globe who work on every facet of its goals. This diversity is one of its strengths, but it can also lead to communication issues and unhappiness. To that end, we have a few ground rules that we ask people to adhere to. This code applies equally to founders, mentors and those seeking help and guidance. 4 | 5 | We take pride in being inclusive and treating everyone with respect, 6 | regardless of gender identity and expression, sexual orientation, disabilities, neurodiversity, physical appearance, body size, ethnicity, nationality, race, age, religion, or similar personal characteristics. 7 | We love the diverse opinions of our contributors and maintainers; therefore, we expect you to. 8 | 9 | The subsequent subsections go into further detail about our community's guidelines and standards. 10 | 11 | ## 1. Be more considerate, kind, constructive, and helpful 12 | 13 | We want to create a community where everyone feels welcome and receives support from people of different backgrounds and identities. 14 | 15 | Thus, we believe we can achieve this by building a positive, welcoming environment where everyone feels safe to share ideas, thoughts, and feedback. 16 | As you contribute, try to be supportive, respect individual opinions, and report inappropriate posts if needed. 17 | 18 | Respectful and constructive communication is encouraged and appreciated. We believe that everyone has the right to express their opinions and that constructive criticism is essential to the growth of the project. 19 | 20 | However, we also believe that everyone has the right to have their opinions heard, and that any form of harassment or personal attacks is completely unacceptable. 21 | 22 | ## 2. Expected behavior and choice of words matters 23 | 24 | We are a very diverse community. Thus, it would help if you acted professionally. 25 | Therefore, you are to work in a manner that includes but is not restricted to: 26 | 27 | 1. Don't use violent threats or language directed against another individual. 28 | 2. Consider collaboration before conflict. 29 | 3. No discriminatory jokes, insults, and language. This includes discriminatory behavior and speech, especially racist, homophobic, sexist, ageist, or demeaning words. 30 | 4. Do not post sexually explicit or violent material. 31 | 5. No unwelcome sexual attention. 32 | 6. Do not advocate for or encourage any of the above behavior. 33 | 7. In general, if someone asks you to stop, then stop. 34 | 8. Participate authentically and actively to contribute to this community's health and longevity. 35 | 36 | Be mindful of your fellow participants and please report any cases of harassment by alerting community leaders if you notice a dangerous situation, someone in distress, or violations of this Code of Conduct, even if they seem inconsequential. 37 | 38 | ## 3. Disagreements 39 | 40 | Disagreements are bound to happen, primarily because of the community's diversity. The strength of the project comes from its diversity. It is, however, important that we resolve disagreements constructively. Another individual having a different perspective or viewpoint on issues doesn't mean they're wrong. Don't forget that it is human to err, and blaming each other doesn't get us anywhere. Instead, focus on helping to resolve issues and learning from mistakes. 41 | 42 | ## 4. Zero tolerance for harassment & Unacceptable behavior 43 | 44 | Be respectful of everyone's ideas and perspectives on a problem. Don't directly attack a person. We will not tolerate any posts, comments, or messages to fellow contributors, admins, sponsors, or maintainers that are inappropriate, rude, or aggressive. This includes posts that spread misinformation and are disruptive to the communities. 45 | 46 | Suppose a community member engages in unacceptable behavior. In that case, the community maintainers may take any action they deem appropriate, including a temporary ban or permanent expulsion from the community without warning (and without refund in the case of a paid event). 47 | 48 | ## 5. Reporting guidelines 49 | 50 | If you are subject to or witness unacceptable behavior, or have any other concerns, please notify the organization owner @melvincwng as soon as possible via email at: melvin.ng@outlook.sg. 51 | 52 | Each complaint will be investigated. We shall use our discretion to decide when and how to respond to reported incidents, with options ranging from taking no action to banning someone permanently from the project and spaces sponsored by the project. 53 | 54 | However, before taking further action, we will inform the accused of the report and give them a chance to speak about it. But we will act without warning in potentially hazardous circumstances, such as persistent harassment or threats to anyone's safety. 55 | 56 | Written by [melvincwng](https://github.com/melvincwng) & [Bennykillua](https://github.com/Bennykillua) 57 | -------------------------------------------------------------------------------- /CONTRIBUTORS.md: -------------------------------------------------------------------------------- 1 |

Contributors to our Community Website for Hacktoberfest 🌐

2 | 3 | 4 | 8 | 9 | 10 | 11 | 12 | 23 | 34 | 45 | 56 | 67 | 78 | 79 | 80 | 91 | 102 | 113 | 124 | 135 | 146 | 147 | 148 | 149 |
13 | 14 | melvincwng 19 |
20 | melvincwng 21 | 22 | 		24 | 25 | pink-bean 30 |
31 | pink-bean 32 | 33 | 		35 | 36 | theadityaagnihotri 41 |
42 | theadityaagnihotri 43 | 44 | 		46 | 47 | gabrielwarner 52 |
53 | GabrielWarner 54 | 55 | 		57 | 58 | Bennykillua 63 |
64 | Bennykillua 65 | 66 | 		68 | 69 | Mesfrum 74 |
75 | Mesfrum 76 | 77 |
81 | 82 | SuryodayYadav 87 |
88 | SuryodayYadav 89 | 90 | 		92 | 93 | sushantjha78 98 |
99 | sushantjha78 100 | 101 | 		103 | 104 | dollarboysushil 109 |
110 | dollarboysushil 111 | 112 | 		114 | 115 | avyuktsoni0731 120 |
121 | avyuktsoni0731 122 | 123 | 		125 | 126 | aachal28 131 |
132 | aachal28 133 | 134 | 		136 | 137 | divy-03 142 |
143 | divy-03 144 | 145 |
150 | 151 | 152 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2023 Your First Open Source Project 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # 'Your First Open Source Project' Community Website 2 | 3 | A community-driven initiative built & maintained by the community for the community during Hacktoberfest 🔥 4 | 5 | ![HackToberFest image](./images/HackToberFest.PNG) 6 | 7 | 8 | 9 | 12 | 13 |
10 | This repository is an initiative that aims to help beginners kickstart their open-source journey and successfully submit their first pull request (PR) for Hacktoberfest. It is also a safe space for everyone regardless of their skill level and we welcome participants from all around the world with different experiences, unique perspectives, and great ideas. 11 |
14 | 15 | Need info? 16 | 17 | Check the [website](https://yfosp.netlify.app/) 18 | | or [Create an issue](https://github.com/yfosp/main-website/issues/new) 19 | | or [Feature request?](https://github.com/yfosp/main-website/issues/new) 20 | | Support us on [GitHub sponsors](https://github.com/sponsors/melvincwng) 21 | 22 | ## Getting Started 🥳 23 | 24 | We believe we can build a welcoming and inclusive community if we all: 25 | - Use welcoming and inclusive language 26 | - Attempt collaboration before conflict 27 | - Are respectful of everyone's opinions, perspectives, viewpoints and experiences 28 | - Can give and accept constructive feedback 29 | - Accept responsibility and apologize to those affected by our actions and mistakes 30 | - Focus on what is best for the community 31 | 32 | ## Contributors 🎉 33 | This project exists thanks to all the people who contribute! ❤️ 💙 34 | 35 | Shoutout to our [contributors](https://yfosp.netlify.app/contributors) 🎉 36 | 37 | ## How to contribute? ⭐ 38 | 39 | Before making any contributions, please take a look at our [Community Guidelines](https://yfosp.netlify.app/community-guidelines) and take a look at the [existing Issues](https://github.com/yfosp/main-website/issues) or create a [new issue](https://github.com/yfosp/main-website/issues/new)! 40 | 41 | Wanna make a contribution but don't know how? Please follow the steps below. 42 | 43 | 1. Install [Visual Studio Code](https://code.visualstudio.com/) and create a Git (not GitHub) account 44 | 45 | * Open the terminal in Visual Studio Code 46 | * Type `git --version` in a directory of your choice - you should see the version of Git that you downloaded. If you see an error, close and reopen VS Code and try again 47 | * Set your user name with 48 | `git config --global user.name " "` - replace the `` with the real values 49 | * Set your email address with 50 | `git config --global user.email ""`- replace the `` with the real values (your email address should match the one with which you signed up for your GitHub account) 51 | 52 | 2. Fork this repository. This will create a copy of this repo in your GitHub account: 53 | * Open [yfosp/main-website](https://github.com/yfosp/main-website) (this repository) 54 | * Select **Fork** and * Make a [Fork](https://github.com/yfosp/main-website/fork) --> The URL of your fork is now `https://github.com//main-website` 55 | 56 | 3. Clone the repository 57 | 58 | 4. Make changes 59 | 60 | 5. Commit and push your changes to your fork 61 | * type `git add .` (yes, there is a space (` `) between `add` and the `.`) - this adds all changes to staging area 62 | * type `git commit -m "YOUR COMMIT MESSAGE"` - this will commit your changes with the messages 63 | * type `git push` to push the changes to your remote fork 64 | 65 | 6. Make a Pull Request 66 | 67 | ## What kind of contributions can I make? 💖 68 | 69 | - Fixing grammar mistakes or typos 70 | - Editing or suggesting changes 71 | - Contributing to the content and resources of the repo 72 | - Fix bugs/minor issues 73 | - Automate the process of this repo with GitHub actions 74 | 75 | ## Status 🌐 76 | - The community website is **fully developed** and built using **Next.js & TypeScript** 77 | - Enhancements or bug fixes to this community codebase are still accepted 78 | - Don't forget to **follow me [@melvincwng](https://github.com/melvincwng)**, **star this repo**, and **[join/follow our organization](https://github.com/yfosp)** 79 | 80 |

81 | Stay awesome & Happy Hacktoberfest 82 | 🎃🎃🎃 83 | ! 84 |

85 | -------------------------------------------------------------------------------- /community-website/.eslintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "next/core-web-vitals" 3 | } 4 | -------------------------------------------------------------------------------- /community-website/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # next.js 12 | /.next/ 13 | /out/ 14 | 15 | # production 16 | /build 17 | 18 | # misc 19 | .DS_Store 20 | *.pem 21 | 22 | # debug 23 | npm-debug.log* 24 | yarn-debug.log* 25 | yarn-error.log* 26 | .pnpm-debug.log* 27 | 28 | # local env files 29 | .env*.local 30 | 31 | # vercel 32 | .vercel 33 | 34 | # typescript 35 | *.tsbuildinfo 36 | next-env.d.ts 37 | -------------------------------------------------------------------------------- /community-website/README.md: -------------------------------------------------------------------------------- 1 | This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). 2 | 3 | ## Getting Started 4 | 5 | First, run the development server: 6 | 7 | ```bash 8 | npm run dev 9 | # or 10 | yarn dev 11 | ``` 12 | 13 | Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. 14 | 15 | You can start editing the page by modifying `pages/index.tsx`. The page auto-updates as you edit the file. 16 | 17 | [API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.ts`. 18 | 19 | The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages. 20 | 21 | ## Learn More 22 | 23 | To learn more about Next.js, take a look at the following resources: 24 | 25 | - [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. 26 | - [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. 27 | 28 | You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome! 29 | 30 | ## Deploy on Vercel 31 | 32 | The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. 33 | 34 | Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details. 35 | -------------------------------------------------------------------------------- /community-website/components/DarkModeButton.tsx: -------------------------------------------------------------------------------- 1 | // Dark mode is made possible using a) react-toggle-dark-mode & b) tailwind-CSS 2 | // Reference: https://github.com/JoseRFelix/react-toggle-dark-mode && https://tailwindcss.com/docs/dark-mode 3 | 4 | import React, { useState, useEffect } from "react"; 5 | import { DarkModeSwitch } from "react-toggle-dark-mode"; 6 | 7 | export default function DarkModeButton() { 8 | const [darkMode, setDarkMode] = useState(() => { 9 | if (typeof window !== "undefined") { 10 | return ( 11 | localStorage.theme === "dark" || 12 | (!("theme" in localStorage) && 13 | window.matchMedia("(prefers-color-scheme: dark)").matches) 14 | ); 15 | } 16 | return false; 17 | }); 18 | 19 | useEffect(() => { 20 | if (darkMode) { 21 | document.documentElement.classList.add("dark"); 22 | localStorage.setItem("theme", "dark"); 23 | } else { 24 | document.documentElement.classList.remove("dark"); 25 | localStorage.setItem("theme", "light"); 26 | } 27 | }, [darkMode]); 28 | 29 | const toggleDarkMode = (checked: boolean) => { 30 | setDarkMode(checked); 31 | }; 32 | 33 | return ( 34 | 40 | ); 41 | } 42 | -------------------------------------------------------------------------------- /community-website/components/NavBar.tsx: -------------------------------------------------------------------------------- 1 | import React, { useState, useEffect } from "react"; 2 | import { Disclosure } from '@headlessui/react'; 3 | import DarkModeButton from "./DarkModeButton"; 4 | 5 | export default function NavBar() { 6 | return ( 7 | 8 | {({ open }) => ( 9 | <> 10 |
11 |
12 |
13 |
14 |
15 | 21 |
22 |
23 |
24 | 25 | )} 26 | 27 | ) 28 | } 29 | -------------------------------------------------------------------------------- /community-website/confetti-js.d.ts: -------------------------------------------------------------------------------- 1 | // Fix for 'Could not find a declaration file for confetti-js module' - https://bobbyhadz.com/blog/typescript-could-not-find-a-declaration-file-for-module 2 | declare module 'confetti-js'; -------------------------------------------------------------------------------- /community-website/netlify.toml: -------------------------------------------------------------------------------- 1 | # The easiest way to deploy Next.js apps is to use Vercel 2 | # However, Vercel does not allow code repositories belonging to a GitHub Organization to be deployed in their 'Free' account (need to pay) 3 | # Hence, alternative choice is to use Netlify 4 | # Tried multiple configurations in the 'Build & Deploy' settings but to no avail in deploying the Next.js apps on Netlify 5 | # Eventually, discovered a solution which is to add a netlify.toml config file which essentially handles the build process for us (See below references) 6 | # And also make sure your 'Build & Deploy' settings are still correct (refer to Netlify's settings for more details) 7 | # Reference 1: https://bilalsevinc.medium.com/how-to-deploy-next-js-site-to-netlify-without-page-not-found-error-7b46e73a66a3 (Do not use the [[redirects]], as it will cause CSS issues) 8 | # Reference 2: https://www.npmjs.com/package/@netlify/plugin-nextjs (need to npm install this plugin) 9 | # Reference 3: https://answers.netlify.com/t/nextjs-netlify-deploy-not-rendering-css/64278/4 (If you use [[redirects]] from reference 1, your Next.js app will have no CSS) 10 | 11 | [build] 12 | command = "npm run build" 13 | publish = ".next" 14 | 15 | [[plugins]] 16 | package = "@netlify/plugin-nextjs" -------------------------------------------------------------------------------- /community-website/next.config.js: -------------------------------------------------------------------------------- 1 | /** @type {import('next').NextConfig} */ 2 | const nextConfig = { 3 | reactStrictMode: true, 4 | swcMinify: true, 5 | images: { 6 | domains: ["images.unsplash.com", "tailwindui.com", 'avatars.githubusercontent.com', 'localhost:3000'], 7 | }, 8 | } 9 | 10 | module.exports = nextConfig 11 | -------------------------------------------------------------------------------- /community-website/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "community-website", 3 | "version": "0.1.0", 4 | "private": true, 5 | "scripts": { 6 | "dev": "next dev", 7 | "build": "next build", 8 | "start": "next start", 9 | "lint": "next lint" 10 | }, 11 | "dependencies": { 12 | "@headlessui/react": "^1.7.3", 13 | "@heroicons/react": "^2.0.12", 14 | "confetti-js": "^0.0.18", 15 | "next": "12.3.1", 16 | "react": "18.2.0", 17 | "react-dom": "18.2.0", 18 | "react-toggle-dark-mode": "^1.1.0", 19 | "typed.js": "^2.0.12" 20 | }, 21 | "devDependencies": { 22 | "@types/node": "18.8.2", 23 | "@types/react": "^18.0.28", 24 | "@types/react-dom": "^18.0.11", 25 | "autoprefixer": "^10.4.12", 26 | "eslint": "^8.24.0", 27 | "eslint-config-next": "12.3.1", 28 | "postcss": "^8.4.17", 29 | "tailwindcss": "^3.1.8", 30 | "typescript": "4.8.4" 31 | } 32 | } 33 | -------------------------------------------------------------------------------- /community-website/pages/_app.tsx: -------------------------------------------------------------------------------- 1 | import '../styles/globals.css' 2 | import type { AppProps } from 'next/app' 3 | 4 | function MyApp({ Component, pageProps }: AppProps) { 5 | return 6 | } 7 | 8 | export default MyApp 9 | -------------------------------------------------------------------------------- /community-website/pages/api/hello.ts: -------------------------------------------------------------------------------- 1 | // Next.js API route support: https://nextjs.org/docs/api-routes/introduction 2 | import type { NextApiRequest, NextApiResponse } from 'next' 3 | 4 | type Data = { 5 | name: string 6 | } 7 | 8 | export default function handler( 9 | req: NextApiRequest, 10 | res: NextApiResponse 11 | ) { 12 | res.status(200).json({ name: 'John Doe' }) 13 | } 14 | -------------------------------------------------------------------------------- /community-website/pages/community-guidelines.tsx: -------------------------------------------------------------------------------- 1 | /* eslint-disable @next/next/no-img-element */ 2 | import type { NextPage } from "next"; 3 | import { useEffect } from "react"; 4 | import Head from "next/head"; 5 | import styles from "../styles/Home.module.css"; 6 | import Link from "next/link"; 7 | import ConfettiGenerator from "confetti-js"; 8 | import NavBar from "../components/NavBar"; 9 | 10 | const CommunityGuidelines: NextPage = () => { 11 | useEffect(() => { 12 | const confettiSettings = { target: "confetti-canvas" }; 13 | const confetti = new ConfettiGenerator(confettiSettings); 14 | confetti.render(); 15 | 16 | return () => confetti.clear(); 17 | }, []); 18 | 19 | return ( 20 |
21 | 22 | Community Guidelines 23 | 24 | 25 | 26 | 27 | 31 | 32 |
35 | 36 | 37 |

38 | 43 | Community Guidelines 📜 44 | 45 |

46 | 47 |

48 | {"< Go Back"} 49 |

50 | 51 |
52 |

53 | Like any other open-source organization, this organization is made 54 | up of a diverse group of individuals from around the globe who work 55 | on every facet of its goals. This diversity is one of its strengths, 56 | but it can also lead to communication issues and unhappiness. To 57 | that end, we have a few ground rules that we ask people to adhere 58 | to. This code applies equally to founders, mentors and those seeking 59 | help and guidance. 60 |

61 |
62 |

63 | We take pride in being inclusive and treating everyone with respect, 64 | regardless of gender identity and expression, sexual orientation, 65 | disabilities, neurodiversity, physical appearance, body size, 66 | ethnicity, nationality, race, age, religion, or similar personal 67 | characteristics. We love the diverse opinions of our contributors 68 | and maintainers; therefore, we expect you to. 69 |

70 |
71 | The subsequent subsections go into further detail about our 72 | community's guidelines and standards. 73 |
74 |
75 |
    76 |
  1. 77 | 1. Be more considerate, kind, constructive, and helpful 78 |

    79 | We want to create a community where everyone feels welcome and 80 | receives support from people of different backgrounds and 81 | identities. Thus, we believe we can achieve this by building a 82 | positive, welcoming environment where everyone feels safe to 83 | share ideas, thoughts, and feedback. As you contribute, try to 84 | be supportive, respect individual opinions, and report 85 | inappropriate posts if needed. Respectful and constructive 86 | communication is encouraged and appreciated. We believe that 87 | everyone has the right to express their opinions and that 88 | constructive criticism is essential to the growth of the 89 | project. However, we also believe that everyone has the right to 90 | have their opinions heard, and that any form of harassment or 91 | personal attacks is completely unacceptable. 92 |

    93 |
    2. 94 |
    95 |
  2. 96 | 2. Expected behavior and choice of words matters 97 |

    98 | We are a very diverse community. Thus, it would help if you 99 | acted professionally. Therefore, you are to work in a manner 100 | that includes but is not restricted to: 101 |

    102 |
      103 |
    • 104 |   - Don't use violent threats or language directed 105 | against another individual. 106 |
      • 107 |
    •   - Consider collaboration before conflict.
      • 108 |
    • 109 |   - No discriminatory jokes, insults, and language. This 110 | includes discriminatory behavior and speech, especially 111 | racist, homophobic, sexist, ageist, or demeaning 112 | words. 113 |
      • 114 |
    • 115 |   - Do not post sexually explicit or violent material. 116 |
      • 117 |
    •   - No unwelcome sexual attention.
      • 118 |
    • 119 |   - Do not advocate for or encourage any of the above 120 | behavior. 121 |
      • 122 |
    • 123 |   - In general, if someone asks you to stop, then stop. 124 |
      • 125 |
    • 126 |   - Participate authentically and actively to contribute 127 | to this community's health and longevity. 128 |
      • 129 |
    130 |

    131 | Be mindful of your fellow participants and please report any 132 | cases of harassment by alerting community leaders if you notice 133 | a dangerous situation, someone in distress, or violations of 134 | this Code of Conduct, even if they seem inconsequential. 135 |

    136 |
    3. 137 |
    138 |
  3. 139 | 3. Disagreements 140 |

    141 | Disagreements are bound to happen, primarily because of the 142 | community's diversity. The strength of the project comes 143 | from its diversity. It is, however, important that we resolve 144 | disagreements constructively. Another individual having a 145 | different perspective or viewpoint on issues doesn't mean 146 | they're wrong. Don't forget that it is human to err, 147 | and blaming each other doesn't get us anywhere. Instead, 148 | focus on helping to resolve issues and learning from mistakes. 149 |

    150 |
    4. 151 |
    152 |
  4. 153 | 4. Zero tolerance for harassment and unacceptable behavior 154 |

    155 | Be respectful of everyone's ideas and perspectives on a 156 | problem. Don't directly attack a person. We will not 157 | tolerate any posts, comments, or messages to fellow 158 | contributors, admins, sponsors, or maintainers that are 159 | inappropriate, rude, or aggressive. This includes posts that 160 | spread misinformation and are disruptive to the communities. 161 |

    162 |
    163 |

    164 | Suppose a community member engages in unacceptable behavior. In 165 | that case, the community maintainers may take any action they 166 | deem appropriate, including a temporary ban or permanent 167 | expulsion from the community without warning (and without refund 168 | in the case of a paid event). 169 |

    170 |
    5. 171 |
    172 |
  5. 173 | 5. Reporting Guidelines 174 |

    175 | If you are subject to or witness unacceptable behavior, or have 176 | any other concerns, please notify the organization owner 177 | @melvincwng as soon as possible via email at: 178 | melvin.ng@outlook.sg. 179 |

    180 |
    181 |

    182 | Each complaint will be investigated. We shall use our discretion 183 | to decide when and how to respond to reported incidents, with 184 | options ranging from taking no action to banning someone 185 | permanently from the project and spaces sponsored by the 186 | project. 187 |

    188 |
    189 |

    190 | However, before taking further action, we will inform the 191 | accused of the report and give them a chance to speak about it. 192 | But we will act without warning in potentially hazardous 193 | circumstances, such as persistent harassment or threats to 194 | anyone's safety. 195 |

    196 |
    197 |

    198 | Written by:{" "} 199 | 205 | melvincwng 206 | {" "} 207 | &{" "} 208 | 214 | Bennykillua 215 | 216 |

    217 |
    6. 218 |
219 |
220 |
221 | 222 | 231 |
232 | ); 233 | }; 234 | 235 | export default CommunityGuidelines; 236 | -------------------------------------------------------------------------------- /community-website/pages/contributors.tsx: -------------------------------------------------------------------------------- 1 | /* eslint-disable @next/next/no-img-element */ 2 | import type { NextPage } from "next"; 3 | import { useEffect } from "react"; 4 | import Head from "next/head"; 5 | import styles from "../styles/Home.module.css"; 6 | import Link from "next/link"; 7 | import ConfettiGenerator from "confetti-js"; 8 | import NavBar from "../components/NavBar"; 9 | import { truncateNames } from "../utils/utils"; 10 | 11 | const Contributors: NextPage = () => { 12 | useEffect(() => { 13 | truncateNames(); 14 | 15 | const confettiSettings = { target: "confetti-canvas" }; 16 | const confetti = new ConfettiGenerator(confettiSettings); 17 | confetti.render(); 18 | 19 | return () => confetti.clear(); 20 | }, []); 21 | 22 | return ( 23 |
24 | 25 | Contributors 26 | 27 | 28 | 29 | 30 | 34 | 35 |
36 | 37 | 38 |

39 | 44 | Our Amazing Contributors ⭐ 45 | 46 |

47 | 48 |

49 | {"< Go Back"} 50 |

51 | 52 |
53 | 54 | 55 | 56 | 75 | 94 | 113 | 132 | 151 | 170 | 171 | 172 | 191 | 210 | 229 | 248 | 267 | 286 | 287 | 288 |
57 | 62 | melvincwng 69 |
70 | 71 | melvincwng 72 | 73 | 74 | 		76 | 81 | pink-bean 88 |
89 | 90 | pink-bean 91 | 92 | 93 | 		95 | 100 | theadityaagnihotri 107 |
108 | 109 | theadityaagnihotri 110 | 111 | 112 | 		114 | 119 | gabrielwarner 126 |
127 | 128 | GabrielWarner 129 | 130 | 131 | 		133 | 138 | Bennykillua 145 |
146 | 147 | Bennykillua 148 | 149 | 150 | 		152 | 157 | Mesfrum 164 |
165 | 166 | Mesfrum 167 | 168 | 169 |
173 | 178 | SuryodayYadav 185 |
186 | 187 | SuryodayYadav 188 | 189 | 190 | 		192 | 197 | sushantjha78 204 |
205 | 206 | sushantjha78 207 | 208 | 209 | 		211 | 216 | dollarboysushil 223 |
224 | 225 | dollarboysushil 226 | 227 | 228 | 		230 | 235 | avyuktsoni0731 242 |
243 | 244 | avyuktsoni0731 245 | 246 | 247 | 		249 | 254 | aachal28 261 |
262 | 263 | aachal28 264 | 265 | 266 | 		268 | 273 | divy-03 280 |
281 | 282 | divy-03 283 | 284 | 285 |
289 |
290 |
291 | 292 | 301 |
302 | ); 303 | }; 304 | 305 | export default Contributors; 306 | -------------------------------------------------------------------------------- /community-website/pages/educational-resources.tsx: -------------------------------------------------------------------------------- 1 | /* eslint-disable @next/next/no-img-element */ 2 | import type { NextPage } from "next"; 3 | import { useEffect } from "react"; 4 | import Head from "next/head"; 5 | import styles from "../styles/Home.module.css"; 6 | import Link from "next/link"; 7 | import ConfettiGenerator from "confetti-js"; 8 | import NavBar from "../components/NavBar"; 9 | 10 | const EducationalResources: NextPage = () => { 11 | useEffect(() => { 12 | const confettiSettings = { target: "confetti-canvas" }; 13 | const confetti = new ConfettiGenerator(confettiSettings); 14 | confetti.render(); 15 | 16 | return () => confetti.clear(); 17 | }, []); 18 | 19 | return ( 20 |
21 | 22 | Educational Resources 23 | 24 | 25 | 26 | 27 | 31 | 32 |
35 | 36 | 37 |

38 | 43 | Educational Resources 📚 44 | 45 |

46 | 47 |

48 | {"< Go Back"} 49 |

50 | 51 |
52 |

53 | AWS Educational Resources 54 |

88 |

89 |   90 |   91 |   92 |   93 |   94 |   95 |

96 | Web Development Resources 97 |

130 |

131 |   132 |   133 |   134 |   135 |   136 |   137 |

138 | GitHub Free Resources 139 |

149 |

150 |
151 |
152 | 153 | 162 |
163 | ); 164 | }; 165 | 166 | export default EducationalResources; 167 | -------------------------------------------------------------------------------- /community-website/pages/index.tsx: -------------------------------------------------------------------------------- 1 | import type { NextPage } from "next"; 2 | import Head from "next/head"; 3 | import styles from "../styles/Home.module.css"; 4 | import { useRef, useEffect } from "react"; 5 | import Typed from "typed.js"; 6 | import ConfettiGenerator from "confetti-js"; 7 | import NavBar from "../components/NavBar"; 8 | import Link from "next/link"; 9 | 10 | const Home: NextPage = () => { 11 | const typed = useRef(null); 12 | 13 | useEffect(() => { 14 | const options = { 15 | strings: [ 16 | "Get started with Your First Open Source Project!", 17 | "Submit your first open source contribution now!", 18 | "Join our awesome community of 350+ members!", 19 | ], 20 | typeSpeed: 75, 21 | backSpeed: 75, 22 | }; 23 | 24 | // #typing-element refers to the rendered below 25 | typed.current = new Typed("#typing-element", options); 26 | 27 | return () => { 28 | // Destroy Typed instance during cleanup to prevent memory leaks 29 | typed.current?.destroy(); 30 | }; 31 | }, []); 32 | 33 | useEffect(() => { 34 | const confettiSettings = { target: "confetti-canvas" }; 35 | const confetti = new ConfettiGenerator(confettiSettings); 36 | confetti.render(); 37 | 38 | return () => confetti.clear(); 39 | }, []); 40 | 41 | return ( 42 |
43 | 44 | Your First Open Source Project 45 | 46 | 47 | 48 | 49 | 54 | 55 |
56 | 57 | 58 |

59 | Welcome to{" "} 60 | 65 | Your First Open Source Project! 66 | 67 |

68 | 69 |

70 | 74 |

75 | 76 | 131 |
132 | 133 | 142 |
143 | ); 144 | }; 145 | 146 | export default Home; 147 | -------------------------------------------------------------------------------- /community-website/pages/learn-git-and-github.tsx: -------------------------------------------------------------------------------- 1 | /* eslint-disable @next/next/no-img-element */ 2 | import type { NextPage } from "next"; 3 | import { useEffect, useRef } from "react"; 4 | import Head from "next/head"; 5 | import Link from "next/link"; 6 | import ConfettiGenerator from "confetti-js"; 7 | import NavBar from "../components/NavBar"; 8 | 9 | import styles from "../styles/Home.module.css"; 10 | import specificStyles from "../styles/LearnGitAndGitHub.module.css"; 11 | 12 | const LearnGitAndGitHub: NextPage = () => { 13 | const currentSlide = useRef(0); 14 | const slidesRef = useRef>(); 15 | const renderButtonsComponent = () => { 16 | return ( 17 |
18 | 25 | 32 |
33 | ); 34 | }; 35 | 36 | // Show slide 37 | const showSlide = (n: number) => { 38 | if (!slidesRef.current) return; 39 | const slides = slidesRef.current; 40 | const totalSlides = slides.length; 41 | 42 | slides[currentSlide.current].classList.remove(specificStyles.active); 43 | 44 | currentSlide.current = n; 45 | if (currentSlide.current >= totalSlides) currentSlide.current = 0; 46 | if (currentSlide.current < 0) currentSlide.current = totalSlides - 1; 47 | 48 | slides[currentSlide.current].classList.add(specificStyles.active); 49 | 50 | const slideNumberEl = document.getElementById("slide-number"); 51 | const prevBtn = document.getElementById("prev-btn") as HTMLButtonElement; 52 | const nextBtn = document.getElementById("next-btn") as HTMLButtonElement; 53 | 54 | if (slideNumberEl) 55 | slideNumberEl.textContent = String(currentSlide.current + 1); 56 | if (prevBtn) prevBtn.disabled = currentSlide.current === 0; 57 | if (nextBtn) nextBtn.disabled = currentSlide.current === totalSlides - 1; 58 | }; 59 | 60 | const nextSlide = () => showSlide(currentSlide.current + 1); 61 | const previousSlide = () => showSlide(currentSlide.current - 1); 62 | 63 | useEffect(() => { 64 | // Initialize slides 65 | slidesRef.current = document.querySelectorAll(`.${specificStyles.slide}`); 66 | const totalSlidesEl = document.getElementById("total-slides"); 67 | if (slidesRef.current && totalSlidesEl) 68 | totalSlidesEl.textContent = String(slidesRef.current.length); 69 | 70 | showSlide(0); 71 | 72 | // Keyboard navigation 73 | const handleKeyDown = (e: KeyboardEvent) => { 74 | if (e.key === "ArrowRight" || e.key === " ") { 75 | e.preventDefault(); 76 | nextSlide(); 77 | } else if (e.key === "ArrowLeft") { 78 | e.preventDefault(); 79 | previousSlide(); 80 | } 81 | }; 82 | document.addEventListener("keydown", handleKeyDown); 83 | 84 | // Confetti 85 | const confetti = new ConfettiGenerator({ target: "confetti-canvas" }); 86 | confetti.render(); 87 | 88 | return () => { 89 | confetti.clear(); 90 | document.removeEventListener("keydown", handleKeyDown); 91 | }; 92 | }, []); 93 | 94 | return ( 95 |
96 | 97 | Project Management using Git and GitHub 98 | 99 | 100 | 101 | 102 | 106 | 107 |
110 | 111 | 112 |

113 | 118 | Project Management using Git and GitHub 🌍 119 | 120 |

121 | 122 |

123 | {"< Go Back"} 124 |

125 | 126 |
127 | Slide 128 | 129 | 1 130 | 131 | / 132 | 133 | 15 134 | 135 |
136 | 137 |
138 | {/* Slide 1 */} 139 |
142 |

Project Management using Git and GitHub

143 |

Version Control Systems for Modern Development

144 |

145 | A Complete Guide to Git, GitHub, and Project Management 146 |

147 | {renderButtonsComponent()} 148 |
149 | 150 | {/* Slide 2 */} 151 |
152 |

What is Version Control?

153 |

154 | Version Control Systems (VCS) track changes to files and 155 | coordinate work among multiple people. 156 |

157 |

Key Benefits:

158 |
    159 |
  • 160 | Track Changes: See what changed, when, and who 161 | made the change 162 |
    • 163 |
  • 164 | Backup & Recovery: Never lose your work with 165 | complete history 166 |
    • 167 |
  • 168 | Collaboration: Multiple developers can work on 169 | the same project 170 |
    • 171 |
  • 172 | Branching: Work on features independently 173 | without affecting main code 174 |
    • 175 |
  • 176 | Rollback: Easily revert to previous working 177 | versions 178 |
    • 179 |
180 | {renderButtonsComponent()} 181 |
182 | 183 | {/* Slide 3 */} 184 |
185 |

Centralized vs Distributed Version Control

186 |
187 | Centralized vs Distributed Version Control 198 |
199 | {renderButtonsComponent()} 200 |
201 | 202 | {/* Slide 4 */} 203 |
204 |

What is Git?

205 |

206 | Git is a free, open-source distributed version control system 207 | designed to handle everything from small to very large projects 208 | with speed and efficiency. 209 |

210 |
211 |
212 |

Fast & Efficient

213 |

Optimized for performance with intelligent compression

214 |
215 |
216 |

Distributed

217 |

Every working directory is a full-fledged repository

218 |
219 |
220 |

Data Integrity

221 |

Everything is checksummed using SHA-1 and SHA-256 hash

222 |
223 |
224 |

Branching

225 |

Cheap local branching and easy merging

226 |
227 |
228 | {renderButtonsComponent()} 229 |
230 | 231 | {/* Slide 5 */} 232 |
233 |

What is GitHub?

234 |

235 | GitHub is a cloud-based hosting service for Git repositories, 236 | providing a web-based interface and additional collaboration 237 | features. 238 |

239 |

Key Features:

240 |
    241 |
  • 242 | Repository Hosting: Store and manage Git 243 | repositories in the cloud 244 |
    • 245 |
  • 246 | Collaboration Tools: Issues, pull requests, 247 | code reviews 248 |
    • 249 |
  • 250 | Project Management: Projects, milestones, and 251 | task tracking 252 |
    • 253 |
  • 254 | CI/CD: GitHub Actions for automated workflows 255 |
    • 256 |
  • 257 | Documentation: Wiki, README files, and GitHub 258 | Pages 259 |
    • 260 |
  • 261 | Social Coding: Follow developers, star 262 | repositories, contribute to open source 263 |
    • 264 |
265 | {renderButtonsComponent()} 266 |
267 | 268 | {/* Slide 6 */} 269 |
270 |

Git Setup and Installation

271 |

1. Install Git

272 |
273 | # Windows: Download from git-scm.com
274 | # macOS: brew install git
275 | # Ubuntu/Debian: sudo apt install git
# CentOS/RHEL: sudo 276 | yum install git 277 |
278 |

2. Configure Git

279 |
280 | git config --global user.name "Your Name"
281 | git config --global user.email "your.email@example.com"{" "} 282 |
283 | git config --global init.defaultBranch main 284 |
285 |

3. Verify Installation

286 |
287 | git --version
288 | git config --list 289 |
290 | {renderButtonsComponent()} 291 |
292 | 293 | {/* Slide 7 */} 294 |
295 |

GitHub Setup

296 |

1. Create GitHub Account

297 |

298 | Visit github.com and sign up for a free account 299 |

300 |

2. Set up SSH Key (Recommended)

301 |
302 | # Generate SSH key
303 | ssh-keygen -t ed25519 -C "your.email@example.com"
304 | # Add SSH key to ssh-agent
305 | eval "$(ssh-agent -s)"
306 | ssh-add ~/.ssh/id_ed25519
307 | # Copy public key to GitHub
308 | cat ~/.ssh/id_ed25519.pub 309 |
310 |

3. Alternative: Personal Access Token

311 |

312 | Go to GitHub Settings → Developer settings → Personal access 313 | tokens → Generate new token 314 |

315 | {renderButtonsComponent()} 316 |
317 | 318 | {/* Slide 8 */} 319 |
320 |

Essential Git Commands - Basics

321 |
322 |
git init
323 |
Initialize a new Git repository
324 |
325 | git clone <url> 326 |
327 |
Clone a remote repository
328 |
git status
329 |
Check repository status
330 |
git add <file>
331 |
Stage changes for commit
332 |
git add .
333 |
Stage all changes
334 |
335 | git commit -m "message" 336 |
337 |
Commit staged changes
338 |
git log
339 |
View commit history
340 |
git diff
341 |
Show unstaged changes
342 |
343 | {renderButtonsComponent()} 344 |
345 | 346 | {/* Slide 9 */} 347 |
348 |

Essential Git Commands - Branching

349 |
350 |
git branch
351 |
List all branches
352 |
353 | git branch <name> 354 |
355 |
Create a new branch
356 |
357 | git checkout <branch> 358 |
359 |
Switch to a branch
360 |
361 | git checkout -b <name> 362 |
363 |
Create and switch to new branch
364 |
365 | git merge <branch> 366 |
367 |
Merge branch into current branch
368 |
369 | git branch -d <name> 370 |
371 |
Delete a branch
372 |
git stash
373 |
Temporarily save changes
374 |
git stash pop
375 |
Apply and remove stashed changes
376 |
377 | {renderButtonsComponent()} 378 |
379 | 380 | {/* Slide 10 */} 381 |
382 |

Essential Git Commands - Remote

383 |
384 |
git remote -v
385 |
Show remote repositories
386 |
387 | git remote add origin <url> 388 |
389 |
Add a remote repository
390 |
git push origin main
391 |
Push commits to remote
392 |
git pull origin main
393 |
Pull changes from remote
394 |
git fetch
395 |
Download remote changes (no merge)
396 |
397 | git push -u origin <branch> 398 |
399 |
Push and set upstream branch
400 |
401 | git clone <url> 402 |
403 |
Clone remote repository
404 |
405 | git remote remove <name> 406 |
407 |
Remove a remote repository
408 |
409 | {renderButtonsComponent()} 410 |
411 | 412 | {/* Slide 11 */} 413 |
414 |

Git Three-Stage Architecture

415 |
416 | Git Three-Stage Architecture Diagram 426 |
427 |
428 | # Example workflow
429 | echo "Hello World" {">"} hello.txt
430 | git add hello.txt
431 | git commit -m "Add hello file"
432 | git push origin main 433 |
434 | {renderButtonsComponent()} 435 |
436 | 437 | {/* Slide 12 */} 438 |
439 |

GitHub Project Management Features

440 |
441 |
442 |

Issues

443 |

444 | Track bugs, feature requests, and tasks with labels, 445 | assignees, and milestones 446 |

447 |
448 |
449 |

Pull Requests

450 |

451 | Code review process, discuss changes, and collaborate before 452 | merging 453 |

454 |
455 |
456 |

Projects

457 |

458 | Kanban-style boards to organize and prioritize work across 459 | repositories 460 |

461 |
462 |
463 |

Milestones

464 |

465 | Group issues and pull requests into release cycles or project 466 | phases 467 |

468 |
469 |
470 |

Additional Features:

471 |
    472 |
  • 473 | Wiki: Documentation and knowledge base 474 |
    • 475 |
  • 476 | Actions: CI/CD workflows and automation 477 |
    • 478 |
  • 479 | Releases: Package and distribute software 480 | versions 481 |
    • 482 |
483 | {renderButtonsComponent()} 484 |
485 | 486 | {/* Slide 13 */} 487 |
488 |

Git vs GitHub

489 | Git vs GitHub 500 | {renderButtonsComponent()} 501 |
502 | 503 | {/* Slide 14 */} 504 |
505 |

Git & GitHub Best Practices

506 |

Commit Best Practices:

507 |
    508 |
  • 509 | Clear Messages: Use present tense, imperative 510 | mood 511 |
    • 512 |
  • 513 | Atomic Commits: One logical change per commit 514 |
    • 515 |
  • 516 | Regular Commits: Commit early and often 517 |
    • 518 |
519 |

Project Management Best Practices:

520 |
    521 |
  • 522 | Use Issues: Track all work items and 523 | discussions 524 |
    • 525 |
  • 526 | Link Issues: Reference issues in commits and 527 | PRs 528 |
    • 529 |
  • 530 | Code Reviews: Always use pull requests for main 531 | branch 532 |
    • 533 |
  • 534 | Documentation: Keep README and docs updated 535 |
    • 536 |
  • 537 | Branching: Use descriptive branch names 538 |
    • 539 |
  • 540 | Tags: Mark important releases and versions 541 |
    • 542 |
543 | {renderButtonsComponent()} 544 |
545 | 546 | {/* Slide 15 */} 547 |
548 |

Summary

549 |

What We've Covered:

550 |
    551 |
  • 552 | Version Control Systems: CVS vs DVS concepts 553 |
    • 554 |
  • 555 | Git Fundamentals: Installation, configuration, 556 | and core concepts 557 |
    • 558 |
  • 559 | GitHub Platform: Cloud-based collaboration and 560 | project management 561 |
    • 562 |
  • 563 | Essential Commands: Complete toolkit for daily 564 | Git operations 565 |
    • 566 |
  • 567 | Project Management: Issues, pull requests, and 568 | workflow strategies 569 |
    • 570 |
  • 571 | Best Practices: Professional development 572 | workflows 573 |
    • 574 |
575 |

Next Steps:

576 |
    577 |
  • Practice with a sample project
    • 578 |
  • {`Explore GitHub's advanced features`}
    • 579 |
  • Implement a branching strategy
    • 580 |
  • Set up automated workflows with GitHub Actions
    • 581 |
582 | {renderButtonsComponent()} 583 |
584 |
585 |
586 | 587 | 596 |
597 | ); 598 | }; 599 | 600 | export default LearnGitAndGitHub; 601 | -------------------------------------------------------------------------------- /community-website/postcss.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | plugins: { 3 | tailwindcss: {}, 4 | autoprefixer: {}, 5 | }, 6 | } 7 | -------------------------------------------------------------------------------- /community-website/public/cvcs&dvcs.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yfosp/main-website/a6e1c042f13e7581344d464e010f879ed2a3b11c/community-website/public/cvcs&dvcs.png -------------------------------------------------------------------------------- /community-website/public/earth-asia-solid.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /community-website/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yfosp/main-website/a6e1c042f13e7581344d464e010f879ed2a3b11c/community-website/public/favicon.ico -------------------------------------------------------------------------------- /community-website/public/git-3-tier-architecture.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yfosp/main-website/a6e1c042f13e7581344d464e010f879ed2a3b11c/community-website/public/git-3-tier-architecture.png -------------------------------------------------------------------------------- /community-website/public/gitVSgithub.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yfosp/main-website/a6e1c042f13e7581344d464e010f879ed2a3b11c/community-website/public/gitVSgithub.png -------------------------------------------------------------------------------- /community-website/public/vercel.svg: -------------------------------------------------------------------------------- 1 | 3 | 4 | -------------------------------------------------------------------------------- /community-website/styles/Home.module.css: -------------------------------------------------------------------------------- 1 | .container { 2 | padding: 0 2rem; 3 | } 4 | 5 | .main { 6 | min-height: 100vh; 7 | padding: 0 0 2rem; 8 | flex: 1; 9 | display: flex; 10 | flex-direction: column; 11 | justify-content: center; 12 | align-items: center; 13 | } 14 | 15 | .communityMembers, 16 | .contributors { 17 | min-height: 80vh; 18 | padding: 0 0 6rem; 19 | flex: 1; 20 | display: flex; 21 | flex-direction: column; 22 | align-items: center; 23 | } 24 | 25 | .communityGuidelines, 26 | .learnGitAndGitHub { 27 | min-height: 80vh; 28 | padding: 0 0 2rem; 29 | flex: 1; 30 | display: flex; 31 | flex-direction: column; 32 | align-items: center; 33 | } 34 | 35 | .educationalResources { 36 | min-height: 86vh; 37 | padding: 0 0 2rem; 38 | flex: 1; 39 | display: flex; 40 | flex-direction: column; 41 | align-items: center; 42 | } 43 | 44 | .educationalResourcesContainer { 45 | display: flex; 46 | flex-direction: row; 47 | } 48 | 49 | .footer { 50 | display: flex; 51 | flex: 1; 52 | padding: 2rem 0; 53 | border-top: 1px solid #eaeaea; 54 | justify-content: center; 55 | align-items: center; 56 | text-align: center; 57 | } 58 | 59 | .footer a { 60 | display: flex; 61 | justify-content: center; 62 | align-items: center; 63 | flex-grow: 1; 64 | } 65 | 66 | .title a { 67 | color: #0070f3; 68 | text-decoration: none; 69 | } 70 | 71 | .title a:hover, 72 | .title a:focus, 73 | .title a:active { 74 | text-decoration: underline; 75 | } 76 | 77 | .title { 78 | margin: 0; 79 | line-height: 1.15; 80 | font-size: 3rem; 81 | font-weight: bold; 82 | } 83 | 84 | .title, 85 | .description { 86 | text-align: center; 87 | } 88 | 89 | .educationalLinks { 90 | color: #0070f3; 91 | } 92 | 93 | .educationalLinks a:hover, 94 | .educationalLinks a:focus, 95 | .educationalLinks a:active { 96 | text-decoration: underline; 97 | } 98 | 99 | .description { 100 | margin: 4rem 0; 101 | line-height: 1.5; 102 | font-size: 1.25rem; 103 | } 104 | 105 | .code { 106 | background: #fafafa; 107 | border-radius: 5px; 108 | padding: 0.75rem; 109 | font-size: 1.1rem; 110 | font-family: Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, 111 | Bitstream Vera Sans Mono, Courier New, monospace; 112 | } 113 | 114 | .grid { 115 | display: flex; 116 | align-items: center; 117 | justify-content: center; 118 | flex-wrap: wrap; 119 | max-width: 800px; 120 | } 121 | 122 | .card { 123 | margin: 1rem; 124 | padding: 1.5rem; 125 | text-align: left; 126 | color: inherit; 127 | text-decoration: none; 128 | border: 1px solid #eaeaea; 129 | border-radius: 10px; 130 | transition: color 0.15s ease, border-color 0.15s ease; 131 | max-width: 300px; 132 | } 133 | 134 | .card:hover, 135 | .card:focus, 136 | .card:active { 137 | color: #0070f3; 138 | border-color: #0070f3; 139 | } 140 | 141 | .card h2 { 142 | margin: 0 0 1rem 0; 143 | font-size: 1.5rem; 144 | } 145 | 146 | .card p { 147 | margin: 0; 148 | font-size: 1.25rem; 149 | line-height: 1.5; 150 | } 151 | 152 | .logo { 153 | height: 1em; 154 | margin-left: 0.5rem; 155 | } 156 | 157 | .canvas { 158 | position: fixed; 159 | top: 0; 160 | left: 0; 161 | z-index: -1; 162 | width: 100%; 163 | height: 100%; 164 | } 165 | 166 | .profileImage { 167 | max-width: none; 168 | } 169 | 170 | .tableData { 171 | width: 16.66%; 172 | } 173 | 174 | .wrapperDiv { 175 | overflow-x: auto !important; 176 | } 177 | 178 | @media (max-width: 600px) { 179 | .grid { 180 | width: 100%; 181 | flex-direction: column; 182 | } 183 | 184 | .wrapperDiv { 185 | width: 100%; 186 | overflow-x: auto !important; 187 | } 188 | } 189 | 190 | @media (max-width: 480px) { 191 | .educationalResourcesContainer { 192 | flex-direction: column; 193 | } 194 | } 195 | 196 | @media (prefers-color-scheme: dark) { 197 | .card, 198 | .footer { 199 | border-color: #222; 200 | } 201 | .logo img { 202 | filter: invert(1); 203 | } 204 | } 205 | -------------------------------------------------------------------------------- /community-website/styles/LearnGitAndGitHub.module.css: -------------------------------------------------------------------------------- 1 | .presentationContainer { 2 | width: 100%; 3 | height: 100%; 4 | display: flex; 5 | align-items: center; 6 | justify-content: center; 7 | position: relative; 8 | padding: 10px; 9 | box-sizing: border-box; 10 | } 11 | 12 | .slide { 13 | width: 100%; 14 | max-width: 1000px; 15 | min-height: 80vh; 16 | background: rgba(255, 255, 255, 0.95); 17 | border-radius: 20px; 18 | box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3); 19 | padding: 40px 20px; 20 | display: none; 21 | flex-direction: column; 22 | justify-content: center; 23 | color: #333; 24 | backdrop-filter: blur(10px); 25 | border: 1px solid rgba(255, 255, 255, 0.2); 26 | overflow-x: hidden; 27 | text-align: center; 28 | } 29 | 30 | .slide.active { 31 | display: flex; 32 | } 33 | 34 | .slide h1 { 35 | font-size: clamp(1.5rem, 5vw, 4em); 36 | margin-bottom: 30px; 37 | background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); 38 | -webkit-background-clip: text; 39 | -webkit-text-fill-color: transparent; 40 | text-align: center; 41 | } 42 | 43 | .slide h2 { 44 | font-size: clamp(1.2rem, 4vw, 2.5em); 45 | margin-bottom: 25px; 46 | color: #4a5568; 47 | border-bottom: 3px solid #667eea; 48 | padding-bottom: 10px; 49 | } 50 | 51 | .slide h3 { 52 | font-size: clamp(1rem, 3vw, 1.8em); 53 | margin: 20px 0 15px 0; 54 | color: #667eea; 55 | } 56 | 57 | .slide p, 58 | .slide li { 59 | font-size: clamp(0.9rem, 2.5vw, 1.2em); 60 | line-height: 1.5; 61 | margin-bottom: 15px; 62 | } 63 | 64 | .slide ul { 65 | margin-left: 20px; 66 | margin-bottom: 20px; 67 | } 68 | 69 | .code-block { 70 | background: #2d3748; 71 | color: #e2e8f0; 72 | padding: 15px; 73 | border-radius: 10px; 74 | font-family: "Courier New", monospace; 75 | margin: 15px 0; 76 | border-left: 4px solid #667eea; 77 | overflow-x: auto; 78 | } 79 | 80 | .feature-grid, 81 | .comparison-table, 82 | .cvs-vs-dvs { 83 | display: grid; 84 | grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); 85 | gap: 20px; 86 | margin: 20px 0; 87 | } 88 | 89 | .feature-card, 90 | .comparison-card, 91 | .server-box, 92 | .client-box, 93 | .flow-step, 94 | .git-area { 95 | box-sizing: border-box; 96 | min-width: 150px; 97 | flex: 1; 98 | } 99 | 100 | .navigation { 101 | bottom: 10px; 102 | left: 0; 103 | width: 100%; 104 | display: flex; 105 | justify-content: center; 106 | gap: 10px; 107 | padding: 5px 10px; 108 | z-index: 1000; 109 | flex-wrap: wrap; 110 | backdrop-filter: blur(10px); 111 | margin-top: 30px; 112 | } 113 | 114 | .navBtn { 115 | background: rgba(255, 255, 255, 0.2); 116 | border: 2px solid black; 117 | color: black; 118 | padding: 10px 20px; 119 | border-radius: 50px; 120 | cursor: pointer; 121 | font-size: clamp(0.8rem, 2vw, 1rem); 122 | transition: all 0.3s ease; 123 | } 124 | 125 | .navBtn:hover { 126 | background: rgba(255, 255, 255, 0.3); 127 | transform: translateY(-2px); 128 | } 129 | 130 | .navBtn:disabled { 131 | opacity: 0.5; 132 | cursor: not-allowed; 133 | } 134 | 135 | .slide-counter { 136 | position: fixed; 137 | top: 10px; 138 | right: 10px; 139 | background: rgba(255, 255, 255, 0.2); 140 | padding: 5px 15px; 141 | border-radius: 25px; 142 | backdrop-filter: blur(10px); 143 | font-size: clamp(0.8rem, 2vw, 1rem); 144 | } 145 | 146 | /* Responsive text alignment and spacing */ 147 | .title-slide { 148 | text-align: center; 149 | justify-content: center; 150 | } 151 | 152 | .title-slide h1 { 153 | font-size: clamp(2rem, 6vw, 4em); 154 | } 155 | 156 | .title-slide p { 157 | font-size: clamp(1rem, 3vw, 1.5em); 158 | opacity: 0.8; 159 | } 160 | 161 | /* Diagrams and workflow */ 162 | .diagram-container, 163 | .git-flow-horizontal, 164 | .branch-diagram, 165 | .github-flow-diagram { 166 | width: 100%; 167 | display: flex; 168 | flex-wrap: wrap; 169 | justify-content: center; 170 | gap: 15px; 171 | } 172 | 173 | .git-area, 174 | .commit-node, 175 | .branch-name, 176 | .flow-step, 177 | .step-number { 178 | flex: 1 1 auto; 179 | } 180 | 181 | /* ======================= 182 | Code & Commands 183 | ======================= */ 184 | .codeBlock, 185 | .command { 186 | background: #2d3748; 187 | color: #e2e8f0; 188 | padding: 15px 20px; 189 | border-radius: 10px; 190 | font-family: "Courier New", monospace; 191 | border-left: 4px solid #667eea; 192 | overflow-x: auto; 193 | } 194 | 195 | .command-list { 196 | display: grid; 197 | grid-template-columns: 1fr 2fr; 198 | gap: 15px; 199 | align-items: center; 200 | margin: 10px 0; 201 | } 202 | 203 | .command { 204 | color: #ffd700; 205 | font-size: 0.9em; 206 | padding: 8px 12px; 207 | border-radius: 6px; 208 | } 209 | 210 | /* Media queries for small devices */ 211 | @media (max-width: 768px) { 212 | .slide { 213 | padding: 20px 15px; 214 | } 215 | 216 | .feature-grid, 217 | .comparison-table, 218 | .cvs-vs-dvs, 219 | .diagram-container, 220 | .git-flow-horizontal, 221 | .branch-diagram, 222 | .github-flow-diagram { 223 | flex-direction: column; 224 | gap: 10px; 225 | } 226 | 227 | .slide h1, 228 | .slide h2, 229 | .slide h3, 230 | .slide p, 231 | .slide li { 232 | text-align: center; 233 | } 234 | 235 | .navigation { 236 | flex-direction: column; 237 | gap: 8px; 238 | padding-bottom: 15px; 239 | } 240 | 241 | .slide-counter { 242 | top: 5px; 243 | right: 5px; 244 | padding: 5px 10px; 245 | } 246 | } 247 | 248 | :global(.dark) .slide { 249 | background: rgba(30, 30, 30, 0.95); 250 | box-shadow: 0 20px 60px rgba(255, 255, 255, 0.1); 251 | color: #f1f1f1; 252 | border: 1px solid rgba(255, 255, 255, 0.1); 253 | } 254 | 255 | :global(.dark) .slide h2 { 256 | color: #cbd5e0; 257 | } 258 | 259 | :global(.dark) .navBtn { 260 | background: rgba(0, 0, 0, 0.2); 261 | border: 2px solid white; 262 | color: white; 263 | } 264 | 265 | :global(.dark) .navBtn:hover { 266 | background: rgba(0, 0, 0, 0.3); 267 | } 268 | 269 | :global(.dark) .slide-counter { 270 | background: rgba(0, 0, 0, 0.2); 271 | } 272 | -------------------------------------------------------------------------------- /community-website/styles/globals.css: -------------------------------------------------------------------------------- 1 | @tailwind base; 2 | @tailwind components; 3 | @tailwind utilities; 4 | 5 | html, 6 | body { 7 | padding: 0; 8 | margin: 0; 9 | font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, 10 | Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif; 11 | } 12 | 13 | a { 14 | color: inherit; 15 | text-decoration: none; 16 | } 17 | 18 | * { 19 | box-sizing: border-box; 20 | } 21 | 22 | @media (prefers-color-scheme: dark) { 23 | html { 24 | color-scheme: dark; 25 | } 26 | body { 27 | color: white; 28 | background: black; 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /community-website/tailwind.config.js: -------------------------------------------------------------------------------- 1 | /** @type {import('tailwindcss').Config} */ 2 | module.exports = { 3 | darkMode: 'class', 4 | content: [ 5 | "./pages/**/*.{js,jsx,ts,tsx}", 6 | "./components/**/*.{js,jsx,ts,tsx}", 7 | ], 8 | theme: { 9 | extend: {}, 10 | }, 11 | plugins: [], 12 | } -------------------------------------------------------------------------------- /community-website/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "es5", 4 | "lib": ["dom", "dom.iterable", "esnext"], 5 | "allowJs": true, 6 | "skipLibCheck": true, 7 | "strict": true, 8 | "forceConsistentCasingInFileNames": true, 9 | "noEmit": true, 10 | "esModuleInterop": true, 11 | "module": "esnext", 12 | "moduleResolution": "node", 13 | "resolveJsonModule": true, 14 | "isolatedModules": true, 15 | "jsx": "preserve", 16 | "incremental": true 17 | }, 18 | "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"], 19 | "exclude": ["node_modules"] 20 | } 21 | -------------------------------------------------------------------------------- /community-website/utils/utils.ts: -------------------------------------------------------------------------------- 1 | export function truncateNames(): void { 2 | const subscriptElements = document.getElementsByTagName("sub"); 3 | const subscriptElementsArray = Array.from(subscriptElements); 4 | if (subscriptElementsArray !== null) { 5 | subscriptElementsArray.forEach((subscriptElement) => { 6 | const wordLength = subscriptElement?.textContent?.length || 0; 7 | if (wordLength > 13) { 8 | subscriptElement.innerHTML = 9 | "" + subscriptElement?.textContent?.substr(0, 10) + "..." + ""; 10 | } 11 | }); 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /images/HackToberFest.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yfosp/main-website/a6e1c042f13e7581344d464e010f879ed2a3b11c/images/HackToberFest.PNG --------------------------------------------------------------------------------