Contributing to DevSnips

DevSnips is a community-driven project, and we welcome contributions from developers of all skill levels. Whether you're fixing a bug, improving documentation, or adding a new snippet, your help is valuable.

Contributing Workflow

To contribute, please follow these steps:

  1. Fork the Repository: Start by forking the official DevSnips repository to your own GitHub account.
  2. Create a New Branch: From your forked repository, create a new branch with a descriptive name, such as `feat/add-new-button-snippet`.
  3. Make Your Changes: Add your new snippet, fix a bug, or improve the documentation.
  4. Submit a Pull Request: Push your changes to your forked repository and open a pull request to the main DevSnips repository.

Creating New Snippets

Adding a new snippet is one of the best ways to contribute. Here is the step-by-step process:

  1. Choose a Category: Decide whether your snippet is HTML, CSS, or JavaScript.
  2. Follow Naming Conventions: Create a new file in the appropriate directory (e.g., `devsnips/snippets/html-snippets/`). The filename should be descriptive and use kebab-case (e.g., `glowing-icon-button.html`).
  3. Write Clean Code: Ensure your code is well-formatted, readable, and includes comments where necessary. Follow the existing style of the other snippets.

Code Review Guidelines

To ensure the quality and consistency of the snippet library, all contributions are reviewed against the following guidelines:

  • Quality and Reusability: The snippet should be well-crafted, solve a common problem, and be easily adaptable.
  • Style Consistency: The code should follow the existing formatting and naming conventions of the project.
  • No Dependencies: Snippets should be written in vanilla HTML, CSS, and JavaScript whenever possible.

Testing & Debugging Snippets

Before submitting your contribution, please test your snippet thoroughly to ensure it works as expected.

  • Browser Compatibility: Test your snippet in the latest versions of Chrome, Firefox, and Safari.
  • Responsive Design: If your snippet is a UI component, ensure it is responsive and looks good on all screen sizes.