STK Opatija-08 Platforma za Upravljanje Klubom

Izazov

STK Opatija-08, stolnoteniski sportski klub u Opatiji, Hrvatska, trebao je modernizirati svoje poslovanje i online prisutnost. Njihov postojeći tijek rada oslanjao se na ručne procese i fragmentirane alate koji nisu mogli pratiti rastuću zajednicu kluba.

• Ručno upravljanje događajima: Upravljanje ponavljajućim treninzima, turnirima i događajima preko više trenera i razina vještina bilo je dugotrajno i podložno greškama
• Raspršeni podaci igrača: Informacije o igračima, postignuća i statistike bili su raspršeni po tablicama bez jedinstvenog izvora istine
• Bez web prisutnosti: Klub nije imao profesionalnu web stranicu za privlačenje novih članova i prezentaciju zajednice
• Administrativno opterećenje: Zadaci su zahtijevali značajan ručni napor bez kontrole pristupa temeljene na ulogama

Naš Pristup

Dizajnirali smo i izgradili sveobuhvatnu full-stack platformu koja služi i kao javna web stranica kluba i kao njihov interni sustav upravljanja.

• Jedinstvena Arhitektura: Jedna Next.js 15 aplikacija s App Routerom koja poslužuje javne stranice i admin nadzornu ploču, omogućujući ponovnu upotrebu koda i dosljedan UX
• Robustan Sustav Događaja: Implementirali RFC 5545 RRULE specifikaciju za kompleksne ponavljajuće događaje s prilagodbom po pojavljivanju i praćenjem otkazivanja
• Dizajn Sigurnost-Prvo: Row-Level Security (RLS) politike u PostgreSQL-u osiguravaju izolaciju podataka, u kombinaciji s JWT autentifikacijom i kontrolom pristupa temeljenoj na ulogama
• Optimizirani Medijski Pipeline: Cloudinary integracija s automatskom optimizacijom slika, blurhash placeholderima i responzivnim varijantama za brzo učitavanje
• Spremno za Internacionalizaciju: Izgrađeno s next-intl od početka za podršku hrvatskom i budućem proširenju jezika

Ključne Značajke

• Upravljanje Ponavljajućim Događajima: Puna RRULE podrška za kompleksne rasporede (dvotjedni treninzi, mjesečni turniri) s individualnim overrideovima pojavljivanja i praćenjem otkazivanja
• Profili Igrača i Postignuća: Sveobuhvatan direktorij igrača s fotografijama, statistikama, postignućima i sezonskim praćenjem performansi
• Bogato Uređivanje Sadržaja: Tiptap WYSIWYG editor s AI poboljšanjem teksta putem Google Gemini integracije za poliranje sadržaja
• Sustav Medijske Galerije: Organizirane galerije s drag-and-drop preslagivanjem, lightbox pregledima i automatskom optimizacijom slika
• Admin Nadzorna Ploča Temeljena na Ulogama: Prilagodljiva nadzorna ploča s widgetima, podržava SUPER_ADMIN, ADMIN, EDITOR i VIEWER uloge
• Prijave na Događaje i Obavijesti: Članovi se mogu prijaviti na događaje s email potvrdom putem Resenda
• Kalendari za Ispis: Izvoz tjednih i mjesečnih prikaza kalendara optimiziranih za ispis

Rezultati

Platforma je transformirala način na koji STK Opatija-08 posluje i komunicira sa svojom zajednicom:

• 35+ modela baze podataka pokreće sveobuhvatno upravljanje klubom
• 150+ prilagođenih React komponenti za dosljedan, pristupačan UI
• 37+ admin stranica za potpunu operativnu kontrolu
• 4 korisničke uloge s detaljnim upravljanjem dozvolama
• Real-time upravljanje događajima s podrškom za ponavljajuće rasporede

Tehnička Arhitektura

Moderna full-stack arhitektura izgrađena za performanse, sigurnost i održivost:

| Sloj | Tehnologije | |------|-------------| | Frontend | Next.js 15 App Router, TypeScript, Tailwind CSS, Radix UI, Framer Motion, TanStack Table, Tiptap Editor, Embla Carousel, dnd-kit | | Backend | Next.js API Routes, Prisma ORM, PostgreSQL s Row-Level Security, NextAuth.js v5, Zod validacija | | Infrastruktura | Supabase (PostgreSQL), Cloudinary (Medijski CDN), Resend (Transakcijski Email), Google Gemini (AI poboljšanje teksta) |

Tehnički Naglasci

