NextLang Documentation

Next.js 16React 19

The best way to learn new languages with AI-powered flashcards and real-life phrases.

Live Demo: www.nextlang.co

✨ Features

🎯 AI-Powered Language Learning
All-in-One GeneratorUniversal flashcard generator for all platforms
Quizlet GeneratorCreate Quizlet-compatible translation dictionaries
Anki GeneratorGenerate Anki flashcards with spaced repetition
Mochi GeneratorCreate Mochi cards as a native .mochi package, CSV, or Markdown
Brainscape GeneratorGenerate Brainscape flashcards with CBR algorithm
Image-to-FlashcardGenerate vocabulary from images (all generators)
Multi-languageSupport for 20 languages
Smart Spaced RepetitionOptimize memory retention with proven algorithms
πŸ”§ Customizable Learning
Flexible GenerationChoose 5–15 cards (free) or 5–30 cards (premium)
Custom FieldsCustomize Anki card fields and tags
Multiple FormatsSupport for different separators
Smart TaggingAdd custom tags to organize flashcards
Image UploadGenerate vocabulary from visual content
Unified InterfaceAll-in-one generator for all platforms
πŸ’³ Credit-Based System
Pay-per-useOnly pay for what you use
Flexible PricingMultiple credit packages available
Stripe IntegrationSecure payment processing
Real-time TrackingMonitor usage and balance
β™Ώ Accessibility & UX
WCAG CompliantFull accessibility support
Responsive DesignWorks on all devices
Dark/Light ModeToggle between themes
PWAInstall as native app
Real StatsTrack usage analytics
Health MonitoringSystem health checks
πŸ”„ Data Management & State
TanStack QueryPowerful data fetching & caching
Optimistic UpdatesInstant UI updates with rollback
Background RefetchingKeep data fresh automatically
Query InvalidationSmart cache invalidation
Error HandlingComprehensive error states
DevToolsBuilt-in debugging tools
πŸ”’ Security & Performance
Input SanitizationXSS protection
Rate LimitingRedis-powered protection
Error MonitoringRollbar integration
Environment ValidationZod-based validation
Content SecurityMultiple sanitization levels
TurbopackFast builds & development

⭐ Premium Features

Free vs Premium Comparison
Choose the plan that fits your learning needs

Free Tier

  • βœ“3 free credits on first sign-in
  • βœ“Basic flashcard generation
  • βœ“Generate 5-15 cards per session
  • βœ“Free generators (Quizlet and Mochi); Anki and Brainscape are premium
  • βœ“Essential guides and documentation
  • βœ“Community support

Premium

  • βœ“All Free Tier features, plus:
  • ⭐Extended limits: Generate 5-30 cards per session
  • ⭐Complete guides: All sections unlocked with advanced techniques
  • ⭐Premium generators: Full Anki & Brainscape access
  • ⭐All format options: CSV, TXT, Markdown with custom separators, plus native packages (.apkg for Anki, .mochi for Mochi)
  • ⭐Advanced customization: Unlock output format customization
  • ⭐Priority processing: Faster generation and priority queue
  • ⭐Priority support: Email support with faster response
  • ⭐No daily caps: Generate as long as you have credits - no time-based limits
How Premium Works
  1. 1.Sign Up: Create a free account and get 3 credits to try the free generators
  2. 2.Purchase Credits: Buy credit packages at /pricing when you need more
  3. 3.Use Credits: Each flashcard generation uses 1 credit
  4. 4.Unlock Premium: Purchasing credits unlocks all premium features
  5. 5.No Subscriptions: Only pay for what you use - no recurring fees
Premium Benefits Summary
πŸ’³ Pay-per-use Model

No monthly fees - only pay for what you use with flexible credit packages

πŸš€ Instant Access

Premium features activate immediately after your first credit purchase

πŸ”“ Unlock Everything

Get access to all generators, formats, and advanced features without restrictions

Getting Started with Premium
Ready to unlock the full power of NextLang?
View Pricing PlansTry Free Generators

πŸ§ͺ Testing & Quality

πŸ§ͺ Testing Framework
VitestFast unit testing framework
Testing LibraryReact component testing utilities
JSDOMDOM environment for testing
Coverage ReportsV8 coverage analysis
πŸ”§ Test Structure
Centralized MocksReusable mock management
Component TestsUI component behavior testing
Hook TestsCustom React hooks testing
Integration TestsEnd-to-end functionality testing

πŸ“š How-to Guides

