Coin Insight is a robust, user-friendly cryptocurrency tracker app built with React.js. It allows users to monitor real-time cryptocurrency data, including prices, market caps, and more, using the CoinGecko API. The app offers a comprehensive view of various cryptocurrencies, making it an ideal tool for both casual users and serious investors.
- Home Page: Displays a table of cryptocurrencies with images, names, prices, 24-hour changes, and market cap.
- Currency Selector: Toggle between USD and INR for displaying data.
- Pagenation: Browse through an extensive list of cryptocurrencies using Next and Back.
- Detailed View: Click on a cryptocurrency to see its image, description, current price, and a dashboard with market cap, all-time high/low, total volume, and price changes over different periods.
- Interactive Charts: Show price, market cap, and volume data over 24 hours, 30 days, and one year.
- Reusable Components: Built using the presenter-container pattern for maintainable code.
- Custom Hooks: Implemented for reusable logic.
- State Management: Managed by Zustand.
- API Caching: Handled using React Query.
- Responsive Design: Powered by DaisyUI.
- Search Box with Suggestions: Implemented search functionality.
-
Home Page: Displays a list of cryptocurrencies with data like price, market cap, and more.
-
Crypto Table: Shows the tabel of the all the trending cryptocurrencies .
-
Crypto Coin Search: Allows users to search for specific cryptocurrencies.
-
Crypto Detail Page: Shows detailed information for a selected cryptocurrency, including interactive charts.
- Frontend: React.js, DaisyUI, Zustand, Chart.js 2
- API: CoinGecko Free API
- State Management: Zustand
- API Caching: React Query
- Patterns: Presenter-Container, Custom Hooks
- Performance: Suspense, Error Boundaries, Lazy Loading
To run the project locally, follow these steps:
Make sure you have Node.js and npm installed on your system.
- Clone the repository:
git clone https://github.com/ManikMaity/Crypto-Project---CoinGecko.git cd Crypto-Project---CoinGecko
- Install the dependencies::
npm install
- Start the development server::
npm run dev