Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/skyv26/stats-preview-component
Frontend Mentor challenge undertaken to master web development using React.js and Styled Components. Cutting-edge stats preview component showcasing key metrics, visually engaging design, and responsive layout. Developed with React.js and Styled Components, highlighting technical prowess and ability to create captivating and user-friendly.
https://github.com/skyv26/stats-preview-component
bem-methodology challenge-project newbie-code reactjs responsive-web-design styled-components
Last synced: about 22 hours ago
JSON representation
Frontend Mentor challenge undertaken to master web development using React.js and Styled Components. Cutting-edge stats preview component showcasing key metrics, visually engaging design, and responsive layout. Developed with React.js and Styled Components, highlighting technical prowess and ability to create captivating and user-friendly.
- Host: GitHub
- URL: https://github.com/skyv26/stats-preview-component
- Owner: skyv26
- License: other
- Created: 2021-12-18T15:53:34.000Z (about 3 years ago)
- Default Branch: main
- Last Pushed: 2023-06-19T09:24:39.000Z (over 1 year ago)
- Last Synced: 2025-01-19T04:49:34.498Z (24 days ago)
- Topics: bem-methodology, challenge-project, newbie-code, reactjs, responsive-web-design, styled-components
- Language: JavaScript
- Homepage: https://skystats.netlify.app/
- Size: 462 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
Stats Preview Card Component
# 📗 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)
- [Prerequisites](#prerequisites)
- [Setup](#setup)
- [Install](#install)
- [Usage](#usage)
- [Deployment](#deployment)
- [👥 Authors](#authors)
- [🔭 Future Features](#future-features)
- [🤝 Contributing](#contributing)
- [⭐️ Show your support](#support)
- [🙏 Acknowledgements](#acknowledgements)
- [📝 License](#license)
# 📖 Stats preview card component
**Stats preview card component** is a professional, tech-focused React.js project from Frontend Mentor, leveraging Styled Components to create visually engaging data visualization and offering valuable insights for empowered decision-making as an employee.
Client
- **Styled Components**
- **SC String Approach**
- **SC Object Approach**
- [Live Demo](https://skystats.netlify.app/)
To get a local copy up and running, follow these steps.
### Prerequisites
In order to run this project you need:
```sh
yarn install
```
OR
```sh
npm i
```
### Setup
Clone this repository to your desired folder:
```sh
cd DESIRED_FOLDER_PATH
git clone [email protected]:skyv26/stats-preview-component.git
```
### Build
Build this project with:
```sh
yarn build
```
OR
```sh
npm build
```
### Usage
To run the project, execute the following command:
Example command:
```sh
yarn start
```
OR
```sh
npm start
```
### Deployment
You can deploy this project using any online website deployment platform like gh-pages, vercel, netlify, railways.app or render.
👤 **Aakash Verma**
- GitHub: [@skyv26](https://github.com/skyv26)
- Twitter: [@vrma_aakash](https://twitter.com/vrma_aakash)
- LinkedIn: [skyv2022](https://linkedin.com/in/skyv2022)
- Frontend Mentor: [@skyv26](https://www.frontendmentor.io/profile/skyv26)
- [ ] **Make it dynamic**
Contributions, issues, and feature requests are welcome!
Feel free to check the [issues page](../../issues/).
If you like this project, please support me by giving a star.
I would like to thank [Frontend Mentor](https://www.frontendmentor.io)
This project is [MIT](./LICENSE) licensed.