Skip to content

Commit

Permalink
Merge pull request ArslanYM#307 from ayush-chandil/ayush-chandil-patch-1
Browse files Browse the repository at this point in the history
Updated readme.md for Web Folder ArslanYM#85
  • Loading branch information
ArslanYM authored Aug 21, 2023
2 parents ce48c56 + 4db10e1 commit 4f7be54
Showing 1 changed file with 46 additions and 48 deletions.
94 changes: 46 additions & 48 deletions web/README.md
Original file line number Diff line number Diff line change
@@ -1,34 +1,35 @@
# Contributing to a React Project Built with Vite
# Contributing to a Vite-Powered React Project πŸš€

- This guide will walk you through the steps to contribute to a React project built with Vite. Vite is a fast and lightweight development server and build tool that is designed to optimize the development experience for modern web applications. By following these steps, you will be able to make changes and submit your contributions to the project.
Welcome to our open-source React project, which is powered by Vite! This guide will assist you in navigating the contribution process, ensuring a smooth and productive experience. Let's dive right in! πŸ› οΈ

## Prerequisites
Before you begin, make sure you have the following software installed on your system:
## Prerequisites πŸ“‹

- Git: Version control system. [Link](https://git-scm.com/downloads/)
- Node.js: JavaScript runtime. [Link](https://nodejs.org/en/download)
- npm: Node Package Manager (comes with Node.js installation)
Before you get started, please ensure that your system has the following software installed:

- **Git**: A version control system. [You can download it here](https://git-scm.com/downloads/) πŸ§‘β€πŸ’»
- **Node.js**: A JavaScript runtime. [You can download it here](https://nodejs.org/en/download) 🟒
- **npm**: The Node Package Manager, which comes included with the Node.js installation πŸ“¦

## Contributing
Following are the steps to guide you:

### Step 1
- Fork this repository
## Contributing 🀝

![fork](https://github.com/ArslanYM/StarterHive/assets/104521101/b2863384-753d-448b-9c8f-cc2122121c2b)
### Step 1: Fork the Repository 🍴

![Fork](https://github.com/ArslanYM/StarterHive/assets/104521101/b2863384-753d-448b-9c8f-cc2122121c2b)

### Step 2:
- Now clone the forked repository to your machine. Go to your GitHub account, open the forked repository, click on the code button and then click the copy to clipboard icon.
- Start by forking this repository. Simply click the "Fork" button located in the top right corner of this page. πŸš€

![clone](https://github.com/ArslanYM/StarterHive/assets/104521101/ffe2cb3b-d7e9-41fb-a7e6-8f5ca9d50dd0)

Open a terminal and run the following git command:
### Step 2: Clone Your Fork πŸ“‚

![Clone](https://github.com/ArslanYM/StarterHive/assets/104521101/ffe2cb3b-d7e9-41fb-a7e6-8f5ca9d50dd0)

- Next, clone your forked repository to your local machine. Go to your GitHub account, open the forked repository, click the "Code" button, and copy the repository's URL. Then, open your terminal and execute the following command:

```
git clone "url you just copied"
git clone "URL you just copied"
```
where "url you just copied" (without the quotation marks) is the url to this repository (your fork of this project). See the previous steps to obtain the url.
Replace "URL you just copied" with the URL you obtained from your forked repository. πŸ–₯️

![opy](https://github.com/ArslanYM/StarterHive/assets/104521101/5947298f-dd52-478c-9cd9-f22791eea4a5)

Expand All @@ -38,76 +39,73 @@ git clone https://github.com/{your user name}/StarterHive.git
```


### Step 3:
- Navigate to StarterHive/web on your device
### Step 3: Navigate to the Project Directory πŸ“
- Change your terminal's current directory to the project's "web" folder:

```
cd StaterHive/
```
```
cd web/
cd StaterHive/web
```

### Step 4: Install Dependencies

### Step 4: Install Dependencies πŸ“¦

In the web directory, install the required dependencies by running the following command:

```
npm install
```
This will download and install all the necessary packages specified in the project's package.json file.
This command will download and install all the packages specified in the project's package.json file. πŸ“₯

### Step 5: Create a New Branch
Create a new branch to work on your changes. It is recommended to create a branch with a descriptive name that reflects the purpose of your changes. Use the following command to create a new branch:
### Step 5: Create a New Branch 🌿
Create a new branch for your work. It's best to choose a branch name that clearly reflects the purpose of your changes. Use the following command:

```
git checkout -b my-feature
```

- Replace my-feature with a meaningful name for your branch.

### Step 6: Make and Test Your Changes
Make the necessary changes to the project code using your preferred code editor.
- Replace "my-feature" with a descriptive branch name. 🌟

Run the project locally to test your changes using the following command:
### Step 6: Make and Test Your Changes ✍️
Now, you can make the necessary code adjustments using your preferred code editor. To test your changes locally, run the project with:

```
npm run dev
```
This command starts the development server and builds the project. Open your web browser and visit the provided URL to see the project running.

Test your changes thoroughly to ensure they are working as expected.
This command initiates the development server and builds the project. Open your web browser and visit the provided URL to observe your changes. Thoroughly test to ensure everything functions as expected. βœ…

### Step 7: Commit and Push Your Changes
Once you are satisfied with your changes, it's time to commit them. Use the following command to stage your changes:
### Step 7: Commit and Push Your Changes β˜‘οΈ
Once you're satisfied with your changes, it's time to commit them. First, stage your changes with:

```
git add .
```

- This command adds all the modified files to the staging area.
- This command stages all modified files.

- Commit your changes with a descriptive commit message:
- Commit your changes with a descriptive message:

```
git commit -m "Add my feature"
```
- Replace "Add my feature" with a brief description of the changes you made.
- Replace "Add my feature" with a brief description of your changes. πŸ“

- Push your changes to your forked repository:

```
git push origin my-feature
```
- Replace my-feature with the name of your branch.
- Replace "my-feature" with the name of your branch. 🚒

### Step 8: Create a Pull Request(PR) πŸš€
Head over to the main repository on GitHub. You should see a message indicating that you've recently pushed a branch. Click on the "Compare & pull request" button. πŸ”„

![image](https://github.com/ayush-chandil/StarterHive/assets/74442358/5b4e4724-0d55-492c-9fb9-c52d690d730d)

### Step 7: Create a Pull Request
Go to the repository page on GitHub.

You should see a message indicating that you recently pushed a branch. Click on the "Compare & pull request" button.
Review your changes and provide a meaningful title and comment for your pull request. πŸ’¬

Review your changes and provide a descriptive title and comment for your pull request.
Finally, click "Create pull request" to submit your contribution. πŸ“€

Click on the "Create pull request" button to submit your contribution.
Congratulations! You've successfully contributed to our Vite-powered React project. Our project maintainers will review your pull request. πŸŽ‰

Congratulations! You have successfully contributed to the React project built with Vite. The project maintainers will review your
Thank you for your valuable contribution! πŸ‘

0 comments on commit 4f7be54

Please sign in to comment.