DEV Community

Abed Putra
Abed Putra

Posted on

Revolutionize Your Attendance Management: A Complete QR Code Solution for WordPress and Mobile

#wordpress #flutter

How I Built an Open-Source Attendance System That Eliminates Manual Tracking Forever

The Problem That Started It All

Picture this: You're managing a team of 50 employees, or running a school with hundreds of students. Every morning, you're dealing with:

  • 📝 Manual sign-in sheets that get lost or damaged
  • ⏰ Time-consuming roll calls that eat up valuable minutes
  • 📊 Spreadsheets that require constant manual updates
  • 🚫 No way to verify if someone actually showed up on time
  • 📍 No location tracking to prevent buddy punching
  • 💰 Expensive proprietary software with monthly subscriptions

Sound familiar? I've been there too. That's why I decided to build something better — a complete, open-source attendance management system that's free, powerful, and actually works.

Introducing: Attendance with QR Code

I'm excited to share Attendance with QR Code — a comprehensive solution that combines a WordPress plugin with a Flutter mobile app to create the most efficient attendance tracking system you've ever used.

🔗 Check out the repositories:

Why This Solution is Different

🎯 It's Actually Complete

Unlike other solutions that require you to piece together multiple tools, this is a complete end-to-end system:

  • WordPress Plugin: Handles all backend management, QR code generation, and reporting
  • Flutter Mobile App: Provides a beautiful, native mobile experience for scanning and check-in/check-out
  • Seamless Integration: They work together perfectly out of the box

🚀 Zero Monthly Fees

This is 100% open-source under GPL v2 license. No subscriptions, no hidden costs, no vendor lock-in. You own it completely.

🔒 Security First

  • Server-side time validation (prevents time manipulation)
  • GPS location tracking (prevents buddy punching)
  • Security key authentication
  • Input sanitization and SQL injection protection
  • WordPress nonce verification

📱 Modern Mobile Experience

The Flutter app isn't an afterthought — it's a first-class citizen with:

  • Beautiful Material Design UI
  • Offline support with local database
  • Real-time GPS accuracy indicators
  • One-tap check-in/check-out
  • Complete attendance history

Key Features That Will Blow Your Mind

For Administrators (WordPress Plugin)

✨ QR Code Generation

  • Generate unique QR codes for each employee/student
  • One-click download and print
  • Automatic name validation
  • Complete QR code history management

📊 Comprehensive Reporting

  • Search by name or date range
  • Automatic calculation of:
    • Work hours
    • Overtime hours
    • Late arrivals
    • Early departures
  • Export to CSV or XLSX with one click
  • Beautiful, responsive admin interface

⚙️ Flexible Configuration

  • Set custom work hours
  • Timezone support for accurate tracking
  • WordPress user integration (import names automatically)
  • Security key management
  • Mobile app configuration QR code

For Employees/Students (Flutter Mobile App)

📸 Lightning-Fast QR Scanning

  • Instant QR code recognition
  • Works in various lighting conditions
  • Clear visual feedback

📍 GPS Location Tracking

  • Automatic location recording
  • Real-time accuracy indicator
  • Prevents attendance fraud
  • Location history for verification

💾 Offline Support

  • Works without internet connection
  • Local database storage
  • Automatic sync when online
  • View complete attendance history offline

🎨 Beautiful User Experience

  • Modern Material Design
  • Intuitive navigation
  • Progress indicators
  • Clear success/error messages
  • Splash screen and smooth animations

How It Works (The Magic Behind the Scenes)

Step 1: Setup (One-Time Configuration)

  1. Install WordPress Plugin

    • Upload to your WordPress site
    • Activate and configure settings
    • Set work hours and timezone
    • Generate security key

  2. Generate QR Codes

    • Create unique QR codes for each person
    • Print and distribute

  3. Configure Mobile App

    • Install the Flutter app
    • Scan configuration QR code from WordPress
    • App automatically connects to your server

Step 2: Daily Usage (Super Simple)

Check-In:

  1. Open mobile app
  2. Tap "Check-In"
  3. Wait for GPS to be accurate
  4. Scan personal QR code
  5. Done! ✅

Check-Out:

  1. Open mobile app
  2. Tap "Check-Out"
  3. Scan personal QR code
  4. Done! ✅

