Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update README.md #179

Merged
merged 1 commit into from
Oct 24, 2023
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
55 changes: 29 additions & 26 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,57 +1,60 @@
## Quotes-Generator
# Quotes-Generator

This is a website for generating random quotes which can be tweeted. It uses basic HTML, CSS, and JS with a few helpful packages.
This is a website for generating random quotes which can then be tweeted. This is built with basic HTML, CSS, and JS with a few helpful packages.

`Generate` : picks text and an author out of a list of quotes. (from the quotes.js file)

`Generate` button: picks text and author out of a list of quotes from quote.js
`tweet this` : redirects you to a tweet text box url with the quote that was generated.

`tweet this`. redirect you to tweet text box url with the quote you generated
`copy` : copies the current quote to your clipboard.

`copy` button: qoute basically copies the current quote
`Download` : uses the package [npm-text-image](https://www.npmjs.com/package/text-image) to capture and format the quote to image/png and saves it to your local storage.

`Download` button: uses the package [npm-text-image](https://www.npmjs.com/package/text-image) to capture and format the quote to image/png and saves it to your local storage.

Please give this project a star 🌟 and don't forget to follow me 😊.
**Please give this project a star 🌟 and don't forget to follow me 😊.**

## Interested in Contributions?
If you are looking to make your first contribution, follow the steps below.
Check the CONTRIBUTING.md file if you are already familiar with the git workflow.

<img align="right" width="300" src="https://firstcontributions.github.io/assets/Readme/fork.png" alt="fork this repository" />
Check the *CONTRIBUTING.md* file if you are already familiar with the git workflow.

#### If you don't have git on your machine, [install it](https://help.github.com/articles/set-up-git/).
*If you don't have git on your machine, [you can install it here](https://help.github.com/articles/set-up-git/).*

<img align="right" width="300" src="https://firstcontributions.github.io/assets/Readme/fork.png" alt="fork this repository" />

## Fork this repository
## Step 1: Fork This Repository

Fork this repository by clicking on the fork button on the top of this page.

This will create a copy of this repository in your account.

## Clone the repository

<img align="right" width="300" src="https://firstcontributions.github.io/assets/Readme/clone.png" alt="clone this repository" />
## Step 2: Clone The Repository

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.
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.

<img align="right" width="300" src="https://firstcontributions.github.io/assets/Readme/clone.png" alt="clone this repository" />

Open a terminal and run the following git command:

```
git clone "url you just copied"
git clone (place copied text here)
```

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.
Place the url to this repository (your fork of this project) in the `(place copied text here)` spot, don't keep the parenthesis.

<img align="right" width="300" src="https://firstcontributions.github.io/assets/Readme/copy-to-clipboard.png" alt="copy URL to clipboard" />

For example:
**For example:**

```
git clone https://github.com/this-is-you/Quotes-Generator.git
```

where `this-is-you` is your GitHub username. Here you're copying the contents of the Quotes-Generator repository on GitHub to your computer.

## Create a branch
## Step 3: Create a Branch

Change to the repository directory on your computer (if you are not already there):
If you're not already there, change to the repository's directory in your terminal:

```
cd Quotes-Generator
Expand All @@ -63,17 +66,17 @@ Now create a branch using the `git checkout` command:
git checkout -b your-new-branch-name
```

For example:
**For example:**

```
git checkout -b add-whatever-you-want
```

## Make necessary changes and commit those changes
## Step 4: Making and Committing Changes

<img align="right" width="450" src="https://firstcontributions.github.io/assets/Readme/git-status.png" alt="git status" />

If you go to the project directory and execute the command `git status`, you'll see there are changes.
If you go to the project directory and execute the command `git status`, you'll see that there are changes.

Add those changes to the branch you just created using the `git add` command:

Expand All @@ -87,7 +90,7 @@ Now commit those changes using the `git commit` command:
git commit -m "Add <...>"
```

## Push changes to GitHub
## Step 5: Push Changes to GitHub

Push your changes using the command `git push`:

Expand All @@ -97,9 +100,9 @@ git push origin -u <add-your-branch-name>

replacing `<add-your-branch-name>` with the name of the branch you created earlier.

## Submit your changes for review
## Step 6: Submit Your Changes for Review

If you go to your repository on GitHub, you'll see a `Compare & pull request` button. Click on that button.
If you go to your repository on GitHub, you'll see a `compare & pull request` button. Click on that button.

<img style="float: right;" src="https://firstcontributions.github.io/assets/Readme/compare-and-pull.png" alt="create a pull request" />

Expand Down