From fba28cc35ec4bb81140561f6cbbb0f5251b15936 Mon Sep 17 00:00:00 2001 From: Semin <110274049+SEMIN-97@users.noreply.github.com> Date: Wed, 15 Jan 2025 15:20:36 +0900 Subject: [PATCH] docs: update CONTRIBUTING.md (#69) * docs: update CONTRIBUTING.md * docs: add introduction to Side (Sipe Design System) * docs: remove development server setup instructions * docs: add repository URL for forking instructions * docs: add commit message convention guidelines * docs: add protocol to Storybook local URL --- .github/CONTRIBUTING.md | 129 ++++++++++++++++++++++++++++++++++++---- 1 file changed, 118 insertions(+), 11 deletions(-) diff --git a/.github/CONTRIBUTING.md b/.github/CONTRIBUTING.md index 474610e..29d26df 100644 --- a/.github/CONTRIBUTING.md +++ b/.github/CONTRIBUTING.md @@ -1,18 +1,125 @@ # Contributing to Sipe Design System -We love your input! We want to make contributing to this project as easy and transparent as possible. This document outlines the process for contributing to our component library. +Welcome to our project! +We want to make contributing to **Side (Sipe Design System)** as straightforward and transparent as possible. +This document provides a clear guide to help you get started and contribute effectively. + +### What is Side? +Side refers to the Sipe Design System, our primary UI component library aimed at creating consistent and reusable interfaces. + +--- ## Getting Started -1. Fork the repository -2. Clone your fork: `git clone https://github.com/your-username/3-2_side.git` -3. Install dependencies: `pnpm install` +### Fork and Clone the Repository +First, fork the [repository](https://github.com/sipe-team/3-2_side) and then clone it locally: +```sh +git clone https://github.com/your-username/3-2_side.git +``` + +### Install Dependencies +Install the necessary dependencies: +```sh +pnpm install +``` + +--- + +## Developing + +### Create New Components +Use the CLI to create new components. The generated components will be placed under the `packages/` directory: +```sh +pnpm create:component +``` + +- **Naming Convention:** Use kebab-case for component names (e.g., `my-button`). +- **Styling:** Prioritize using predefined styles from the `tokens` package. + +### Testing +We use **Vitest** for testing. +All new features or changes must include **relevant test cases**. + +```sh +pnpm test +``` +**Minimum Testing Requirements:** +- Cover all primary use cases. +- Ensure edge cases are tested. + +### Storybook +We use **Storybook** for visual testing of components. +All components must include Storybook documentation. +Run the following command to view your components at `http://localhost:6006`: +```sh +pnpm dev:storybook +``` + +--- + +## How to Propose Changes +Before proposing changes, please **open an issue** to discuss the bug or feature. + +### Create a Pull Request + +1. **Create a Branch** + Follow the branch naming convention: `/-` (`ISSUENUMBER` is optional) + ```sh + git checkout -b your-branch + ``` + + | **Category** | **Description** | + |--------------|-----------------------------------------------------| + | **feat** | Developing a new feature | + | **fix** | Fixing a bug | + | **hotfix** | Emergency fixes for immediate release | + | **chore** | Maintenance tasks or minor updates | + | **refactor** | Code refactoring without functional changes | + | **release** | Preparing for a new release version | + | **test** | Writing or modifying test cases | + | **docs** | Documentation updates or additions | + | **ci** | CI/CD pipeline updates | + | **build** | Changes to the build system or dependencies | + +2. **Commit Changes** + Write meaningful commit messages using the [Conventional Commits](https://www.conventionalcommits.org/) format: + ```sh + git commit -m "(): " + ``` + We recommend following the Conventional Commits standard for clear and consistent commit messages. Below is the suggested structure: + + | Element | Requirement | Description | + |--------------|--------------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------| + | `` | **Required** | Describes the purpose of the commit. Examples: `feat`, `fix`, `docs`, `style`, `refactor`, `test`. | + | `` | **Optional** | Specifies the affected module, file, or functionality. Limited to **20 characters** (e.g., `auth`, `header`). | + | `` | **Required** | A concise summary of the changes:
- Starts with a lowercase letter.
- Avoid ending with a period (`.`).
- Limited to **50 characters**. - Written in **English**. | + + + +3. **Push Changes** + Push the branch to your forked repository: + ```sh + git push -u origin HEAD + ``` + +4. **Submit Pull Request (PR)** + - Follow the PR template. + - Provide a detailed description of your changes. + +### Code Review & Feedback +- Address feedback from reviewers promptly. +- Push additional commits directly to the PR branch. + +--- + +## Issue Reporting + +We use **GitHub Issues** to track and manage problems and discussions. +Please register your issue so we can discuss and decide on the next steps. -## Creating a New Component +### Bug Reporting +- Check if a similar issue already exists. +- Clearly describe **reproduction steps**, **expected results**, and **actual results**. -1. Copy the [.templates/component](.templates/component) folder to `packages/your-component-name` -2. Follow the test-driven development process: - - Write test cases first in `src/Component.test.tsx` - - Implement the component to pass the tests - - Create stories in Storybook for documentation -3. Run the test suite: `pnpm test` \ No newline at end of file +### Feature Suggestions +- Describe the purpose and expected outcome of the feature in detail.