Overview

This Flashcard App is a client-side tool for creating, reviewing, and testing yourself on flashcards with optional images, audio, categories, and performance tracking. It stores all data locally in your browser (via localStorage) — meaning no internet or account is needed, but also that data is tied to your device and browser.

---

1. Creating Flashcards

Steps:

• Fill in the Front text (e.g., a question or term).
• Optionally upload an image (📷) and/or audio (🔊).
• Enter the Back text (e.g., the answer or definition).
• Optionally assign a Category (like “Math”, “History”).
• Click Add.

Notes:

• Cards without front text or media are blocked.
• All inputs are optional except for some content on the front.
• Once added, the card appears in your local storage and can be filtered, edited, or used in quizzes.

---

2. Editing and Deleting Cards

• Click the ✏️ icon on a card to edit it. This populates the form and switches the Add button to Save.
• Make changes and click Save.
• Click Cancel to exit edit mode without saving.
• To delete a card, click the × icon on its top-right corner.

---

3. Searching, Sorting, and Filtering

Search: Type any keyword in the search box to filter visible cards.

Sort: Choose how to sort (by front or back, ascending or descending).

Filter by Category:

• Use the dropdown to select one category or view all cards.
• Categories auto-update based on existing flashcards.

---

4. Adjusting Display Layout

Use the 2 / 3 / 4 buttons to choose how many cards are shown per row.

This helps with visual comfort depending on screen size or preference.

---

5. Studying with Quiz Mode

Click the Quiz button to enter quiz mode. Select your study mode first:

Modes:

• Random: Shuffle cards from selected category.
• Learning: Prioritize cards with the lowest success scores.
• Learning Step: Show only the worst-performing card.
• Infinite Random: Random card forever, doesn’t stop.

How it works:

• Each quiz session shows the front of the card.
• Click the card to flip it (front/back toggle).
• After flipping, click Yes or No to record if you got it right.
• Score is calculated as: correct - incorrect.

Stats shown:

• Yes: how many times marked correct
• No: incorrect count (calculated)
• Score: net value of performance

Click Exit to leave quiz mode.

---

6. Exporting and Importing

Export:

• Click Export to copy a text representation of all cards to clipboard.
• Format is line-based, with Front:, Back:, and Cat: fields.

Import:

• Click Import, paste exported text, and click Import again.
• Existing cards will be overwritten.

Tip: Export regularly as a backup before major changes.

---

7. Hiding and Showing Cards

• Use Hide Cards to hide the card grid.
• Use Show Cards to reveal them again.
• Helpful when focusing only on quiz mode or editing.

---

How It Works Behind the Scenes

• All flashcards are stored in your browser’s localStorage as a JSON string.
• Images and audio files are encoded in base64 format and saved with the card object.
• Quiz tracking is updated in real-time with every interaction.

---

Common Pitfalls and How to Avoid Them

1. Data Loss:
   Since the app uses localStorage, clearing browser data or using incognito mode can wipe your cards.
   Solution: Regularly use the export feature to back up.
2. Editing Confusion:
   If you forget you’re in edit mode, you might overwrite a card.
   Solution: Look for the “Edit Card” title and the visible Cancel button.
3. Large Media Files:
   Image/audio files are encoded as base64 strings which can slow performance if files are large.
   Solution: Optimize files before uploading.
4. Importing Issues:
   Manual formatting errors in imported text can corrupt card loading.
   Solution: Always export then re-import in the same app to ensure correct format.
5. Score Misinterpretation:
   The score is net correct minus incorrect. A low score doesn’t mean never correct, just not consistently so.

---

Best Practices

• Keep card content concise for better recall.
• Use categories to structure your deck (e.g., by subject or difficulty).
• Mix media for visual/auditory learning.
• Use the Learning or Step modes to focus on weak areas.
• Periodically export to protect your work.