Metrics React App

📗 Table of Contents

• 📖 About the Project
  • 🛠 Built With
    • Tech Stack
    • Key Features
  • 🚀 Live Demo
• 💻 Getting Started
  • Setup
  • Prerequisites
  • Install
  • Usage
  • Run tests
  • Deployment
• 👥 Authors
• 🔭 Future Features
• 🤝 Contributing
• ⭐️ Show your support
• 🙏 Acknowledgements
• 📝 License

📖 Metrics React App

Metrics React App is a web application to check a list of metrics fetched from an API. It was coded using React and Redux.

🛠 Built With

Tech Stack

This project was developed using the following stack:

Client

• React.js
• HTML 5
• CSS 3
• JavaScript

Key Features

We implement the following features:

• The app shows a list of categories.
• User can filter out the list by a parameter
• When the user clicks (or taps) on a category item, the application navigates to the details page

(back to top)

🚀 Live Demo

Click in the following link to see a working live version of this project:

• Metrics React App

Click in the following link to see a video presentation of the features:

• Presentation

(back to top)

💻 Getting Started

To get a local copy up and running, follow these steps.

Prerequisites

In order to run this project you need to have installed:

• You’ll need to have Node >= 14.0.0 and npm >= 5.6 on your machine and Yarn.

Optionally, in order to modify this project you should to have installed:

• Git.

• Code editor like: Visual Studio code, Sublime text or others...

Setup

To clone this repository to your desired folder:

• You can download the Zip file from the GitHub repository, or clone the repository with:

git clone https://github.com/elafildecolor/metrics-react-app.git

• Access the cloned directory with:

cd metric-react-app

• Open it with your favorite code editor or with the live server

Install

To install run:

yarn

Usage

To run the project, execute the following command in the project directory:

yarn dev

Runs the app in the development mode.
Open http://localhost:5173 to view it in your browser.

The page will reload when you make changes.
You may also see any lint errors in the console.

Run tests

To run tests, run the following command:

  yarn test

Launches the test runner in the interactive watch mode.

Build

To build the project, run the following command:

  yarn build

Builds the app for production to the dist folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

See the section about deployment for more information.

Deployment

You can read more about deployment in the following link:

Deploy a React application

(back to top)

👥 Authors

👤 Paul Sáenz Sucre

• GitHub: @elafildecolor
• Twitter: @paulsaenzsucre
• LinkedIn: LinkedIn

(back to top)

🔭 Future Features

Will implement these features in the future:

• The app has a About Me page
• The app has a References page

(back to top)

🤝 Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page.

(back to top)

⭐️ Show your support

Give a ⭐️ if you like this project!

(back to top)

🙏 Acknowledgments

• This work, "METRIC REACT APP", is a web page implementation of "Ballhead App" by Nelson Sakwa, used under CC BY 4.0.
• Hat tip to anyone whose code was used.
• Thanks for all the curated content that was provided to us.
• Thanks to my learning and coding partners for all their support.

(back to top)

📝 License

This project is MIT licensed.

(back to top)