Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/adel-gu/crypto-currency-market
A simple SPA consists of a home page that fetches and displays data about cryptocurrencies and their categories, and a details page where the user can interact with information about a specific cryptocurrency.
https://github.com/adel-gu/crypto-currency-market
react react-bootstrap react-icons react-router redux styled-components
Last synced: 4 days ago
JSON representation
A simple SPA consists of a home page that fetches and displays data about cryptocurrencies and their categories, and a details page where the user can interact with information about a specific cryptocurrency.
- Host: GitHub
- URL: https://github.com/adel-gu/crypto-currency-market
- Owner: adel-gu
- License: other
- Created: 2022-11-22T10:06:57.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2022-11-26T12:09:05.000Z (almost 2 years ago)
- Last Synced: 2023-05-06T05:29:19.777Z (over 1 year ago)
- Topics: react, react-bootstrap, react-icons, react-router, redux, styled-components
- Language: JavaScript
- Homepage: https://crypto-currency-info-app.netlify.app/
- Size: 1.92 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: license.md
Awesome Lists containing this project
README
Microverse README Template
# 📗 Table of Contents
- [📖 About the Project](#about-project)
- [🛠 Built With](#built-with)
- [Tech Stack](#tech-stack)
- [Key Features](#key-features)
- [🚀 Live Demo](#live-demo)
- [🐱👤 App Representation](#app-record)
- [💻 Getting Started](#getting-started)
- [Setup](#setup)
- [Prerequisites](#prerequisites)
- [Install](#install)
- [Usage](#usage)
- [Run tests](#run-tests)
- [👥 Authors](#authors)
- [🤝 Contributing](#contributing)
- [⭐️ Show your support](#support)
- [🙏 Acknowledgements](#acknowledgements)
- [📝 License](#license)> A simple SPA consists of a home page that fetches and displays data about cryptocurrencies and their categories, and a details page where the user can interact with information about a specific cryptocurrency.
> Used differently related react libraries to achieve the satisfied UI, React bootstrap and styled component for styling the UI, react icons to insert the app icons, and Redux to manage the app store system.
Client
- **Currencies Info:** Display Currencies with minimal information to the user.
- **Filter by category:** The User can control the information displayed on the home page by choosing a specific category.
- **Currency Details:** Navigate to a currency details page to see more info.
- **Navigating Back to the home page:** The user can use the top left button in the navigation bar to navigate back to the home page from the details page.
- [Watch me explaining some of the app features](https://www.loom.com/share/5ec0bb265c144520bef078587afb36fb)
[![image](https://user-images.githubusercontent.com/68030297/204081145-295856bf-e866-415f-b2d7-42a6501ee0d3.png)](https://crypto-currency-info-app.netlify.app/)
- [Experince a live demo](https://crypto-currency-info-app.netlify.app/)
## 💻 Getting Started
To get a local copy up and running, follow these steps.
### Prerequisites
In order to run this project you need:
- `node` should be installed in your local machin, [node website](https://nodejs.org/en/download/)
- Install `npm` package manager use this [to install both node and npm](https://docs.npmjs.com/downloading-and-installing-node-js-and-npm)
### Setup
Clone this repository to your desired folder:
```sh
cd my-folder
git clone [email protected]:adel-gu/crypto-currency-market.git
```
### Install
Install this project with:
```sh
cd crypto-currency-market
npm install
```
### Usage
To run the project, execute the following command:
```sh
npm run start
```
### Run tests
To run tests, run the following command:
```sh
npm run test
```
### Deployment
You can deploy this project using:
- Netlify
👤 **Adel Guitoun**
- GitHub: [@adel-gu](https://github.com/adel-gu)
- Twitter: [@GuitounAdel](https://twitter.com/@GuitounAdel)
- LinkedIn: [adelguitoun](https://linkedin.com/in/adelguitoun)
Contributions, issues, and feature requests are welcome!
Feel free to check the [issues page](../../issues/).
If you like this project please give it a Start ⭐️.
I would like to thank:
- [Nelson Sakwa](https://www.behance.net/sakwadesignstudio) for the website design system that inspired my design.
- [David Hu](https://www.davidhu.io/) for the loader spinner react components.
- [CoinGecko](https://www.coingecko.com/en/api/documentation) for the amazing API.
This project is [MIT](./License) licensed.