Informatii generale
- Categorie: Web
- Judetul: Vâlcea
- Surse: GitHub - DumitrescuDarius/CODEKNIGHTS · GitHub
- Homepage: https://codeknightsweb.netlify.app/
Descriere
CODEKNIGHTS este o platformă interactivă de programare creată pentru toată lumea – de la programatorii casual, până la cei competitivi care caută provocări de top.
Fie că vrei să îți exersezi abilitățile de codare într-un ritm relaxat pentru a învăța lucruri noi, fie că vrei să te duelezi 1 VS 1 în timp real pentru a urca în clasamentele globale, CODEKNIGHTS îți oferă spațiul ideal. Cu o interfață modernă, modulara și ușor de folosit, platforma transformă scrierea de cod într-o experiență captivantă și accesibilă, indiferent de nivelul tău de experiență.
Tehnologii
Frontend (Interfața Utilizatorului)
• React – Biblioteca principală (UI library) pe baza căreia este construită interfața, folosind o abordare bazată pe componente
reutilizabile și gestionarea eficientă a stărilor (State Management).
• Next.js – Framework-ul care îmbracă React-ul. Oferă structura principală a aplicației (App/Pages Router), randare super-rapidă
și unificarea frontend-ului cu backend-ul într-un singur proiect.
• TypeScript – Limbajul de bază al întregului proiect (un superset de JavaScript). Adaugă “type-safety” (tipizare strictă), ceea
ce previne mii de erori încă din faza de scriere a codului și oferă o dezvoltare mult mai stabilă.
• Vanilla CSS – În loc să folosească framework-uri masive (precum Bootstrap), aplicația folosește CSS pur. Această decizie
garantează performanță maximă de randare, libertate totală în crearea layout-urilor complexe (precum sistemul de ferestre) și o
implementare ușoară a sistemelor de culori dinamice prin variabile (CSS Variables).
• Framer Motion – Librăria „magică” din spatele tuturor animațiilor. Este responsabilă pentru deschiderea fluidă a ferestrelor,
efectele de drag-and-drop, tranzițiile paginilor și notificările care apar pe ecran.
• Lucide React – O bibliotecă modernă de iconițe vectoriale (SVG). Toate iconițele din platformă (săbii, trofee, scuturi) provin
de aici, fiind extrem de ușoare, scalabile și rapid de încărcat.
Backend & Managementul Datelor
• Next.js API Routes (Serverless) – Tot backend-ul (logica din spate) este construit direct în Next.js. Endpoint-urile (rutele
de API) se transformă automat în funcții Serverless. Asta înseamnă că serverul „prinde viață” exact când este chemat (la
compilare, trimitere de duel, etc.) și nu consumă resurse stând degeaba.
• Prisma ORM – Este puntea de legătură între codul aplicației și baza de date. Oferă interogări 100% type-safe și facilitează
gestionarea schemelor (tabelelor) de date, fără a fi nevoie să scrii cod SQL manual.
• PostgreSQL – Baza de date relațională aleasă pentru stocare. Este extrem de robustă și rapidă, ideală pentru a salva în
siguranță zeci de mii de date legate de rating-ul ELO, istoricul meciurilor și conturile utilizatorilor.
• NextAuth.js – Serviciul de securitate și management al sesiunilor. Gestionează tot procesul de login, generarea token-urilor
sigure și criptarea sesiunilor.
Servicii Externe & Securitate (Execuția Codului)
• Docker (Containers / Sandboxing) – Una dintre cele mai importante piese din puzzle. Când un utilizator trimite un cod, acesta
nu rulează direct pe server (ar fi un risc uriaș de securitate). Codul este trimis într-un „container” Docker izolat, unde este
compilat, testat împotriva Testelor Ascunse (hidden test cases), și distrus imediat după ce returnează rezultatul.
• GitHub API & Google API (OAuth 2.0) – Serviciile externe folosite pentru Single Sign-On (SSO). Permit utilizatorilor să își
creeze conturi instantaneu, folosindu-se de securitatea deja oferită de giganții tech (fără a mai gestiona manual parole
sensibile).
Hosting & DevOps
• Netlify – Platforma de cloud hosting responsabilă pentru menținerea site-ului live. Netlify ia codul din GitHub, îl
construiește (build) și îl distribuie pe servere de mare viteză (CDN) în întreaga lume, rulând totodată și backend-ul Serverless.
• Git / GitHub – Uneltele de control al versiunilor, folosite pentru a stoca tot codul sursă în siguranță și a menține istoricul
tuturor modificărilor aduse proiectului.
Cerinte sistem
Aplicația este foarte ușoară pentru dispozitivul utilizatorului, acționând doar ca o interfață.
• Hardware: Orice PC, laptop sau chiar tabletă care funcționează fluent (recomandat un ecran mai mare și tastatură pentru
confort în scrierea codului). Procesorul și memoria RAM nu sunt relevante, deoarece codul nu este compilat pe PC-ul clientului.
• Sistem de Operare: Independent de platformă (Windows, macOS, Linux, ChromeOS).
• Software (Browser): Un browser web modern, actualizat (Google Chrome, Mozilla Firefox, Safari, Microsoft Edge sau Opera), cu
JavaScript activat.
• Rețea: O conexiune stabilă la internet. Datorită naturii multiplayer în timp real a duelurilor, o latență (ping) decentă ajută
la o sincronizare perfectă.
Dacă dorești să descarci codul sursă și să rulezi aplicația ca dezvoltator (pe localhost ), cerințele tehnice devin:
• Mediu de rulare: Node.js (versiunea 18.x sau mai nouă) instalat pe sistem.
• Bază de date: O instanță de PostgreSQL activă (poate fi instalată local sau printr-un serviciu cloud gratuit precum Supabase
sau Neon).
• Docker (Obligatoriu pentru compilatorul propriu): Pentru testarea execuției securizate a codului trimis în aplicație, ai
nevoie de Docker instalat și pornit pe PC pentru a crea containerele (sandboxing).
• Memorie (RAM): Recomandat minimum 8 GB RAM pentru a rula concomitent mediul de dezvoltare Next.js, instanța de bază de date,
Docker și un IDE (precum VS Code).
Realizatori
Darius Ioan Dumitrescu
- Scoala: Colegiul National “Mircea cel Batran”
- Clasa: 12
- Judet: Vâlcea
- Oras: Ramnicu Valcea
Screenshots


