sabique@portfolio:~$ cat projects/pixiefie.md
Pixiefie
Generates branded, shareable ID cards from GitHub and Reddit handles. Fetches profile pic, name, and username; embeds live QR code.
Next.jsTailwind CSSVercelQR CodeGitHubReddit
Pixiefie
A modern web application that generates beautiful, branded ID cards from social media profiles. Simply enter your GitHub or Reddit username, and Pixiefie creates a shareable digital ID card complete with your profile information and a live QR code.
Overview
Pixiefie bridges the gap between digital identity and physical networking by creating visually appealing ID cards that can be shared both digitally and in print. The application leverages social media APIs to fetch authentic profile data and generates high-quality, customizable ID cards suitable for conferences, meetups, and professional networking.
Key Features
Multi-Platform Support
- •GitHub Integration: Fetches user profiles, repositories, and contribution data
- •Reddit Integration: Retrieves user information, karma, and community activity
- •Universal QR Codes: Generated QR codes link directly to social profiles
- •Cross-Platform Compatibility: Works seamlessly across all devices
Dynamic Card Generation
- •Real-time Data Fetching: Live profile information retrieval
- •Responsive Design: Cards automatically adapt to different screen sizes
- •High-Quality Output: Print-ready resolution for physical cards
- •Instant Preview: Real-time card preview as you customize
Customization Options
- •Multiple Themes: Professional, casual, and vibrant design options
- •Color Schemes: Customizable accent colors and backgrounds
- •Layout Variants: Different card layouts for various use cases
- •Branding Elements: Add company logos or event branding
Technology Stack
Frontend
- •Next.js 14: React framework with App Router
- •Tailwind CSS: Utility-first CSS framework
- •TypeScript: Type-safe JavaScript development
- •Framer Motion: Animation library
Libraries & APIs
- •QRCode.react: QR code generation
- •html2canvas: Screenshot generation
- •jsPDF: PDF export functionality
- •GitHub API: Profile data fetching
- •Reddit API: User information retrieval
Deployment
- •Vercel: Hosting and deployment platform
- •GitHub Actions: CI/CD pipeline
- •Vercel Analytics: Performance monitoring