|
| 1 | +# 🤝 Contributing to ReactSphere Community |
| 2 | + |
| 3 | +Thank you for your interest in contributing! ReactSphere Community grows stronger with every contribution — whether it's a bug fix, a new feature, improved documentation, or a helpful discussion. This guide will walk you through everything you need to know. |
| 4 | + |
| 5 | +--- |
| 6 | + |
| 7 | +## 📋 Table of Contents |
| 8 | + |
| 9 | +1. [Code of Conduct](#code-of-conduct) |
| 10 | +2. [Ways to Contribute](#ways-to-contribute) |
| 11 | +3. [Getting Started](#getting-started) |
| 12 | +4. [Branching Strategy](#branching-strategy) |
| 13 | +5. [Commit Message Conventions](#commit-message-conventions) |
| 14 | +6. [Pull Request Process](#pull-request-process) |
| 15 | +7. [Coding Standards](#coding-standards) |
| 16 | +8. [Reporting Issues](#reporting-issues) |
| 17 | +9. [Participating in Discussions](#participating-in-discussions) |
| 18 | +10. [Reviewing Pull Requests](#reviewing-pull-requests) |
| 19 | +11. [Mentorship Program](#mentorship-program) |
| 20 | + |
| 21 | +--- |
| 22 | + |
| 23 | +## Code of Conduct |
| 24 | + |
| 25 | +By participating in this project, you agree to abide by our [Code of Conduct](CODE_OF_CONDUCT.md). Please read it before contributing. |
| 26 | + |
| 27 | +--- |
| 28 | + |
| 29 | +## Ways to Contribute |
| 30 | + |
| 31 | +There are many ways to get involved — no contribution is too small! |
| 32 | + |
| 33 | +| Type | How | |
| 34 | +|---|---| |
| 35 | +| 🐛 **Bug reports** | [Open an issue](https://github.com/ReactSphere/reactsphere-community/issues/new) with the `bug` label | |
| 36 | +| 💡 **Feature requests** | [Start a discussion](https://github.com/ReactSphere/reactsphere-community/discussions/new) first, then open an issue | |
| 37 | +| 📝 **Documentation** | Edit Markdown files and open a pull request | |
| 38 | +| 💻 **Code** | Fork, branch, code, test, and open a pull request | |
| 39 | +| 🔍 **Reviews** | Comment on [open pull requests](https://github.com/ReactSphere/reactsphere-community/pulls) | |
| 40 | +| 🗣️ **Discussions** | Answer questions and share knowledge in [Discussions](https://github.com/ReactSphere/reactsphere-community/discussions) | |
| 41 | + |
| 42 | +--- |
| 43 | + |
| 44 | +## Getting Started |
| 45 | + |
| 46 | +### Prerequisites |
| 47 | + |
| 48 | +- A GitHub account |
| 49 | +- [Git](https://git-scm.com/) installed locally |
| 50 | +- [Node.js](https://nodejs.org/) (LTS version recommended) if working with scripts |
| 51 | + |
| 52 | +### Setup |
| 53 | + |
| 54 | +1. **Fork** the repository using the GitHub UI. |
| 55 | + |
| 56 | +2. **Clone** your fork: |
| 57 | + |
| 58 | + ```bash |
| 59 | + git clone https://github.com/<your-username>/reactsphere-community.git |
| 60 | + cd reactsphere-community |
| 61 | + ``` |
| 62 | + |
| 63 | +3. **Add the upstream remote** so you can sync with the original repo: |
| 64 | + |
| 65 | + ```bash |
| 66 | + git remote add upstream https://github.com/ReactSphere/reactsphere-community.git |
| 67 | + ``` |
| 68 | + |
| 69 | +4. **Install dependencies** (if applicable): |
| 70 | + |
| 71 | + ```bash |
| 72 | + npm install |
| 73 | + ``` |
| 74 | + |
| 75 | +5. **Create a branch** for your work (see [Branching Strategy](#branching-strategy) below). |
| 76 | + |
| 77 | +--- |
| 78 | + |
| 79 | +## Branching Strategy |
| 80 | + |
| 81 | +We use a **feature-branch workflow**. All changes are made in short-lived branches and merged into `main` via pull requests. |
| 82 | + |
| 83 | +| Branch prefix | Purpose | Example | |
| 84 | +|---|---|---| |
| 85 | +| `feat/` | New features or enhancements | `feat/add-mentorship-page` | |
| 86 | +| `fix/` | Bug fixes | `fix/leaderboard-rank-calc` | |
| 87 | +| `docs/` | Documentation updates | `docs/update-readme` | |
| 88 | +| `chore/` | Maintenance, CI, tooling | `chore/bump-node-version` | |
| 89 | +| `refactor/` | Code refactoring without behavior change | `refactor/leaderboard-script` | |
| 90 | + |
| 91 | +**Rules:** |
| 92 | +- Always branch off `main`: `git checkout -b feat/my-feature main` |
| 93 | +- Keep branches focused — one logical change per branch. |
| 94 | +- Delete your branch after it is merged. |
| 95 | + |
| 96 | +--- |
| 97 | + |
| 98 | +## Commit Message Conventions |
| 99 | + |
| 100 | +We follow the [Conventional Commits](https://www.conventionalcommits.org/) specification. |
| 101 | + |
| 102 | +### Format |
| 103 | + |
| 104 | +``` |
| 105 | +<type>(<scope>): <short description> |
| 106 | +
|
| 107 | +[optional body] |
| 108 | +
|
| 109 | +[optional footer(s)] |
| 110 | +``` |
| 111 | + |
| 112 | +### Types |
| 113 | + |
| 114 | +| Type | When to use | |
| 115 | +|---|---| |
| 116 | +| `feat` | A new feature | |
| 117 | +| `fix` | A bug fix | |
| 118 | +| `docs` | Documentation changes only | |
| 119 | +| `style` | Formatting, whitespace (no logic change) | |
| 120 | +| `refactor` | Code restructuring without behavior change | |
| 121 | +| `test` | Adding or updating tests | |
| 122 | +| `chore` | Build process, CI, dependency updates | |
| 123 | + |
| 124 | +### Examples |
| 125 | + |
| 126 | +``` |
| 127 | +feat(leaderboard): add weekly contribution streak badge |
| 128 | +
|
| 129 | +fix(readme): correct broken contributor badge URL |
| 130 | +
|
| 131 | +docs(contributing): add branching strategy section |
| 132 | +
|
| 133 | +chore(ci): update Node.js version in leaderboard workflow |
| 134 | +``` |
| 135 | + |
| 136 | +**Tips:** |
| 137 | +- Use the imperative mood: "add feature" not "added feature" |
| 138 | +- Keep the subject line under 72 characters |
| 139 | +- Reference issues in the footer: `Closes #42` |
| 140 | + |
| 141 | +--- |
| 142 | + |
| 143 | +## Pull Request Process |
| 144 | + |
| 145 | +1. **Sync your fork** with upstream before starting: |
| 146 | + |
| 147 | + ```bash |
| 148 | + git fetch upstream |
| 149 | + git rebase upstream/main |
| 150 | + ``` |
| 151 | + |
| 152 | +2. **Push** your branch to your fork: |
| 153 | + |
| 154 | + ```bash |
| 155 | + git push origin feat/your-feature-name |
| 156 | + ``` |
| 157 | + |
| 158 | +3. **Open a Pull Request** against the `main` branch of this repository. |
| 159 | + |
| 160 | +4. **Fill in the PR template** — describe what changed and why. |
| 161 | + |
| 162 | +5. **Wait for review** — a maintainer or community member will review your PR. Be responsive to feedback. |
| 163 | + |
| 164 | +6. **Address review comments** — push additional commits to the same branch; do not open a new PR. |
| 165 | + |
| 166 | +7. Once approved, a maintainer will **squash-merge** your PR. |
| 167 | + |
| 168 | +### PR Checklist |
| 169 | + |
| 170 | +Before submitting, please confirm: |
| 171 | + |
| 172 | +- [ ] My branch is up to date with `main` |
| 173 | +- [ ] My commit messages follow [Conventional Commits](#commit-message-conventions) |
| 174 | +- [ ] I have tested my changes locally |
| 175 | +- [ ] I have updated relevant documentation |
| 176 | +- [ ] I have not introduced breaking changes (or noted them clearly) |
| 177 | + |
| 178 | +--- |
| 179 | + |
| 180 | +## Coding Standards |
| 181 | + |
| 182 | +Since this is primarily a documentation and community-tooling repository, most files are Markdown or JavaScript (Node.js scripts). |
| 183 | + |
| 184 | +### Markdown |
| 185 | + |
| 186 | +- Use [GitHub Flavored Markdown](https://github.github.com/gfm/). |
| 187 | +- Use ATX-style headings (`#`, `##`, `###`). |
| 188 | +- Add a blank line before and after headings, lists, and code blocks. |
| 189 | +- Prefer relative links to other files in the repository. |
| 190 | +- Use reference-style links for repeated URLs. |
| 191 | + |
| 192 | +### JavaScript / Node.js (scripts) |
| 193 | + |
| 194 | +- Use `const` and `let`; avoid `var`. |
| 195 | +- Use `async/await` over raw Promise chains where practical. |
| 196 | +- Keep scripts focused — one purpose per file. |
| 197 | +- Add comments for non-obvious logic. |
| 198 | +- Follow the existing style of files in `.github/scripts/`. |
| 199 | + |
| 200 | +--- |
| 201 | + |
| 202 | +## Reporting Issues |
| 203 | + |
| 204 | +Before opening a new issue, please: |
| 205 | + |
| 206 | +1. **Search existing issues** to avoid duplicates. |
| 207 | +2. **Check Discussions** — your question may already be answered. |
| 208 | + |
| 209 | +When opening an issue, choose the appropriate template and fill it in completely. Include: |
| 210 | + |
| 211 | +- A clear, descriptive title |
| 212 | +- Steps to reproduce (for bugs) |
| 213 | +- Expected vs. actual behavior (for bugs) |
| 214 | +- Screenshots or logs if relevant |
| 215 | +- Your environment details (OS, Node version, etc.) if relevant |
| 216 | + |
| 217 | +Label your issue appropriately (`bug`, `enhancement`, `documentation`, `question`). |
| 218 | + |
| 219 | +--- |
| 220 | + |
| 221 | +## Participating in Discussions |
| 222 | + |
| 223 | +Our [GitHub Discussions](https://github.com/ReactSphere/reactsphere-community/discussions) are the heart of the community. Here's how to engage constructively: |
| 224 | + |
| 225 | +- **Be helpful and kind.** Assume positive intent. |
| 226 | +- **Stay on-topic.** Keep threads focused on the subject. |
| 227 | +- **Share knowledge freely.** Link to resources, examples, and prior art. |
| 228 | +- **Vote on ideas.** Use 👍/👎 reactions to help signal community interest. |
| 229 | +- **Celebrate others.** Recognize good work with a 🎉 or a kind comment. |
| 230 | + |
| 231 | +--- |
| 232 | + |
| 233 | +## Reviewing Pull Requests |
| 234 | + |
| 235 | +Code review is a collaborative, learning-focused activity. When reviewing: |
| 236 | + |
| 237 | +- **Be respectful and constructive.** Critique the code, not the author. |
| 238 | +- **Explain your reasoning.** Instead of "change this," explain *why*. |
| 239 | +- **Acknowledge good work.** Use comments like "Nice approach here!" when appropriate. |
| 240 | +- **Use suggestions.** GitHub's suggestion feature makes it easy for authors to accept changes with one click. |
| 241 | +- **Focus on correctness, clarity, and maintainability** — not personal style preferences. |
| 242 | + |
| 243 | +If you are uncertain about a change, leave a comment and ask questions rather than blocking a PR unnecessarily. |
| 244 | + |
| 245 | +--- |
| 246 | + |
| 247 | +## Mentorship Program |
| 248 | + |
| 249 | +Are you new to open source or to React? Our volunteer mentors are here to help! |
| 250 | + |
| 251 | +- Look for issues labeled [`good first issue`](https://github.com/ReactSphere/reactsphere-community/labels/good%20first%20issue) to find beginner-friendly tasks. |
| 252 | +- Post in Discussions under **#help** to ask for guidance. |
| 253 | +- Experienced contributors: consider adding the `mentor` label to issues you are willing to guide someone through. |
| 254 | + |
| 255 | +We believe everyone has something to teach and something to learn. Welcome aboard! 🚀 |
| 256 | + |
| 257 | +--- |
| 258 | + |
| 259 | +## 🙏 Thank You |
| 260 | + |
| 261 | +Every contribution — no matter how small — makes ReactSphere Community better for everyone. We appreciate your time and effort. |
| 262 | + |
| 263 | +If you have questions about this guide, please [open a Discussion](https://github.com/ReactSphere/reactsphere-community/discussions/new). |
0 commit comments