Progresywna aplikacja webowa typu Full-stack

Gym Tracker

Aplikacja umożliwiająca planowanie treningów, śledzenie postępów oraz generowanie spersonalizowanych planów ćwiczeń z wykorzystaniem sztucznej inteligencji.

Zakres projektu

Budowa progresywnej aplikacji webowej do zarządzania treningami od podstaw, obejmująca system autoryzacji z Google OAuth, wieloetapową konfigurację profilu użytkownika, katalog ćwiczeń, plany treningowe z możliwością ich generowania za pomocą sztucznej inteligencji oraz moduł analizy postępów z raportami. Realizacja objęła projekt bazy danych, logikę serwerową, integrację z zewnętrznym API do pobierania informacji o ćwiczeniach oraz wdrożenie interfejsu użytkownika.

Wyzwania techniczne

Implementacja kompletnego systemu autoryzacji od podstaw - rejestracja, logowanie, Google OAuth oraz mechanizm rotacji tokenów JWT z bezpiecznym zapisem tokenów odświeżających w bazie danych. Integracja z zewnętrznymi API do pobierania informacji o ćwiczeniach z warstwą cache w Redis, obejmującą dane oraz obrazy ćwiczeń, wraz z obsługą niestabilnych odpowiedzi i transformacją danych. Wdrożenie generowania planów treningowych z wykorzystaniem sztucznej inteligencji (OpenAI), z walidacją struktury odpowiedzi oraz obsługą błędów. Zaprojektowanie wieloetapowej konfiguracji użytkownika (10 kroków) z zachowaniem stanu formularza między widokami oraz spójną walidacją danych po stronie klienta i serwera.

Architektura i rozwiązania

Projekt został zorganizowany w strukturze monorepo, obejmującej trzy główne części: frontend (SPA), backend (REST API) oraz współdzieloną bibliotekę walidacji danych. Wydzielenie schematów walidacji do osobnej warstwy eliminuje duplikację kodu i zapewnia spójność danych między klientem a serwerem. Backend został zbudowany w podejściu warstwowym - z podziałem na obsługę żądań, logikę aplikacji oraz dostęp do bazy danych. Całość uzupełnia centralny system obsługi błędów, który ułatwia ich kontrolę i diagnozowanie. Dodatkowo wdrożono warstwę cache w Redis dla danych z zewnętrznego API ćwiczeń, co ogranicza liczbę zapytań i zapewnia stabilne czasy odpowiedzi niezależnie od dostępności zewnętrznych usług.

Kluczowe decyzje

  • Wdrożenie systemu JWT z rotacją tokenów odświeżających przechowywanych w bazie danych, zapewniającego bezpieczne i długotrwałe sesje użytkowników.
  • Integracja z OpenAI z walidacją struktury odpowiedzi, zapewniająca poprawność generowanych planów treningowych.
  • Ujednolicenie walidacji i zarządzania stanem formularzy między klientem a serwerem, eliminujące rozbieżności i utratę danych.
  • Zastosowanie warstwy cache w Redis dla danych z zewnętrznego API zawierającego informacje o ćwiczeniach, ograniczające liczbę zapytań i stabilizujące działanie aplikacji.

Rezultat końcowy

Dostarczenie kompletnej, produkcyjnej aplikacji full-stack: 6 tabel w bazie danych, 24 endpointy API oraz ponad 54 komponenty React. Projekt obejmuje pełny system autoryzacji z Google OAuth, integrację AI oraz pipeline CI/CD z testami jednostkowymi, integracyjnymi i E2E. Całość została zaprojektowana i wdrożona samodzielnie.

Pełna realizacja full-stack

Zakres prac: Od architektury bazy danych po wdrożenie progresywnej aplikacji webowej.

Backend

6 tabel relacyjnych, 24 endpointy API, autoryzacja JWT i Google OAuth, integracja z OpenAI oraz testy jednostkowe i integracyjne API.

Frontend

Ponad 54 komponenty React w podejściu mobile-first, z testami jednostkowymi oraz E2E.

Galeria projektu

Gym Tracker workout dashboard
Gym Tracker exercise discovery screen
Gym Tracker workout history screen
Gym Tracker mobile screens showcase