Ecosyste.ms: Awesome

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

Awesome Lists | Featured Topics | Projects

https://github.com/ashmalzahra/stocks-metrics

This React capstone project is about building a mobile web application to check a list of Company Stocks metrics (numeric values) created making use of React and Redux.
https://github.com/ashmalzahra/stocks-metrics

best-practices events integration-testing react react-life-cycle react-router react-testing-library redux redux-thunk styles

Last synced: about 1 month ago
JSON representation

This React capstone project is about building a mobile web application to check a list of Company Stocks metrics (numeric values) created making use of React and Redux.

Host: GitHub
URL: https://github.com/ashmalzahra/stocks-metrics
Owner: ashmalzahra
License: mit
Created: 2023-03-13T21:08:13.000Z (almost 2 years ago)
Default Branch: develop
Last Pushed: 2023-04-13T22:53:02.000Z (almost 2 years ago)
Last Synced: 2024-12-06T03:44:55.998Z (about 2 months ago)
Topics: best-practices, events, integration-testing, react, react-life-cycle, react-router, react-testing-library, redux, redux-thunk, styles
Language: JavaScript
Homepage:
Size: 1.56 MB
Stars: 0
Watchers: 1
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md
- License: LICENSE

Awesome Lists containing this project

README

        

# 📗 Table of Contents

- [📖 About the Project](#about-project)

  - [🛠 Built With](#built-with)

  - [🚀 Live Demo ](#-live-demo-)

    - [Key Features](#key-features)

- [💻 Getting Started](#getting-started)

  - [Setup](#setup)

  - [Run tests](#run-tests)

- [👥 Authors](#authors)

- [🔭 Future Features](#future-features)

- [🤝 Contributing](#contributing)

- [⭐️ Show your support](#support)

- [🙏 Acknowledgements](#acknowledgements)

- [📝 License](#license)**

# 📖 Stocks Metrics webapp

This React capstone project is about building a mobile web application to check a list of metrics (numeric values) that are created using React and Redux. The webapp has several pages:

 - one page with a list of Companies that could be filtered by Company Symbol. This page is the homepage.

 - one page for the item details; in the project, the detail page for each selected Company with its stock info.

 - one about page.

## Built With

- React.js

- Redux Toolkit

- VSCode and GitHub

- [Financial modeling prep API: Stock Data](https://site.financialmodelingprep.com/developer/docs/) 

### Tech Stack 

  Client

  


    

React to create the UI.

    

Redux Toolkit to manage state.

    

Tailwindcss to apply awesome styles.

  


  Server

  


    Financial Modeling Prep API

  


Database

  


    N/A

  


(back to top)


### Key Features

- **[Git Flow]**

- **[React Router]**

- **[Unit tests with React Testing Library]**

(back to top)


## Live Demo

[Live Demo Link](https://stocks-metrics-api.netlify.app/)

## 💻 Getting Started

Clone this repository to get started with the project, make sure to configure linters by following the instructions in the [Linters README file](https://github.com/microverseinc/linters-config/blob/master/README.md)

### Prerequisites

In order to run this project you need:

- A working computer.

- Connection to internet.

- [npm](https://www.npmjs.com/) and [Node.js](https://nodejs.org/en/) installed, if you don't have them, please follow this [simple installation guide](https://docs.npmjs.com/downloading-and-installing-node-js-and-npm).

### Setup

- Clone the folder to your local machine.

- Open a local copy of the project in your code editor.

(back to top)


### Usage

- To run the project, execute the following command:

    - npm start in your terminal.

- To run test functions, execute the following command:

    - npm test in your terminal.

(back to top)


### Run tests

- After pushing the changes on github, merge your pull request and let github action process changes and fix errors, if any.

  - For stylelint errors run:npx stylelint "**/*.{css,scss}" --fix for automatic fix.

  - For ESLINT errors run:npx eslint "**/*.{js,jsx}" --fix for automatic fix.

(back to top)


## 👥 Authors

👤 **Ashmal Zahra**

- GitHub: [@ashmalzahra](https://github.com/ashmalzahra)

- Twitter: [@AshmalZahraa](https://twitter.com/AshmalZahraa)

- LinkedIn: [ashmal-zahra](https://www.linkedin.com/in/ashmal-zahra)

(back to top)


## 🔭 Future Features 

- [ ] **Advanced styling**

- [ ] **Animations**

## 🤝 Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the [issues page](https://github.com/ashmalzahra/stocks-metrics/issues).

(back to top)


## ⭐️ Show your support

Give a ⭐️ if you like this project!

(back to top)


## 🙏 Acknowledgments 

Original design idea by [Nelson Sakwa on Behance](https://www.behance.net/sakwadesignstudio).

(back to top)

  

## ❓ FAQ (OPTIONAL) 

- **Can I use the project for any purpose?**

  - Yes, you can.

- **Is the information saved in any database?**

  - No, all data is fetched from API.

(back to top)


## 📝 License

This project is [MIT](./LICENSE) licensed.

(back to top)