Step-by-Step Guides
  • All-in-One Generator - Universal guide for all platforms
  • Create Anki Decks - Complete guide to effective Anki flashcards
  • Create Quizlet Sets - Step-by-step Quizlet study set creation
  • Create Mochi Cards - Guide to Mochi card creation and formatting
  • Create Brainscape Decks - Complete guide to Brainscape flashcard generation
  • Image Upload - How to generate flashcards from images
Best Practices
  • Anki Best Practices - Advanced techniques for effective Anki usage
  • Quizlet Study Sets - Proven strategies for Quizlet study sets
  • Mochi Cards Best Practices - Optimization techniques for Mochi cards
  • Brainscape Study Decks - Strategies for effective Brainscape learning
Documentation
  • Complete Documentation - Comprehensive feature documentation
  • API Reference - Detailed API endpoint documentation
  • Troubleshooting - Common issues and solutions
Access Guides
/generatorsBrowse all generators
/all-in-oneUniversal generator
/how-toBrowse all guides
/vocabularySaved words & study mode
/docsComplete documentation

🎯 Usage

All-in-One Generator
  1. 1. Navigate to /all-in-one
  2. 2. Select your preferred platform (Quizlet, Mochi, Anki, Brainscape)
  3. 3. Choose source and target languages
  4. 4. Enter a prompt or upload an image
  5. 5. Customize platform-specific settings
  6. 6. Generate your flashcards
Creating Quizlet Dictionaries
  1. 1. Navigate to /quizlet
  2. 2. Select source and target languages
  3. 3. Enter a prompt or upload an image
  4. 4. Choose the number of words and format
  5. 5. Generate your dictionary
Creating Anki Flashcards
  1. 1. Navigate to /anki
  2. 2. Select source and target languages
  3. 3. Enter a prompt for your flashcards
  4. 4. Customize card fields and settings
  5. 5. Generate your Anki deck
  6. 6. Download a native .apkg package (fields and tags preserved) or CSV/TSV
Creating Mochi Cards
  1. 1. Navigate to /mochi
  2. 2. Select source and target languages
  3. 3. Enter a prompt or upload an image
  4. 4. Choose text format (CSV or Markdown)
  5. 5. Configure separator and quote options for CSV
  6. 6. Generate your Mochi cards
  7. 7. Download a native .mochi package for one-click import, or CSV/Markdown
Image-to-Flashcard Generation
  1. 1. Navigate to any generator (Quizlet, Anki, Mochi, Brainscape)
  2. 2. Upload an image (JPG, PNG, WebP, max 1.25MB)
  3. 3. AI will analyze the image content
  4. 4. Select languages and customize settings
  5. 5. Generate vocabulary based on visual content
Creating Brainscape Decks
  1. 1. Navigate to /brainscape
  2. 2. Select source and target languages
  3. 3. Enter a prompt describing what you want to learn
  4. 4. Choose the number of cards (5-30)
  5. 5. Select file format (CSV or TXT)
  6. 6. Configure separator for CSV/TXT formats
  7. 7. Generate your Brainscape deck
Managing Credits
  1. 1. Sign in to your account
  2. 2. Visit /pricing to purchase credits
  3. 3. Check your credit balance on the user page
Progressive Web App
  1. 1. Visit the website on your mobile device
  2. 2. Tap β€œAdd to Home Screen” when prompted
  3. 3. Use the app like a native application
Security Features
  • Input sanitization prevents XSS attacks
  • Rate limiting protects API endpoints
  • Content security with multiple sanitization levels
  • Error monitoring with Rollbar integration
Health Monitoring
  • System health checks at /api/health
  • Service dependency monitoring
  • Performance metrics tracking
  • Real-time error reporting
Data Management
  • TanStack Query for efficient data fetching
  • Automatic background refetching
  • Smart cache invalidation
  • Optimistic updates with rollback
  • Built-in loading and error states
  • DevTools for debugging queries

πŸ“š Quizlet Integration

Quizlet Study Sets
  • Create translation dictionaries for Quizlet
  • Direct import into Quizlet study sets
  • Supports Quizlet’s term-definition format
  • Compatible with Quizlet’s spaced repetition
  • Works with Quizlet’s mobile and web apps
Quizlet Features
  • Multiple study modes (Learn, Flashcards, Write)
  • Audio pronunciation support
  • Progress tracking and analytics
  • Collaborative study sets
  • Offline study capabilities
Quizlet Format
  • Simple term-definition pairs
  • Clean, readable format
  • Supports special characters and accents
  • Optimized for language learning
  • Easy to edit and customize
