Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/fmanimashaun/hello-react-front-end
This is a simple React application that displays a random greeting message using redux-toolkit and react-router and rail api-only backend.
https://github.com/fmanimashaun/hello-react-front-end
api react-redux react-router reactjs rtk
Last synced: 14 days ago
JSON representation
This is a simple React application that displays a random greeting message using redux-toolkit and react-router and rail api-only backend.
- Host: GitHub
- URL: https://github.com/fmanimashaun/hello-react-front-end
- Owner: fmanimashaun
- License: mit
- Created: 2024-02-09T12:50:31.000Z (9 months ago)
- Default Branch: dev
- Last Pushed: 2024-02-10T07:39:03.000Z (9 months ago)
- Last Synced: 2024-10-09T07:41:30.303Z (about 1 month ago)
- Topics: api, react-redux, react-router, reactjs, rtk
- Language: JavaScript
- Homepage:
- Size: 412 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Hello React Front-end
# 📗 Table of Contents
- [📖 About the Project](#about-project)
- [🛠 Built With](#built-with)
- [Tech Stack](#tech-stack)
- [Key Features](#key-features)
- [🚀 Live Demo](#live-demo)
- [💻 Getting Started](#getting-started)
- [Setup](#setup)
- [Prerequisites](#prerequisites)
- [Install](#install)
- [Usage](#usage)
- [👥 Authors](#authors)
- [🔭 Future Features](#future-features)
- [🤝 Contributing](#contributing)
- [⭐️ Show your support](#support)
- [🙏 Acknowledgements](#acknowledgements)
- [❓ FAQ (OPTIONAL)](#faq)
- [📝 License](#license)
This is a simple React application that displays a random greeting message using redux-toolkit and react-router and rail api-only backend.
- [React](https://reactjs.org/)
- [React Router Dom](https://reactrouter.com/web/guides/quick-start)
- [React Redux](https://react-redux.js.org/)
- [Redux-toolkit](https://redux-toolkit.js.org/)
- [Axios](https://axios-http.com/)
- [x] **Random Greeting:** Displays a random greeting message from a selection of 5 different greetings stored in the database.
- [x] **React Components:** Uses React to create dynamic UI components.
- [x] **API Endpoint:** Includes an API endpoint that selects a random greeting from the database.
- [x] **Redux Store:** A store, an action, and a reducer are created that connect to the API endpoint to get the random greeting.
- [Backend Repo Link](https://github.com/fmanimashaun/hello-rails-back-end)
- [Optional] Install git bash to your machine to enable you to clone this repo.
- install Visual Studio to be able to host a local live version.
- Install a browser to view the local live version.
To get a local copy up and running follow these simple example steps.
### Setup
Clone this repository to your desired folder:
```sh
cd your-desired-folder
git clone https://github.com/fmanimashaun/hello-react-front-end.git
open the repo folder `hello-react-front-end`
```
Install this project dependencies with:
```sh
npm install
```
To run the project, execute the following command:
```sh
npm run start
```
Runs the app in the development mode.\
Open [http://localhost:3000](http://localhost:3000) to view it in your browser.
The page will reload when you make changes.\
👤 **Engr. Animashaun Fisayo**
- [GitHub](https://github.com/fmanimashaun)
- [Twitter](https://twitter.com/fmanimashaun)
- [LinkedIn](https://www.linkedin.com/in/fmanimashaun/)
- [Website](https://fmanimashaun.com)
- [ ] Display a list of all cryptocurrencies and their respective rankings in the global cryptocurrency market.
- [ ] Click on a cryptocurrency to view more detailed information about it.
- [ ] The app enables users to search for specific cryptocurrencies easily.
- [ ] View real-time cryptocurrency data using the app's integration with the CoinGecko API.
Contributions, issues, and feature requests are welcome!
Feel free to check the [issues page](../../issues/).
If you like this project and want to support me, you can give a ⭐️ to this repo!
I would like to thank [Microverse](https://www.microverse.org/) for giving me this opportunity to learn and build this project. And also, I would like to thank [Nelson Sakwa](https://www.behance.net/sakwadesignstudio) on Behance for providing the design of this project.
- **How is the ranking of the cryptocurrency exchanges determined?**
- The ranking of the exchanges is determined based on their trading volume, as reported by the CoinGecko API, which aggregates data from various sources. The app ranks the exchanges by their trading volume over a 24-hour period.
- **Can I search for specific exchanges on the app?**
- Yes, you can! The app includes a search bar that allows you to search for exchanges by name. Simply type in the name of the exchange you're looking for, and the app will display a list of all exchanges that match your search query.
This project is [MIT](./LICENSE) licensed.