Skip to content

Arafat87/Interview-Prep-Hub

Repository files navigation

Interview Questions Hub - AI-Powered Interview Prep

A beautiful, feature-rich web application for gathering and managing interview questions with AI-powered answer generation and case study practice. Built with a stunning Neumorphism UI design.

Interview Questions Hub License

🌐 Live Demo

SITE LINK: https://interviewprephub.netlify.app/

✨ Features

πŸ“š Comprehensive Question Database

  • 45+ Pre-loaded Questions covering multiple job roles:
    • AI Engineer
    • Data Scientist
    • Data Analyst
    • AI/ML Engineer
    • Machine Learning Engineer
    • Cyber Security Engineer
    • Security Analyst
    • Penetration Tester
    • Security Architect

🎯 Question Management

  • Filter by Category: Browse questions by specific job roles
  • Filter by Type: Technical or Behavioral questions
  • Filter by Difficulty: Easy, Medium, or Hard
  • Search Functionality: Find questions by keywords or tags
  • Add Custom Questions: Create your own interview questions
  • Favorite Questions: Mark important questions for quick access
  • Export/Import: Backup and share your question database

🎴 AI Flashcard Generator (NEW!)

  • Generate from Content: Upload documents or paste text
  • Smart Question Generation: AI creates relevant interview questions
  • Multiple Input Methods:
    • Upload PDF, DOCX, or TXT files
    • Paste text directly
  • Customizable Settings:
    • Choose number of flashcards (5-20)
    • Select difficulty level
    • Pick question type
  • Batch Import: Add multiple questions at once

πŸ“– Case Study Generator (NEW!)

  • AI-Powered Scenarios: Generate realistic interview case studies
  • Three Input Methods:
    • AI Generate from topic
    • Upload files (PDF, DOCX, TXT)
    • Paste existing case studies
  • Follow-up Questions: Automatic generation of:
    • Why questions - Explore reasoning
    • What questions - Clarify concepts
    • How questions - Implementation details
    • Issues/Challenges - Edge cases
  • Interactive Tree View: Expandable question hierarchy
  • Practice Mode: Review scenarios and prepare answers

πŸ€– AI-Powered Answer Generation

  • 6 AI Providers Supported:
    • Groq (FREE - Recommended) - Fast and reliable
    • Google Gemini (FREE) - Unlimited usage
    • Hugging Face (FREE) - Open source models
    • Ollama (FREE - Local) - 100% private
    • Claude AI (Anthropic) - Advanced reasoning
    • ChatGPT (OpenAI) - Comprehensive answers
  • Context-Aware: AI considers job role, question type, and difficulty
  • Formatted Responses: Clean, readable answers with code examples
  • Custom Answers: Add your own notes and modifications

🎨 Modern Neumorphism UI Design

  • 15+ Animations: Smooth transitions and effects
  • Soft Shadows: Beautiful depth and elevation effects
  • Gradient Accents: Eye-catching color schemes
  • 3D Effects: Floating and hover animations
  • Responsive Design: Works perfectly on all devices
  • Dark/Light Themes: Choose your preferred mode

πŸ’Ύ Data Persistence

  • Local Storage: All data saved in your browser
  • No Backend Required: Fully client-side application
  • Privacy First: Your data never leaves your device
  • Export/Import: Backup and restore your data

πŸš€ Getting Started

Prerequisites

  • A modern web browser (Chrome, Firefox, Safari, Edge)
  • API keys for AI features (FREE options available):
    • Groq API (Recommended - FREE): Get Key
    • Google Gemini (FREE): Get Key
    • Or use paid options (OpenAI, Anthropic)

Installation

  1. Download the Application

    • Clone or download this repository
    • Keep the folder structure intact
  2. Open the Application

    • Simply open index.html in your web browser
    • No server or installation required!
  3. Configure AI Integration

    • Click the Settings button in the header
    • Add your API key (Groq recommended for FREE usage)
    • Click Save Settings

πŸ“– How to Use

Browsing Questions

  1. Use the filter pills to narrow down questions
  2. Use the search bar to find specific questions
  3. Click on any question card to view details and generate answers

Generating Flashcards

  1. Click Generate Flashcards button
  2. Choose input method:
    • Upload a document
    • Paste text content
  3. Configure settings (count, difficulty, type)
  4. Click Generate Flashcards
  5. Review and save selected flashcards

Creating Case Studies

  1. Click Case Studies tab
  2. Click Generate Case Study button
  3. Choose input method:
    • AI Generate (enter topic)
    • Upload file
    • Paste content
  4. Select follow-up question types
  5. Generate and review
  6. Save to your collection

Generating AI Answers

  1. Click on a question card
  2. Choose your AI provider (Groq recommended)
  3. Wait for AI to generate answer
  4. Save the response

