CitewiseAI - Your Comprehensive Study & Career Assistant

A cutting-edge, AI-powered platform built with React and modern technologies to revolutionize learning, research, and career development.

🚀 Key Features

Learning & Research Tools

• AI PDF Summarizer: Transform lengthy PDFs into concise, intelligent summaries with interactive Q&A capabilities
• Theory Platform: Extract and understand key concepts, definitions, and theories from academic materials
• Research Study Assistant: Streamline research with efficient paper analysis and organization
• YouTube Lecture Summary: Convert video lectures into structured, text-based summaries
• Smart Test Generator: Create personalized practice tests with detailed analytics (Beta)

Career Development

• AI Career Platform:
  • Resume optimization with ATS analysis
  • Tailored interview preparation
  • Personalized project suggestions
  • Career path exploration
  • Market insights and salary guidance

Core Technology

• React 18: Modern functional components with hooks
• Tailwind CSS: Responsive, utility-first styling
• OpenRouter AI: Advanced language models for intelligent processing
• Framer Motion: Smooth, professional animations
• Real-time Processing: Stream-based AI responses for immediate feedback

🛠️ Installation & Setup

Prerequisites

• Node.js (v16 or higher)
• npm or yarn

🛠️ Technical Architecture

Project Structure

src/
├── components/         # Reusable UI components
├── context/           # React context (theme, auth)
├── pages/             # Feature-specific pages
│   ├── learning/      # Learning tools
│   ├── career/        # Career development
│   └── research/      # Research assistance
├── services/          # API integrations
└── utils/            # Helper functions

Key Technologies

• Frontend: React 18, React Router v6
• Styling: Tailwind CSS, Framer Motion
• AI Integration: OpenRouter API
• File Handling: React Dropzone
• State Management: React Context
• Notifications: React Hot Toast

💡 Smart Features

PDF Processing

• Intelligent text extraction
• Key concept identification
• Interactive Q&A system
• Study material organization

Career Tools

• ATS-optimized resume builder
• Interview question generation
• Project recommendation engine
• Career path analysis
• Market trend insights

Learning Assistance

• Smart test generation
• YouTube lecture analysis
• Research paper summarization
• Study progress tracking
• Custom flashcard creation

🎨 UI/UX Design

Theme System

• Light/Dark mode support
• Consistent color palette
• Responsive design system
• Smooth animations
• Modern, clean interfaces

Components

• Smart data cards
• Interactive forms
• Progress indicators
• Loading states
• Toast notifications

� Getting Started

Prerequisites

• Node.js 16+
• npm/yarn
• OpenRouter API key

Installation

# Clone repository
git clone https://github.com/yourusername/citewise-ai.git

# Install dependencies
cd citewise-ai
npm install

# Set up environment
cp .env.example .env
# Add your API keys to .env

# Start development
npm run dev

⚙️ Configuration

Environment Variables

REACT_APP_OPENROUTER_API_KEY=your_api_key
REACT_APP_SITE_URL=your_site_url
REACT_APP_SITE_NAME=CitewiseAI

API Integration

The platform uses OpenRouter API for AI capabilities:

• Text generation & analysis
• Document processing
• Q&A systems

REACT_APP_API_URL=your_api_url_here
REACT_APP_AI_SERVICE_KEY=your_ai_service_key

📱 Responsive Design

The application is fully responsive and optimized for:

• Desktop: Full-featured experience with sidebar navigation
• Tablet: Adapted layout with touch-friendly interactions
• Mobile: Mobile-first design with optimized navigation

🌙 Dark Mode

The application supports automatic dark mode detection and manual toggle:

• System preference detection
• Manual toggle in navigation
• Persistent user preference
• Smooth transitions between modes

🔍 SEO Optimization

• Meta Tags: Comprehensive meta tags for all pages
• Structured Data: JSON-LD structured data for search engines
• Open Graph: Social media sharing optimization
• Sitemap: Auto-generated sitemap for better indexing

🚀 Performance

• Code Splitting: Automatic code splitting with React Router
• Lazy Loading: Images and components loaded on demand
• Optimized Assets: Compressed images and optimized fonts
• Caching: Efficient caching strategies for better performance

🤝 Contributing

We welcome contributions! Please follow these steps:

1. Fork the repository
2. Create a feature branch (git checkout -b feature/amazing-feature)
3. Commit your changes (git commit -m 'Add amazing feature')
4. Push to the branch (git push origin feature/amazing-feature)
5. Open a Pull Request

Development Guidelines

• Follow React best practices and hooks
• Use Tailwind CSS for styling
• Add proper TypeScript types (if using TS)
• Write meaningful commit messages
• Test your changes thoroughly

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.

🙏 Acknowledgments

• React Team for the amazing framework
• Tailwind CSS for the utility-first CSS framework
• Framer Motion for smooth animations
• Lucide for beautiful icons
• LPU Community for support and feedback

📞 Support

• Email: support@rmslpu.xyz
• GitHub Issues: Report a bug
• Documentation: Wiki

🔮 Roadmap

Upcoming Features

• AI Test Generator: Personalized practice tests
• Real-time Collaboration: Study groups and discussions
• Mobile App: Native mobile application
• Advanced Analytics: Detailed progress tracking
• Integration APIs: Connect with other educational platforms

Version History

• v2.0.0: Complete React rewrite with modern design
• v1.0.0: Original HTML/CSS/JS version

---

Made with ❤️ for students by students