📂 Project Structure

CryptoPlace/
│
├── dist/                     # Production build output (auto-generated)
│   ├── assets/               # Bundled JS & CSS
│   ├── index.html
│   └── vite.svg
│
├── public/                   # Static assets served as-is
│   └── vite.svg
│
├── src/                      # Source code
│   ├── assets/               # Images, icons, static assets
│   ├── components/           # Reusable UI components
│   ├── context/              # Global state management
│   ├── pages/                # Application pages
│   ├── App.jsx               # Root React component
│   ├── index.css             # Global styles
│   └── main.jsx              # Entry point for React + Vite
│
├── index.html                # Root HTML file
├── vite.config.js            # Vite configuration
├── package.json              # Dependencies & scripts
├── package-lock.json
├── LICENSE
└── README.md

🚀 Features

• Live cryptocurrency price tracking

• Trending coins section

• Responsive mobile-first design

• Lightning-fast development using Vite

• Modular & clean React architecture

• Global state management via Context API

• SEO-friendly static site deployment on Vercel

🛠️ Tech Stack

Framework: React + Vite

Styling: CSS / Tailwind (update if needed)

Language: JavaScript (ES6+)

Deployment: Vercel

API: CoinGecko / your chosen API

⚙️ Local Development Setup

1️⃣ Clone the Repository

git clone https://github.com/yourusername/CryptoPlace.git
cd CryptoPlace

2️⃣ Install Dependencies

npm install

3️⃣ Start Development Server

npm run dev

Runs at: 👉 http://localhost:5173/

📦 Production Build

Generate an optimized production build:

npm run build

Vite outputs everything into the dist/ folder.

🌐 Deployment (Vercel)

Use these exact Vercel settings:

Setting Value Root Directory CryptoPlace Framework Preset Vite Install Command npm install Build Command npm run build Output Directory dist

After pushing to GitHub → Vercel will auto-deploy.

🔑 Environment Variables (Optional)

If your app uses an API key, create a .env file:

VITE_API_KEY=your_api_key_here

Use in code:

const apiKey = import.meta.env.VITE_API_KEY;

📸 Screenshots

🏠 Home Page

---

📊 Crypto List Page

---

📈 Crypto Details Page

🤝 Contributing

Feel free to open issues or submit pull requests for improvements.

👨‍💻 Author

Anurag Kumar Final-year student at IIIT Bhagalpur, India Passionate about quantitative finance, problem-solving, data structures and algorithms, and software engineering.

⭐ Support

If you like this project, consider giving it a ⭐ on GitHub — it really helps!

Also, feel free to follow me on GitHub for more projects and updates: 👉 https://github.com/anuragpy07