Skip to main content

​
Overview

The Flashcards component automatically generates interactive flashcards from your study materials. It supports multiple card types, spaced repetition learning, and difficulty levels to optimize your study sessions.

​
Creating a Flashcards Component

import StudyfetchSDK from '@studyfetch/sdk';

const client = new StudyfetchSDK({
  apiKey: 'your-api-key',
  baseURL: 'https://studyfetchapi.com',
});

const flashcardsComponent = await client.v1.components.create({
  name: 'Biology Flashcards',
  type: 'flashcards',
  config: {
    materials: ['mat-123', 'mat-456'],
    folders: ['folder-789'],
    difficulty: 'MIXED',
    totalFlashcards: 30,
    viewMode: 'NORMAL',
    cardTypes: ['BASIC', 'MULTIPLE_CHOICE'],
    model: 'gpt-4o-mini-2024-07-18'
  }
});

console.log('Flashcards component created:', flashcardsComponent._id);

​
Configuration Parameters

​
name
string
required
Name of the flashcards component
​
type
string
required
Must be "flashcards"
​
config
object
required
Flashcards configuration object

​
Response

{
  "_id": "comp_456def",
  "name": "Biology Flashcards",
  "type": "flashcards",
  "status": "processing",
  "config": {
    "materials": ["mat-123", "mat-456"],
    "folders": ["folder-789"],
    "difficulty": "MIXED",
    "totalFlashcards": 30,
    "viewMode": "NORMAL",
    "cardTypes": ["BASIC", "MULTIPLE_CHOICE"],
    "model": "gpt-4o-mini-2024-07-18"
  },
  "createdAt": "2024-01-15T10:00:00Z",
  "updatedAt": "2024-01-15T10:00:00Z",
  "organizationId": "org_456def",
  "progress": {
    "generated": 0,
    "total": 30
  }
}

​
Embedding This Component

Once you’ve created a Flashcards component, you can embed it on your website using the embedding API.

​
Generate Embed URL

const embedResponse = await client.v1.components.generateEmbed(flashcardsComponent._id, {
  // User tracking
  userId: 'user-456',
  studentName: 'Jane Smith',  // Student name for display
  groupIds: ['class-101', 'class-102'],
  sessionId: 'session-789',
  
  // Flashcards-specific features
  features: {
    enableHistory: true,
    enableVoice: true
  },
  
  // Dimensions
  width: '100%',
  height: '600px',
  
  // Token expiry
  expiryHours: 24
});

​
Flashcards-Specific Embedding Features

​
features.enableHistory
boolean
default:"true"
Track and display user’s flashcard review history and performance
​
features.enableVoice
boolean
default:"false"
Enable voice pronunciation for flashcard content (useful for language learning)

​
Embed in Your HTML

<iframe 
  src="https://embed.studyfetch.com/component/comp_456def?token=..."
  width="100%"
  height="600px"
  frameborder="0"
  allow="microphone"
  style="border: 1px solid #e5e5e5; border-radius: 8px;">
</iframe>
⌘I