💰 Cryptoverse: A Real-Time Portal to Stay Updated with the Blockchain World

👀 Demo Link

Welcome to Cryptoverse! This comprehensive React application is designed to keep you ahead in the ever-evolving crypto world, offering real-time data, insightful news, and in-depth analysis.

🔑 Key Features:

• 🚚 Live Market Data: Track current prices, charts, and historical trends for hundreds of cryptocurrencies via the Coinranking Rapid API.
• 🧠 Smart News: Stay informed with news that can be filtered based on your preferred coin using the News API.
• 📉 Interactive Charts and Analysis: Visualize price changes with interactive charts powered by Chart.js.
• 🧐 Cryptocurrency Details: Access detailed information about coins, including their exchanges, history, and key metrics through the Coingeko REST API.
• 📲 User-Friendly and Responsive Design: Enjoy a seamless experience with a responsive interface built using ANTD UI.
• 🧑‍💼 Data Management: Experience efficient state management and API calls with Redux-Toolkit and RTK Query, ensuring a smooth and responsive user experience.
• 🔐 Secure API Key Handling: Protect your API keys with an .env file, prioritizing security and privacy.
• 📱 Progressive Web App (PWA): Install Cryptoverse as a mobile app for offline access and a native app-like experience.

👩‍💻 Technologies Used

• React
• Redux-Toolkit
• RTK Query
• REST API + Rapid API
• Ant Design (UI Framework of React)
• HTML/JSX
• CSS
• JavaScript
• Chart.js
• PWA

✍️ Development Process

🤠 My API Playground

Eager to dive into APIs and Redux Toolkit, I chose to build Cryptoverse as my testbed. I started by exploring RapidAPI for free data sources and crafting a clean layout, complete with smooth routing and a robust Redux store. The homepage serves as a launchpad, offering glimpses into the Cryptocurrencies and News pages.

😵 Cryptocurrency Showcase

On the Cryptocurrencies page, I showcased 100 digital coins in all their glory. The Cryptodetails page dives deeper, revealing each coin's historical price charts powered by Chart.js, thanks to inspiration from JavaScript Mastery. The News page features a dynamic feed with filters to keep you updated on specific coins. Finally, the Exchange page provides a one-stop shop for all trading needs, displaying exchange options and stats for every crypto.

😀 The Journey

This project was a wild ride, with every API challenge and Redux puzzle making it worth the effort. Adding PWA functionality was the cherry on top, allowing users to install Cryptoverse as a mobile app and access it offline, enhancing the user experience.

📲 Progressive Web App (PWA)

Cryptoverse is not just a web app; it's also a PWA! This means you can install it on your mobile device and enjoy offline access, giving you the convenience of a native app-like experience. This feature makes it easier to stay updated with the latest in the crypto world, even when you're on the go.