Ovaj projekt prikazuje nekoliko naprednih implementacija:

Row-Level Security: Kontrola pristupa na razini baze podataka korištenjem PostgreSQL RLS politika s injekcijom konteksta sesije, osigurava izolaciju podataka bez filtriranja na razini aplikacije.

Kompleksno Zakazivanje Događaja: Puna RFC 5545 RRULE implementacija s ekspanzijom serija, overrideovima pojavljivanja i rukovanjem otkazivanja za fleksibilne ponavljajuće događaje.

Pipeline Optimizacije Medija: Automatska generacija blurhasha, ekstrakcija dominantne boje i responzivne varijante slika osiguravaju brzo učitavanje na svim uređajima.

Tipski Siguran Full Stack: End-to-end TypeScript sa Zod shemama dijeljenim između klijentske i serverske validacije eliminira runtime tipske greške.

CMS i Admin Iskustvo

Platforma uključuje sveobuhvatan sustav za upravljanje sadržajem izgrađen posebno za rad sportskih klubova:

Iskustvo Nadzorne Ploče

• Prilagodljivi Raspored Widgeta: Drag-and-drop nadzorna ploča s promjenjivim widgetima koji prikazuju nadolazeće događaje, nedavnu aktivnost, statistiku članova i brze akcije
• Prikazi Specifični za Ulogu: Nadzorna ploča se prilagođava na temelju korisničke uloge—urednici vide redove sadržaja dok admini vide zdravlje sustava i upravljanje korisnicima
• Feed Aktivnosti: Real-time tok aktivnosti koji prikazuje nedavne promjene na platformi s brzom navigacijom do zahvaćenih stavki

Upravljanje Sadržajem

• Rich Text Editor: Tiptap editor s alatnom trakom za formatiranje, ugrađivanje slika, tablice i AI poboljšanje teksta putem Google Gemini
• Workflow Skica/Objava: Sadržaj prolazi kroz stanja skica → pregled → objavljeno s podrškom za zakazano objavljivanje
• Povijest Verzija: Potpuna povijest revizija s diff prikazima i povratom na prethodne verzije jednim klikom
• SEO Alati: Ugrađeni editor meta opisa, prilagodba sluga i odabir Open Graph slike

Medijska Biblioteka

• Centralizirano Upravljanje Imovinom: Sve slike organizirane u pretraživoj biblioteci s mapama, oznakama i automatskom ekstrakcijom metapodataka
• Skupno Učitavanje: Drag-and-drop više datoteka s praćenjem napretka i automatskom optimizacijom
• Editor Slika: In-browser izrezivanje, rotacija i odabir žarišne točke za responzivne varijante slika
• Praćenje Korištenja: Pogledajte gdje se svaka imovina koristi na stranici s automatskim otkrivanjem nekorištenih resursa

Administracija Događaja

• Vizualno Sučelje Kalendara: Prikazi mjesec/tjedan/dan s drag-and-drop kreiranjem i preraspoređivanjem događaja
• Predlošci Ponavljajućih Događaja: Kreirajte predloške za redovite treninge s rukovanjem iznimkama za praznike
• Upravljanje Prijavama: Pregledajte i izvezite liste sudionika, šaljite skupne komunikacije i pratite kapacitet
• Otkrivanje Konflikata: Automatska upozorenja pri zakazivanju preklapajućih događaja za isto mjesto ili trenera

Upravljanje Igračima

• Graditelj Profila: Sveobuhvatni profili igrača s fotografijama, biografijom, igračkom poviješću i značkama postignuća
• Praćenje Statistika: Zapisujte rezultate utakmica, rangiranja i metrike performansi s automatskim generiranjem ljestvice
• Pohrana Dokumenata: Priložite liječničke potvrde, članske ugovore i druge dokumente profilima igrača
• Skupne Operacije: Uvoz/izvoz podataka igrača, slanje grupnih komunikacija i upravljanje statusom članstva u serijama

Dodatne Admin Značajke

• Upravljanje Korisnicima: Pozovite nove korisnike, dodijelite uloge i upravljajte dozvolama uz revizijsko zapisivanje
• Postavke Stranice: Konfigurirajte informacije o klubu, kontakt podatke, društvene linkove i brendiranje s centralne lokacije
• Predlošci Emaila: Prilagodite automatizirane email predloške za potvrde događaja, poruke dobrodošlice i obavijesti
• Analytics Nadzorna Ploča: Pregledajte preglede stranica, popularan sadržaj i metrike angažmana korisnika putem integrirane analitike