Quizlet Customization
  • Choose card count (5-30 cards)
  • Select source and target languages
  • Customize prompt for content generation
  • Save preferences for future use

πŸƒ Anki Integration

Anki Flashcards
  • Generate Anki-compatible flashcard decks
  • Support for multiple card types and fields
  • Customizable card templates
  • Advanced spaced repetition algorithms
  • Cross-platform synchronization
Anki Features
  • Sophisticated spaced repetition system
  • Rich media support (images, audio, video)
  • Add-ons and customization options
  • Detailed statistics and progress tracking
  • Mobile apps for iOS and Android
Anki Format
  • Native .apkg package download (selected fields become Anki note fields, tags become native Anki tags)
  • CSV/TSV text export with your chosen separator
  • Custom tags and metadata
  • Deck organization and structure
  • The .apkg also imports into Mochi
Anki Customization
  • Customize card fields and templates
  • Choose separator types and formatting
  • Add custom tags for organization
  • Configure card count and complexity
  • Save preferences for future generations

πŸ“‹ Mochi Cards Support

CSV Format
  • Configurable separators (comma, semicolon, tab, pipe)
  • Optional quote wrapping for values
  • Direct import into Mochi Cards app
  • Compatible with spreadsheet applications
  • Supports large card sets efficiently
Markdown Format
  • Human-readable card format
  • Supports rich text formatting
  • Easy to edit and customize
  • Compatible with Mochi’s markdown parser
  • Great for sharing and collaboration
Mochi Integration
  • Native .mochi package that imports as a complete deck in one click
  • Direct import into Mochi Cards application
  • Preserves card structure and metadata
  • Supports spaced repetition algorithms
  • Compatible with Mochi’s template system
  • Maintains language learning context
Format Customization
  • Choose a native .mochi package, CSV, or Markdown output
  • Customize CSV separators and quoting
  • Select markdown style (basic or detailed)
  • Configure card count (5+ cards)
  • Save preferences for future generations

🧠 Brainscape Integration

Brainscape Flashcards
  • Generate Brainscape-compatible flashcard decks
  • CSV and TXT format support for easy import
  • Front and Back column structure
  • Confidence-Based Repetition (CBR) algorithm
  • Optimized for adaptive spaced repetition
Brainscape Features
  • Confidence-Based Repetition (CBR) learning system
  • Self-assessed confidence levels for adaptive review
  • Focus on challenging concepts automatically
  • Mobile and web app synchronization
  • Progress tracking and analytics
Brainscape Format
  • CSV format with Front and Back columns
  • TXT format for simple text-based import
  • Configurable separators (comma, semicolon, tab)
  • Clean, readable structure
  • Supports special characters and accents
Brainscape Customization
  • Choose card count (5-30 cards per generation)
  • Select source and target languages
  • Customize prompt for content generation
  • Choose between CSV and TXT formats
  • Configure separator type for CSV/TXT
  • Save preferences for future use

🎨 All-in-One Generator

Universal Platform
  • Generate flashcards for all platforms from one interface
  • Choose between Quizlet, Mochi, Anki or Brainscape
  • AI-powered optimization for each platform
  • Unified workflow for all your flashcard needs
  • Platform-specific settings and customization
Image-to-Flashcard Feature
  • Upload images (JPG, PNG, WebP, max 1.25MB)
  • AI analyzes visual content automatically
  • Generate vocabulary from images
  • Supports drag-and-drop upload
  • Available for all generators (Quizlet, Anki, Mochi, Brainscape)
Generators Overview
  • Browse all available generators at /generators
  • Compare features and benefits of each platform
  • View statistics and success rates
  • Access quick links to step-by-step guides
Platform Benefits
  • Streamlined workflow with single interface
  • Consistent user experience across platforms
  • Quick platform switching for comparison
  • Enhanced productivity for multi-platform users

πŸ“– Vocabulary & Study Mode

Personal Vocabulary
  • Save words with translation and optional example sentences
  • Organized into dictionaries by language pair at /vocabulary
  • Add generated cards to your vocabulary while reviewing
  • Keep up to 5,000 saved words
Learned Tracking
  • Mark individual words as learned
  • Mark an entire dictionary as learned at once
  • Track progress per language pair
  • Filter and revisit words you are still learning
Interactive Study Mode
  • Flip-card sessions with shuffle and restart
  • Rate cards as β€œGot it” or β€œStill learning”
  • Live mastery progress and known/unknown counts
  • Review only the cards you missed at the end