πŸ”‘ Getting FREE API Keys

Groq API (Recommended - FREE)

  1. Visit Groq Console
  2. Sign up for free account
  3. Create API key
  4. Copy and paste in Settings

Benefits: Fast, reliable, generous free tier

Google Gemini (FREE)

  1. Visit Google AI Studio
  2. Sign in with Google account
  3. Create API key
  4. Copy and paste in Settings

Benefits: Unlimited free usage

Ollama (FREE - Local)

  1. Install Ollama
  2. Run locally on your machine
  3. 100% free and private
  4. No API key needed

🎨 Customization

Themes

  • Switch between Light and Dark themes in Settings
  • Modern gradient effects and animations
  • Neumorphic design elements

Adding Questions

  • Use the Add Question button
  • Import from JSON files
  • Generate with AI from content

πŸ“± Browser Compatibility

  • βœ… Chrome 90+
  • βœ… Firefox 88+
  • βœ… Safari 14+
  • βœ… Edge 90+

πŸ”’ Privacy & Security

  • Local Storage Only: All data stored in browser
  • No Tracking: No analytics or tracking
  • API Keys: Stored locally, never shared
  • Open Source: Full transparency

πŸ’‘ Tips for Best Results

For Flashcard Generation

  • Use clear, well-structured content
  • Aim for 500-2000 words for best results
  • Review and edit generated questions

For Case Studies

  • Be specific with topics
  • Choose appropriate complexity level
  • Practice answering out loud

For Interview Prep

  1. Start with Easy questions
  2. Progress to Medium and Hard
  3. Focus on your target role
  4. Review favorites regularly
  5. Practice with case studies

πŸ› οΈ Technical Stack

  • HTML5: Semantic markup
  • CSS3: Neumorphism design with animations
  • Vanilla JavaScript: No frameworks
  • Local Storage API: Data persistence
  • Fetch API: AI integration
  • PDF.js: PDF text extraction
  • Mammoth.js: DOCX text extraction
  • Font Awesome: Icons

πŸ“„ File Structure

interview-questions-app/
β”œβ”€β”€ index.html                    # Main HTML file
β”œβ”€β”€ css/
β”‚   β”œβ”€β”€ styles.css               # Main styles
β”‚   β”œβ”€β”€ modern-enhancements.css  # Modern animations
β”‚   └── case-study.css           # Case study styles
β”œβ”€β”€ js/
β”‚   β”œβ”€β”€ app.js                   # Main application logic
β”‚   β”œβ”€β”€ ai-integration.js        # AI API integration
β”‚   β”œβ”€β”€ data.js                  # Default questions
β”‚   └── case-study-data.js       # Case study data
β”œβ”€β”€ README.md                     # This file
β”œβ”€β”€ CASE_STUDY_GUIDE.md          # Case study documentation
β”œβ”€β”€ FREE_AI_SETUP_GUIDE.md       # AI setup guide
β”œβ”€β”€ MODERN_DESIGN_FEATURES.md    # Design documentation
└── TESTING_GUIDE.md             # Testing guide

🎯 New Features in Latest Update

βœ… Case Study Generator

  • AI-generated interview scenarios
  • Follow-up question system
  • Expandable question tree
  • Multiple input methods

βœ… Enhanced Flashcard Generator

  • Support for all FREE AI providers
  • File upload (PDF, DOCX, TXT)
  • Batch generation and import
  • Preview and edit before saving

βœ… Modern Design Enhancements

  • 15+ new animations
  • Gradient effects
  • 3D hover effects
  • Improved responsiveness

βœ… FREE AI Integration

  • Groq API support (recommended)
  • Google Gemini support
  • Hugging Face support
  • Ollama local support

🀝 Contributing

Contributions are welcome! Feel free to:

  • Add more questions
  • Implement new features
  • Improve UI/UX
  • Fix bugs

πŸ“ License

This project is open source and available under the MIT License.

πŸ™ Acknowledgments

  • Groq for fast FREE AI inference
  • Google for Gemini API
  • OpenAI for ChatGPT API
  • Anthropic for Claude API
  • Font Awesome for icons
  • PDF.js and Mammoth.js for file processing

πŸ“ž Support

For issues or questions:

  1. Check the documentation files
  2. Review the testing guide
  3. Check browser console for errors
  4. Ensure API keys are configured

🎯 Future Enhancements

  • Spaced repetition system
  • Mock interview timer
  • Voice recording practice
  • Progress tracking
  • Community sharing
  • Multiple language support

Happy Interview Prep! πŸš€

Built with ❀️ for interview success. Practice regularly, understand deeply, and ace your interviews!

About

Behavioral and Technical Interview Questions Prep Web App

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

No releases published

Packages

 
 
 

Contributors