Flashcard Study Tool

A responsive and interactive flashcard study tool built with React.js, JavaScript, HTML, CSS, designed to help users learn and practice effectively. This application allows users to choose from a variety of questions and answers, flip flashcards, and interact with options seamlessly.

---

Features

• Dynamic API Integration: Fetches trivia questions and answers from the Open Trivia Database (https://opentdb.com/).
• Responsive Design: Adapts to various screen sizes using a grid layout.
• Interactive Flip Animation: Flip cards to reveal the answers with smooth 3D animations.
• Customizable Options: Select categories and the number of questions dynamically.
• Add Custom Flashcards: Optionally create your own flashcards with custom questions and answers.
• Clear Flashcards Feature: Reset the flashcard deck with a single click for a fresh study session.
• Error Handling: Gracefully manages incomplete or invalid inputs, ensuring a smooth user experience.
• Lightweight Styling: Custom CSS styling for a clean, user-friendly interface.

Technologies Used

• React.js: Frontend library for building user interfaces.
• Axios: HTTP client for fetching data from APIs.
• HTML5/CSS3: For structuring and styling the app.
• JavaScript (ES6+): For logic and interactivity.

---

Installation

1. Clone the repository:

   git clone https://github.com/your-username/flashcard-study-tool.git

2. Navigate to project directory:

cd flashcard-study-tool

3. Install dependencies:

npm install

4. Start development server:

npm start

Usage

Open your browser and navigate to http://localhost:3000

How to Use

1. Start the app and select a category and the number of questions.
2. Click Generate to fetch flashcards.
3. Click on a flashcard to flip it and reveal the answer.
4. Use the interactive options for a quiz-like experience.

Contributing

All contributions are welcome.