This project is a dynamic web application that provides real-time cryptocurrency price data using the CoinGecko API. It is built with React.js and leverages modern technologies to ensure a seamless and efficient user experience.
- Real-Time Cryptocurrency Prices: Fetches and displays live cryptocurrency prices using the CoinGecko API.
- Lazy Loading and Suspense: Optimized performance by loading components and data only when needed.
- Pagination: Allows users to browse through large datasets in smaller, manageable chunks.
- Virtualized Lists: Efficient rendering of only visible items in the list, reducing DOM size and enhancing performance.
- Caching: Implemented with React Query to minimize redundant API calls and ensure faster data retrieval.
- React.js: For building the user interface.
- React Query: For efficient data fetching, caching, and synchronization.
- Context API: For state management and smooth data flow across components.
- Tailwind CSS: For styling and responsive design.
- Clone the repository:
git clone https://github.com/Sourabh-km13/CoinChase.git
- Navigate to the project directory:
cd coinchase - Install dependencies:
npm install
- Start the development server:
npm run dev
- Open the application in your browser at
http://localhost:3000(default). - Browse through the list of cryptocurrencies.
- Use pagination controls to navigate through the dataset.
This application integrates with the CoinGecko API to fetch real-time cryptocurrency data. Make sure to adhere to their usage policies when deploying the application.
- Lazy Loading: Ensures components are loaded only when needed, improving initial load time.
- Virtualized Lists: Reduces the number of DOM elements rendered at any given time, making the app performant for large datasets.
- Caching: Utilizes React Query's caching capabilities to minimize API calls and enhance data retrieval speed.
- Add a search bar to filter cryptocurrencies by name.
