Attendance App

Attendance App is designed to provide a seamless and intuitive experience for both teachers and students, emphasizing practicality, efficiency, and simplicity. Its core functionalities include creating and editing the courses, as well as effectively monitoring and managing student attendance.

https://metropolia-attendance-app.vercel.app

Key Features

• Course Management: Teachers can create, modify, and manage courses.
• Teacher Collaboration: Ability to assign multiple teachers to a course.
• Attendance Tracking (under development): Students can mark attendance using QR codes.
• Data Visualization (under development): Attendance data is available for review and management.

Screenshots

Technical Stack

• Frontend: React, MUI v5, and Vite for a fast, modern UI.
• Backend: Supabase and for backend services including database and authentication.
• Metropolia Opendata and Users API: Integration with Metropolia Users API to authenticate and verify Metropolia students and staff.
• PWA Support: Implemented using Vite PWA Plugin.

Local Development Setup

To set up and develop the Attendance App locally, follow these steps:

Prerequisites

• Node.js (v18 or later)

Clone the Repository

First, clone the repository to your local machine:

git clone https://github.com/gromov-ivan/attendance-app.git
cd attendance-app

Environment Variables, Supabase Setup, and Metropolia API

1. Create a .env.local file in the root directory of the project.

This file should contain the following environment variables:

• VITE_SUPABASE_URL: The URL of your Supabase project.
• VITE_SUPABASE_ANON_KEY: The anonymous key for your Supabase project.
• VITE_API_KEY_METROPOLIA: The API key for the Metropolia API.

Your .env.local file should look like this:

VITE_SUPABASE_URL=your_supabase_url
VITE_SUPABASE_ANON_KEY=your_supabase_anon_key
VITE_API_KEY_METROPOLIA=your_metropolia_api_key

2. Supabase setup

To obtain the values for VITE_SUPABASE_URL and VITE_SUPABASE_ANON_KEY:

• Create a Supabase project.
• Set up the database schema.
• Get the API Keys.

For detailed database instructions and SQL commands, see the Attendace App Database Setup Guide.

3. Metropolia API setup

To get the Metropolia API key for VITE_API_KEY_METROPOLIA, follow the instructions in the Metropolia guide.

Install Dependencies

Install the necessary npm packages:

npm install

Run the Application

To start the development server:

npm run dev

Contributing

Contributions are welcome. Please open issues for any bugs or feature requests and submit pull requests for any improvements.

License

This project is licensed under the MIT License.