https://github.com/abdulmazidakash/assignment-07

https://github.com/abdulmazidakash/assignment-07

Last synced: about 1 month ago
JSON representation

• Host: GitHub
• URL: https://github.com/abdulmazidakash/assignment-07
• Owner: abdulmazidakash
• Created: 2024-11-30T17:01:40.000Z (about 1 month ago)
• Default Branch: main
• Last Pushed: 2024-11-30T17:08:45.000Z (about 1 month ago)
• Last Synced: 2024-11-30T18:23:34.729Z (about 1 month ago)
• Language: JavaScript
• Homepage: https://dream-11-akash.netlify.app/
• Size: 53.7 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        


🌟 BPL-DREAM 11 🌟


🎉 Live Link


https://my-dream-11-akash.surge.sh/


🎉 Description



  An interactive and engaging player selection app built with React! This project allows users to create a custom team by selecting players within a coin budget, switching between available and selected players, and receiving real-time feedback on actions.



---

🚀 Technologies Used




  


React: For building a dynamic user interface.

  


Surge: For quick and easy deployment.

  


React Toastify: To provide user-friendly notifications.

  


Tailwind CSS: For responsive and modern styling.



✨ Key Features




  


Player Selection with Coin Management


  Users can select players while managing a coin balance, with each selection or deselection impacting the coin total. Selected players can be managed and removed with coins restored.

  

  


Toggle Between Views


  Easily toggle between available and selected players to manage choices, with a maximum of 6 players allowed per selection.

  

  


Real-Time Notifications


  Integrated with Toastify, this app provides real-time notifications for coin shortages, duplicate selections, and more, ensuring smooth interaction and feedback.



📄 Project Structure




  


Components: Reusable React components like Navbar, Banner, PlayerCard, and MainSection.

  


Data: JSON file storing player details.

  


Styles: Tailwind CSS for a consistent and mobile-friendly design.