Attendance Scanner is a mobile application built with React Native and Expo that enables users to scan QR codes or barcodes for efficient attendance tracking. The app features secure user authentication with JWT token management and provides a clean, intuitive interface for managing attendance records.
- React Native (v0.81.4) - Cross-platform mobile development framework
- Expo (~54.0.10) - React Native development platform with managed workflow
- React (19.1.0) - JavaScript UI library
- React Navigation (v7.x) - Navigation library for mobile apps
@react-navigation/native- Core navigation@react-navigation/native-stack- Stack navigator for screen transitions
- NativeWind (v4.2.1) - Tailwind CSS for React Native
- Tailwind CSS (v3.3.2) - Utility-first CSS framework
- Expo Linear Gradient (~15.0.7) - Linear gradient support
- React Native Linear Gradient (v2.8.3) - Additional gradient functionality
- Expo Camera (~17.0.8) - Camera access for QR/barcode scanning
- Expo Secure Store (~15.0.7) - Secure token storage
- JWT tokens - For user authentication and authorization
- Axios (v1.12.2) - HTTP client for API requests
- @react-native-picker/picker (2.11.1) - Native picker component
- Babel (expo preset) - JavaScript transpiler
- EAS (Expo Application Services) - Build and deployment service
- 📱 QR Code Scanning - Scan attendance QR codes with device camera
- 🔐 Secure Authentication - JWT-based login with secure token storage
- 📊 Dashboard - View attendance records and statistics
- 📱 Cross-Platform - Runs on iOS, Android, and Web
- 🎨 Modern UI - Built with Tailwind CSS for beautiful design
- Node.js and npm installed
- Expo CLI installed globally (
npm install -g expo-cli)
cd attendance-scanner
npm install# Start development server
npm start
# Run on Android
npm run android
# Run on iOS
npm run ios
# Run on Web
npm run web