saulprl's portfolio

CSI PRO ACCESS

Fully featured security and access-control system

Tech stack

JavaScript

TypeScript

React

Vite

Firebase

React Native

Expo

Additional technologies

Dart

Flutter

Period

February 2023 - Present

Links

Mobile app repoWeb app repoCSI PRO ACCESS

Project Background

CSI PRO ACCESS is a security and access-control system developed within the CSI PRO Laboratory in Universidad de Sonora.

This project started as an experiment to attempt to build a system that allowed us to open the laboratory's door without having to use a key, since CSI PRO was steadily growing at the time and we didn't really have the resources to provide everyone with a key. Additionally, achieving this would make it more convenient to access the laboratory and would provide us with a reliable way of tracking who has entered.

App features

  • Login with Google or GitHub
  • Real-time access logs
  • Support for multiple rooms
  • Role-based permissions
  • Ability to grant or remove access to specific users

How it works

CSI PRO ACCESS consists of many different scripts and apps. Firstly, a Python script that handles the user input coming from a keypad and controls the door's electric lock. The script communicates with a Node.js RESTful API which, in turn, communicates with the Firebase services to validate the user input.

I developed a Next.js webapp that displays the 20 latest access logs in real-time for us to see from inside the laboratory.

After the keypad method was stable, I coded a new Python script that leveraged Bluetooth to authenticate and access the lab. To take advantage of it, I developed the CSI PRO ACCESS mobile app with Flutter with OAuth authentication via Firebase and a more sophisticated data layer.

As the project grew, I decided to migrate the mobile experience to React Native because I wanted to explore it as a Flutter alternative, leading to providing a better user experience overall. At the same time, I developed a PWA with Vite for iOS users.

Gallery

Cover image for CSI PRO ACCESS project card
Screenshot of CSI PRO ACCESS Dashboard screen
Screenshot of CSI PRO ACCESS Logs screen
Screenshot of CSI PRO ACCESS Members screen for admins
Screenshot of CSI PRO ACCESS Requests screen for admins
Slide 0 of 0