Focus Mode & Shortcuts
  • Distraction-free fullscreen study
  • Arrow keys to navigate and rate cards
  • Space or Enter to flip, F for focus, Esc to exit
  • Reduced-motion support for accessibility

πŸ—£οΈ Phrasebooks (Hub)

What it is
  • Ready-made, hand-vetted phrase packs for real-life situations that textbooks skip
  • Grouped by language pair, starting with Russian to Polish
  • Live scenarios: doctor visit, urzΔ…d (PESEL and karta pobytu), shop and checkout
  • Each pack: phrases with translation and usage notes, plus false-friend traps Slavic speakers hit
  • Free and fully open, no signup, no credits
How to use it
  1. 1. Open /hub and pick a language pair
  2. 2. Choose a scenario from the grid (upcoming ones are marked Soon)
  3. 3. Read the phrases and traps right on the page
  4. 4. Need a situation that is not listed? The CTA sends you to /all-in-one to generate your own

πŸ“§ Email Notifications

Transactional Emails
  • Welcome email on your first sign-in
  • Purchase receipt after a successful checkout
  • Refund confirmation when a charge is refunded
  • Low-credit reminder when you reach your last credit
  • Best-effort delivery that never blocks the app
Low-Credit Nudge
  • Sent once when your balance hits the last credit
  • One-tap link to top up at /pricing
  • Re-armed only after you purchase more credits
  • Suppressed entirely if you opt out
Unsubscribe & Preferences
  • One-click unsubscribe in every reminder
  • Signed link with standard List-Unsubscribe support
  • Confirm your choice at /unsubscribe
  • Receipts and account emails always send
Built with Resend
  • Templates authored as React components (react-email)
  • Consistent NextLang branding across every message
  • Inbox preview text and plain-text fallback included
  • Sent from a verified NextLang domain

πŸ“Š Analytics & Monitoring

Real-time Statistics
  • Privacy-friendly Umami event tracking
  • Platform analytics and user engagement tracking
  • Language statistics and popular language pairs
  • Usage dashboards with real-time insights
  • Credit usage and generation metrics
Health Monitoring
  • System health checks at /api/health
  • Database, Redis, OpenAI, and Stripe connectivity
  • Performance metrics and response times
  • Uptime tracking and error rates
Error Tracking
  • Rollbar integration for real-time error monitoring
  • Client-side error handling and reporting
  • Server-side logging and debugging
  • Automatic error alerting and notifications
Security Monitoring
  • Rate limiting analytics and abuse detection
  • Input sanitization monitoring
  • Security event logging and tracking
  • Performance impact analysis

πŸ—οΈ Tech Stack

Frontend
  • Next.js 16 - React framework with App Router
  • React 19 - UI library
  • TypeScript 6 - Type safety
  • Tailwind CSS 4 - Styling with latest features
  • Radix UI - Accessible component primitives
  • React Hook Form - Form management
  • TanStack Query - Data fetching and state management
  • Zod - Schema validation
  • Lucide React - Icon library
  • Motion - Animations and transitions
  • Sonner - Toast notifications
Backend
  • Server Actions & Next.js API Routes
  • Better Auth - Authentication (Google OAuth)
  • Drizzle ORM - Database ORM
  • PostgreSQL - Database
  • OpenAI API - AI-powered content generation
  • Redis (Upstash) - Rate limiting and caching
  • Rollbar - Error monitoring and logging
Payments & Infrastructure
  • Stripe - Payment processing with webhooks
  • Coolify (VPS) - Production deployment platform
  • Docker & GitHub Container Registry - Containerized image builds
  • GitHub Actions - CI/CD build & deploy pipeline
  • Neon - PostgreSQL database hosting
  • Upstash - Redis database hosting
Security & Performance
  • Rate Limiting - Redis-powered API rate limiting
  • Input Validation - Zod schema validation
  • Environment Validation - Runtime environment checks
  • Turbopack - Fast bundling and development
Development Tools
  • TanStack Query DevTools - Query debugging
  • Drizzle ORM - Type-safe database operations
  • ESLint - Code linting and formatting
  • Prettier - Code formatting with Tailwind plugin
  • TypeScript - Static type checking
  • Husky - Git hooks for code quality
  • Vitest - Fast unit testing framework
  • Testing Library - React component testing
  • Commitlint - Conventional commit validation
  • Consola - Elegant console logger

πŸ› Bug Reports

If you find a bug, please email us directly.

Email Support

Made with ❀️ for language learners worldwide