The system automatically:

  • Records server-side time (can't be manipulated)
  • Captures GPS location
  • Calculates work hours
  • Detects late arrivals or early departures
  • Tracks overtime

Step 3: Reporting (Powerful Analytics)

  • View all attendance records
  • Filter by name or date
  • Export to Excel/CSV
  • See complete location history
  • Track patterns and trends

Technical Excellence

WordPress Plugin Architecture

Built following WordPress coding standards:

  • ✅ Proper sanitization and escaping
  • ✅ Prepared statements (SQL injection protection)
  • ✅ Nonce verification
  • ✅ Capability checks
  • ✅ Clean, maintainable code structure

Flutter Mobile App Architecture

Built with modern Flutter best practices:

  • ✅ Clean architecture pattern
  • ✅ Null safety (Dart 3.0+)
  • ✅ Local SQLite database
  • ✅ RESTful API integration
  • ✅ Comprehensive error handling
  • ✅ Material Design 3

Security Features

  • Server-Side Time: Date/time determined by WordPress server (prevents manipulation)
  • Security Key: All API requests require authentication
  • Location Verification: GPS coordinates recorded for every attendance
  • Input Validation: Client and server-side validation
  • SQL Injection Protection: All queries use prepared statements

Real-World Use Cases

🏢 Small Business (10-50 Employees)

  • Track daily attendance
  • Calculate payroll hours
  • Monitor punctuality
  • Export reports for accounting

🏫 Schools & Universities

  • Student attendance tracking
  • Class participation records
  • Parent notifications (can be extended)
  • Academic reporting

🏭 Manufacturing & Warehouses

  • Shift management
  • Overtime tracking
  • Location verification
  • Compliance reporting

🏥 Healthcare Facilities

  • Staff attendance
  • Shift scheduling
  • Compliance documentation
  • Time tracking for billing

Why Open Source Matters

I built this as open-source because:

  1. Transparency: You can see exactly how it works
  2. Customization: Modify it to fit your specific needs
  3. No Vendor Lock-In: You're not tied to a subscription
  4. Community: Others can contribute and improve it
  5. Learning: Developers can learn from the code

This is your system. Own it. Customize it. Make it yours.

Getting Started

For WordPress Plugin 

# Clone the repository
git clone https://github.com/abedputra/Attendance-QR-Plugin-Wordpress.git

# Upload to WordPress
# Navigate to wp-content/plugins/
# Upload the attendance_with_qr_code folder
Enter fullscreen mode Exit fullscreen mode

Full documentation: https://github.com/abedputra/Attendance-QR-Plugin-Wordpress

For Flutter Mobile App 

# Clone the repository
git clone https://github.com/abedputra/Attendance-QR-Flutter-App.git

# Install dependencies
cd Attendance-QR-Flutter-App
flutter pub get

# Run the app
flutter run

# Build APK
flutter build apk --release
Enter fullscreen mode Exit fullscreen mode

Full documentation: https://github.com/abedputra/Attendance-QR-Flutter-App

What's Next?

I'm continuously improving this system. Here's what's coming:

  • 🔔 Push notifications for attendance reminders
  • 📧 Email reports automation
  • 📊 Advanced analytics dashboard
  • 🌐 Multi-language support
  • 🔐 Biometric authentication options
  • 📱 iOS app optimization
  • ☁️ Cloud sync enhancements

Want to contribute? Pull requests are welcome! Check out the contribution guidelines in the repositories.

The Bottom Line

If you're tired of:

  • ❌ Expensive attendance software
  • ❌ Manual tracking methods
  • ❌ Incomplete solutions
  • ❌ Security concerns
  • ❌ Poor mobile experience

Then this solution is for you.

It's free. It's open-source. It's complete. And it works.

Ready to Transform Your Attendance Management?

🔗 Get Started Now:

⭐ Star the repositories if you find this useful — it helps others discover the project!

🐛 Found a bug? Open an issue on GitHub.

💡 Have a feature request? Let's discuss it!

🤝 Want to contribute? Pull requests are always welcome!

About the Developer

Hi! I'm Abed Putra, a developer passionate about creating open-source solutions that solve real problems.

I built this system because I needed it, and I'm sharing it because I believe in the power of open-source software to make everyone's life easier.

Final Thoughts

Attendance management doesn't have to be complicated or expensive. With the right tools, it can be:

  • ⚡ Fast: Check-in in seconds
  • 🔒 Secure: Server-side validation and GPS tracking
  • 📊 Accurate: Automatic calculations, no human error
  • 💰 Affordable: Completely free and open-source
  • 🎯 Complete: Everything you need in one solution

Try it today. You'll never go back to manual tracking.

If you found this article helpful, please share it with others who might benefit from this solution. And don't forget to star the GitHub repositories! ⭐

Happy tracking! 🚀

Top comments (0)