Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/claudiarojassoto/random_quote_machine

🔍 Discover insights and inspiring thoughts with just one click. Get quotes from renowned authors and instantly share your favorites on Twitter.
https://github.com/claudiarojassoto/random_quote_machine

actions api components react reducers redux store useeffect

Last synced: 19 days ago
JSON representation

🔍 Discover insights and inspiring thoughts with just one click. Get quotes from renowned authors and instantly share your favorites on Twitter.

Awesome Lists containing this project

README

        



Random_Quote_Machine

# 📗 Table of Contents

- [📗 Table of Contents](#-table-of-contents)
- [📖 Random\_Quote\_Machine ](#-random_quote_machine-)
- [🛠 Built With ](#-built-with-)
- [Tech Stack ](#tech-stack-)
- [Key Features ](#key-features-)
- [🚀 Live Demo ](#-live-demo-)
- [💻 Getting Started ](#-getting-started-)
- [Project Structure](#project-structure)
- [Setup](#setup)
- [Install](#install)
- [Usage](#usage)
- [Run tests](#run-tests)
- [👥 Authors ](#-authors-)
- [🔭 Future Features ](#-future-features-)
- [🤝 Contributing ](#-contributing-)
- [⭐️ Show your support ](#️-show-your-support-)
- [🙏 Acknowledgments ](#-acknowledgments-)
- [📝 License ](#-license-)

# 📖 Random_Quote_Machine

>Immerse yourself in the world of insights, wisdom and inspiring thoughts with our Random Quote Machine. At the click of a button, the app brings you a randomly selected quote from a vast collection of quotes from well-known authors from around the world. Plus, if a quote really resonates with you, you can instantly share it on Twitter! Whether it's for inspiration, reflection, or just enjoying a good date, our Random Quote Machine is here to brighten your day.
## 🛠 Built With

### Tech Stack

React-redux

HTML

CSS


  • The CSS is used to provide the design in the whole page.

Linters


  • The Linters are tools that help us to check and solve the errors in the code

  • This project count with two linters:

    • CSS

    • JavaScript


### Key Features

- **SPA**
- **CRA**
- **Styles**
- **Router**
- **Logged**
- **Toolkit**
- **React-Redux**
- **Jest & React Test Library**
- **Deployment**

(back to top)

## 🚀 Live Demo

> You can see a Demo [here](https://random-quote-machine-hcfj.onrender.com).

(back to top)

## 💻 Getting Started

> To get a local copy up and running, follow these steps.
> This project requires Node.js and npm installed on your machine.

> -Node.js
> -npm

> -Clone this repository to your local machine using:

> git clone https://github.com/ClaudiaRojasSoto/Random_Quote_Machine.git

> -Navigate to the project folder:

> cd math_magicians

> -Install the project dependencies:

> npm install

> To start the development server, run the following command:

> npm start

### Project Structure

> The project follows the following folder and file structure:

- `/src`: Contains the source files of the application.
- `/src/index.js`: Main entry point of the JavaScript application.
- `/src/App.js`: Top-level component of the application where components are rendered.
- `/src/components`: Directory for React components.
- `/src/components/quoteBox.js`: Component for the quoteBox.
- `/src/components/quoteBox.css`: Styles for the quote box.
- `/src/components/quoteButtons.js`: Folder for the quote buttons.
- `/src/components/navbar/quoteButtons.css`: Styles for the quote Buttons.
- `/src/redux`: Directory for Redux management.
- `/src/redux/store.js`: Redux store configuration.
- `/src/redux/actions`: Folder for Redux actions.
- `/src/redux/actions/quoteActions.js`: Actions for quote management.
- `/src/redux/reducers`: Folder for Redux reducers.
- `/src/redux/reducers/quoteReducer.js`: Reducer for quote management.
- `/public`: Contains the public files and assets of the application.
- `/public/index.html`: Base HTML file of the application.
- `/build`: Contains the generated production files.

### Setup

> Clone this repository to your desired folder: https://github.com/ClaudiaRojasSoto/Random_Quote_Machine.git

### Install

> Install this project with: install Stylelint and ESLint

### Usage

> To run the project, execute the following command: just need a web Browser

### Run tests

> To run tests, run the following command: npm start
> you just need a simple web browser to run this project for a test

## 👥 Authors

👤 **Claudia Rojas**

- GitHub: [@githubhandle](https://github.com/ClaudiaRojasSoto)
- LinkedIn: [LinkedIn](inkedin.com/in/claudia-rojas-soto)
- AngelList: [AngelList](https://wellfound.com/u/claudia-rojas-2)

(back to top)

## 🔭 Future Features

- **User keys - login**

(back to top)

## 🤝 Contributing

> Contributions, issues, and feature requests are welcome!

> Feel free to check the [issues page](https://github.com/ClaudiaRojasSoto/Random_Quote_Machine/issues).

(back to top)

## ⭐️ Show your support

> If you like this project show support by following this account

(back to top)

## 🙏 Acknowledgments

> - Microverse for providing the opportunity to learn Git and GitHub in a collaborative environment.

> - GitHub Docs for providing a wealth of information on Git and GitHub.

(back to top)

## 📝 License

> This project is [MIT](MIT.md).

(back to top)