Ecosyste.ms: Awesome

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

Awesome Lists | Featured Topics | Projects

https://github.com/techemprez/crypto_metrics

This is a mobile web application used to check a list of crypto-currency metrics. It is created using the coinstats API, which retrives data such as, names of cryptos, logos, current amount and as well as related website url. The webapp have several pages which includes the "Home page" with a list of items that could be filtered by some parameters.
https://github.com/techemprez/crypto_metrics

Last synced: about 1 month ago
JSON representation

This is a mobile web application used to check a list of crypto-currency metrics. It is created using the coinstats API, which retrives data such as, names of cryptos, logos, current amount and as well as related website url. The webapp have several pages which includes the "Home page" with a list of items that could be filtered by some parameters.

Awesome Lists containing this project

README

        

# crypto_metrics

## Description

In this task, Crypto-Metrics: This is a mobile web application used to check a list of crypto-currency metrics. It is created using the coinstats API, which retrives data such as, names of cryptos, logos, current amount and as well as related website url. The webapp have several pages which includes the "Home page" with a list of items that could be filtered by some parameters; in the project, it's a list of metrics that can be filtered by the coin name and a "Details page" with more information about a selected coin.

# Built with


  • HTML

  • CSS

  • Bootstrap

  • React

  • Redux

  • Webpack

  • Jest

# Prerequisites


  • VSCode

  • Git

  • Browser With Developer Tools

## Interested in viewing the webpage:

[Live Demo](https://techemprez-crypto-metrics.netlify.app/)

# Presentation Recording

[View](https://www.loom.com/share/244b4c343b7348dc98d2d78b86e17bd0)

# Home Page

- image

# Crypto Page

- image

# Mobile view for home Page

- image

## Available Scripts

After cloning `git clone https://github.com/techEmprez/crypto_metrics.git` this directory from Github;
You can run this project via:

### `npm install` to install project dependencies.

### `npm start` to open the development server.

# Project Setup

1. Setup the project by creating a new directory.
2. Set up the repository on GitHub and use Gitflow.
3. Set up React using ### `npx create-react-app .`
4. Install [React Redux](https://react-redux.js.org/), [Redux Logger](https://www.npmjs.com/package/redux-logger) and [React Router](https://reactrouter.com /web/guides/quick-start).
5. Create routes on each components and view components.
6. Fetch data and update Redux store.
7. Render fetch data for the first time only.
8. Write actions and reducers for canceling rockets and leaving missions
9. Render UI: My Profile section
10. Implemented jest test to the project.

# Run Tests

Use `npm test a` to run all the Jest test.

//To return to the top page

(back to top)

# Authors :bookmark_tabs:

👤 **Choice Osobor**

- GitHub: [@githubhandle](https://github.com/techEmprez)
- Twitter: [@twitterhandle](https://twitter.com/Suigeneriz_)
- LinkedIn: [Choice Osobor](https://www.linkedin.com/in/choice-osobor/)

## 📝 License

This project is MIT licensed.

## Acknowledgement

This project gives appropriate credit to [Nelson Sakwa](https://www.behance.net/sakwadesignstudio) the [author of the original design](

# crypto_metrics

## Description

In this task, Crypto-Metrics, is a mobile web application used to check a list of crypto-currency metrics. It is created using the coin stats API, which retrieves data such as names of cryptos, logos, current amount, and related website URL. The webapp has several pages, which include the "Home page" with a list of items that could be filtered by some parameters; in the project, it's a list of metrics that can be filtered by the coin name; and a "Details page" with more information about a selected coin.

# Built with


  • HTML

  • CSS

  • Bootstrap

  • React

  • Redux

  • Webpack

  • Jest

# Prerequisites


  • VSCode

  • Git

  • Browser With Developer Tools

## Interested in viewing the webpage:

[Live Demo](https://techemprez-crypto-metrics.netlify.app/)

# Presentation Recording

[View](https://www.loom.com/share/244b4c343b7348dc98d2d78b86e17bd0)

# Home Page

- image

# Crypto Page

- image

# Mobile view for home Page

- image

## Available Scripts

After cloning `git clone https://github.com/techEmprez/crypto_metrics.git` this directory from Github;
You can run:

### `npm install` to install project dependencies.

### `npm start` to open the development server.

(back to top)

# Project Setup

1. Setup the project by creating a new directory.
2. Set up the repository on GitHub and use Gitflow.
3. Set up React using ### `npx create-react-app .`
4. Install [React Redux](https://react-redux.js.org/), [Redux Logger](https://www.npmjs.com/package/redux-logger) and [React Router](https://reactrouter.com /web/guides/quick-start).
5. Create routes and view components.
6. Fetch data and update Redux store.
7. Render fetch data for the first time only.
8. Write actions and reducers for canceling rockets and leaving missions
9. Render UI: My Profile section
10. Implemented jest test to the project.

# Run Tests

Use `npm test a` to run all the Jest test.

(back to top)

# Authors :bookmark_tabs:

👤 **Choice Osobor**

- GitHub: [@githubhandle](https://github.com/techEmprez)
- Twitter: [@twitterhandle](https://twitter.com/techEmprez)
- LinkedIn: [Choice Osobor](https://www.linkedin.com/in/choice-osobor/)

## 📝 License

This project is MIT licensed.

## Acknowledgement

This project gives appropriate credit to [Nelson Sakwa](https://www.behance.net/sakwadesignstudio) the [author of the original design](https://www.behance.net/gallery/31579789/Ballhead-App-(Free-PSDs)).

# Contributing :handshake:

Contributions, issues, and feature request are welcome anytime.