https://github.com/keepserene/crypto-screener-react-site
A crypto screener site powered by React.js, Tailwind CSS, & CoinGecko API
https://github.com/keepserene/crypto-screener-react-site
coingecko-api context-api crypto-screener lodash react18 recharts tailwindcss-v3 vercel-deployment
Last synced: 11 months ago
JSON representation
A crypto screener site powered by React.js, Tailwind CSS, & CoinGecko API
- Host: GitHub
- URL: https://github.com/keepserene/crypto-screener-react-site
- Owner: KeepSerene
- Created: 2025-02-06T20:10:11.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-02-17T12:09:01.000Z (over 1 year ago)
- Last Synced: 2025-04-05T23:14:03.183Z (about 1 year ago)
- Topics: coingecko-api, context-api, crypto-screener, lodash, react18, recharts, tailwindcss-v3, vercel-deployment
- Language: JavaScript
- Homepage: https://block-view-delta.vercel.app
- Size: 743 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# BlockView - Cryptocurrency Tracking Platform
BlockView is a modern, responsive, and accessible cryptocurrency tracking platform built with React. It provides real-time cryptocurrency data, market trends, and detailed analysis tools for crypto enthusiasts and investors.
## Screenshot
## Features
- **Real-time Cryptocurrency Data**: Track live prices, market caps, and volume data
- **Customizable Watchlist**: Save and monitor your favorite cryptocurrencies
- **Trending Cryptocurrencies**: View currently trending crypto assets
- **Detailed Analytics**: Access comprehensive price charts and market statistics
- **Responsive Design**: Fully responsive layout that works on all devices
- **Accessibility Features**:
- ARIA labels for screen readers
- Semantic HTML structure
- Keyboard navigation support
- Color contrast compliance
- **Search Functionality**: Search and filter cryptocurrencies with debounced API calls
- **Currency Conversion**: Support for multiple fiat currencies
- **Pagination**: Efficient data loading with paginated results
- **Error Handling**: Comprehensive error states and loading indicators
## Live Demo
[Play around](https://block-view-delta.vercel.app/)
## Technologies Used
- React 18
- React Router v6
- Tailwind CSS
- Recharts
- CoinGecko API
- Lodash
## Getting Started
1. Clone the repository:
```bash
git clone https://github.com/KeepSerene/crypto-screener-react-site.git
```
2. Install dependencies:
```bash
cd crypto-screener-react-site
npm install
```
3. Start the development server:
```bash
npm run dev
```
4. Build for production:
```bash
npm run build
```
## Project Structure
```
blockview/
├── src/
│ ├── components/
│ ├── contexts/
│ ├── pages/
│ ├── utils/
│ └── App.jsx
├── public/
└── ...
```
## API Notice
This project uses the CoinGecko API's free tier, which has rate limitations. For production use, consider upgrading to their pro tier for better rate limits and additional features.
## Author
_Dhrubajyoti Bhattacharjee_
- GitHub: [@KeepSerene](https://github.com/KeepSerene)
- LinkedIn: [Dhrubajyoti Bhattacharjee](https://www.linkedin.com/in/dhrubajyoti-bhattacharjee-320822318/)
## Acknowledgments
- Data provided by [CoinGecko API](https://www.coingecko.com/en/api)
## License
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.