https://github.com/nishuldhakar/react-minor-projects
This is a collection of various mini-projects built with React, each demonstrating different concepts and best practices.
https://github.com/nishuldhakar/react-minor-projects
api-integration minor-projects react react-hooks react-router reactjs state-management tailwind tailwindcss ui-design
Last synced: about 2 months ago
JSON representation
This is a collection of various mini-projects built with React, each demonstrating different concepts and best practices.
- Host: GitHub
- URL: https://github.com/nishuldhakar/react-minor-projects
- Owner: NishulDhakar
- Created: 2025-02-22T15:28:30.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-02-22T15:36:43.000Z (over 1 year ago)
- Last Synced: 2025-02-22T16:30:44.825Z (over 1 year ago)
- Topics: api-integration, minor-projects, react, react-hooks, react-router, reactjs, state-management, tailwind, tailwindcss, ui-design
- Language: JavaScript
- Homepage: https://react-minor-projects-five.vercel.app
- Size: 63.5 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# React Minor Projects 🚀
A collection of mini React projects built to improve my skills in frontend development. Each project demonstrates different concepts like state management, API integration, animations, and UI design using modern technologies.
## 🌐 Live
Check out the live demo here: [React Minor Projects](https://react-minor-projects-five.vercel.app/)
## ✨ Featured Projects
- **Interactive Todo App** - Task management with drag-and-drop functionality
- **Weather Dashboard** - Real-time weather data visualization
- **Image Gallery** - Responsive grid layout with lazy loading
- **Quiz Application** - Interactive quiz with timer and score tracking
- **Theme Switcher** - Custom themeable components with context API
## 📌 Features
- **Multiple Mini Projects**: A showcase of different React-based mini projects
- **React + Vite**: Fast and optimized development with Vite
- **Tailwind CSS**: Responsive and modern UI design
- **Component-based Architecture**: Well-structured and reusable components
- **Interactive UI**: Smooth animations and user interactions
## 🛠️ Tech Stack
- **Frontend**: React, TypeScript, Tailwind CSS
- **State Management**: useState, useEffect, Context API
- **Routing**: React Router
- **Hosting**: Vercel
## 📂 Project Structure
```
/react-minor-projects
├── src
│ ├── components # Reusable UI components
│ ├── pages # Different project pages
│ ├── assets # Images, icons, etc.
│ ├── hooks # Custom React hooks
│ ├── context # Context providers
│ ├── utils # Helper functions
│ ├── App.tsx # Main App component
│ ├── index.tsx # Entry point
├── public # Static assets
├── package.json # Dependencies and scripts
├── README.md # Documentation
```
## 🚀 Getting Started
### 1️⃣ Clone the Repository
```bash
git clone https://github.com/nishuldhakar/react-minor-projects.git
cd react-minor-projects
```
### 2️⃣ Install Dependencies
```bash
yarn install # or npm install
```
### 3️⃣ Run the Development Server
```bash
yarn dev # or npm run dev
```
Open [http://localhost:5173](http://localhost:5173) to view it in the browser.
### 4️⃣ Build for Production
```bash
yarn build # or npm run build
```
## 📸 Screenshots
## 🎯 Upcoming Features
- More interactive mini projects
- Dark mode toggle
- Improved UI/UX
- Authentication integration
- Backend API integration with Node.js
## 🤝 Contributing
Contributions are welcome! Please feel free to submit a Pull Request.
1. Fork the repository
2. Create your feature branch (`git checkout -b feature/amazing-feature`)
3. Commit your changes (`git commit -m 'Add some amazing feature'`)
4. Push to the branch (`git push origin feature/amazing-feature`)
5. Open a Pull Request
## 📜 License
This project is open-source and available under the MIT License.
## 👤 Author
**Nishul Dhakar**
---
🚀 **Feel free to fork, contribute, or suggest improvements!** 🎉