Inventar de Provizii de Urgență
O aplicație web auto-găzduită, ușoară, pentru urmărirea proviziilor de urgență ale gospodăriei și planificarea meselor de supraviețuire. Construită cu PHP 8.x și JavaScript vanilla — fără bază de date, fără framework-uri, fără instrumente de build.
✨ Funcții
Gestionarea Inventarului
Operațiuni CRUD complete cu zile rămase calculate automat, indicatori de status, filtrare pe categorii, sortare și căutare.
Autentificare Admin
Hashing BCrypt pentru parole, autentificare prin sesiuni PHP, mod doar-citire pentru vizitatori și protecție .htaccess.
Configurare Gospodărie
Compoziție personalizabilă a gospodăriei și zile țintă cu recalculare dinamică a tuturor duratelor de provizii.
Rețete de Supraviețuire
16 rețete optimizate pentru supraviețuire cu niveluri de prioritate, indicatori de cost combustibil, versiuni pentru copii și layout gata de printare.
Multilingv
Engleză, Germană și Română cu comutare instantanee și preferință persistentă prin localStorage și cookie-uri.
Design & UX
Layout responsiv, suport mod întunecat, CSS Custom Properties, contururi de focus accesibile și respectarea mișcării reduse.
Gestionarea Inventarului
- Operațiuni CRUD complete — adăugați, editați și ștergeți articole de inventar cu categorii, subcategorii, cantități, unități, rate de consum zilnic și date de expirare
- Zile rămase calculate automat — sistemul calculează câte zile durează fiecare articol pe baza stocului curent și a consumului zilnic per membru al gospodăriei
- Indicatori de status — articolele sunt automat marcate ca Critic (sub stoc minim), Avertisment (sub țintă) sau Suficient
- Filtrare pe categorii — faceți clic pe o pilulă de categorie pentru a filtra instantaneu tabelul; pilulele sunt codate pe culori după statusul agregat
- Tabel sortabil — faceți clic pe un antet de coloană pentru sortare ascendentă/descendentă
- Căutare — căutare în timp real pe nume de articole, categorii și subcategorii
- Export backup — export JSON cu un clic al întregului inventar pentru păstrare offline
Autentificare Admin
- Model cu un singur admin — un cont de admin este creat la prima configurare; nu sunt necesare conturi multiple
- Hashing BCrypt pentru parole (factor de cost 12) — parolele nu sunt niciodată stocate în text clar
- Autentificare prin sesiuni PHP — sesiunile sunt stocate într-un director sessions/ protejat, nu în folderul temporar al sistemului
- Mod vizitator — vizitatorii neautentificați pot doar citi
- Schimbare parolă — adminul poate schimba parola oricând din Setări
- Protecție .htaccess — accesul URL direct la fișierele de date JSON și sesiuni este blocat
Rețete de Supraviețuire
- 16 rețete optimizate pentru supraviețuire — concepute special pentru ingredientele urmărite în inventar
- Niveluri de prioritate — Folosiți Întâi (perisabil), Folosiți Curând sau Oricând
- Indicatori de cost combustibil — Zero (fără gătit), Scăzut (<10 min) sau Mediu (10-20 min)
- Rețete doar pentru urgențe — clar marcate pentru situații critice
- Rețete de confort/normalitate — mese care ridică moralul în situații de urgență prelungite
- Versiuni pentru copii — instrucțiuni adaptate pentru copii mici (de la 5 ani)
- Sfaturi de supraviețuire — tehnici de economisire a apei, strategii de substituire a ingredientelor și scurtături de gătit
- Gata de printare — stylesheet de printare optimizat pentru copii fizice sau "Salvare ca PDF"
📁 Structura Fișierelor
Cerințe
- Server web — Apache (cu suport .htaccess) sau Nginx
- PHP 8.x — cu extensiile json și posix (posix este opțional dar oferă diagnostic mai bun)
- Permisiuni de scriere — utilizatorul serverului web (de obicei www-data) trebuie să poată scrie în data/ și sessions/
- Fără bază de date — toate datele sunt stocate în fișiere JSON
- Fără npm/build — HTML, CSS și JavaScript pur; fără compilare sau bundling necesar
🛠 Instalare
Alegeți metoda de instalare care corespunde sistemului de operare și configurării dumneavoastră.
Start Rapid
Copiați fișierele în directorul serverului web
Copiați întregul folder al proiectului în rădăcina documentului Apache/Nginx.
sudo cp -r ./emergency-prep-inventory /var/www/html/tools/emergency-prep-inventory
Rulați scriptul de configurare a permisiunilor
Acesta creează data/ și sessions/, setează proprietarul și permisiunile, creează protecția .htaccess, generează un favicon și rulează un test de scriere.
sudo bash setup-permissions.sh /var/www/html/tools/emergency-prep-inventory
Deschideți browserul
Navigați la URL-ul aplicației și completați ecranul de configurare inițială.
Configurare Manuală a Permisiunilor
Dacă preferați să setați permisiunile manual în loc să folosiți scriptul:
mkdir -p /var/www/html/tools/emergency-prep-inventory/data
mkdir -p /var/www/html/tools/emergency-prep-inventory/sessions
sudo chown -R www-data:www-data /var/www/html/tools/emergency-prep-inventory
find /var/www/html/tools/emergency-prep-inventory -type d -exec chmod 755 {} \;
chmod 750 /var/www/html/tools/emergency-prep-inventory/data
chmod 700 /var/www/html/tools/emergency-prep-inventory/sessions
chmod 640 /var/www/html/tools/emergency-prep-inventory/*.php
chmod 644 /var/www/html/tools/emergency-prep-inventory/*.html
chmod 644 /var/www/html/tools/emergency-prep-inventory/*.css
chmod 660 /var/www/html/tools/emergency-prep-inventory/data/*.jsonConfigurare Nginx
Dacă folosiți Nginx în loc de Apache, adăugați aceste blocuri de locație la configurarea serverului:
location /data/ {
deny all;
}
location /sessions/ {
deny all;
}XAMPP este un pachet gratuit all-in-one care include Apache, PHP și tot ce aveți nevoie pentru a rula această aplicație pe Windows. Nu este nevoie să instalați sau configurați manual un server web.
Pasul 1: Instalați XAMPP
- Descărcați XAMPP pentru Windows de pe apachefriends.org
- Rulați instalatorul. Calea implicită de instalare este C:\xampp
- În timpul instalării, asigurați-vă că Apache și PHP sunt selectate (sunt implicit)
- După instalare, deschideți Panoul de Control XAMPP și faceți clic pe Start lângă Apache — statusul ar trebui să devină verde
Pasul 2: Copiați fișierele proiectului
- Navigați la directorul rădăcină web XAMPP: C:\xampp\htdocs\
- Creați un folder pentru proiect, ex.: C:\xampp\htdocs\emergency-prep-inventory\
- Copiați toate fișierele proiectului în acest folder: api.php, index.html, receips.html, style.css, permission.sh, setup-permissions.sh
Pasul 3: Creați directoarele necesare
În folderul proiectului, creați manual aceste două directoare:
C:\xampp\htdocs\emergency-prep-inventory\data\C:\xampp\htdocs\emergency-prep-inventory\sessions\
Asta e tot — XAMPP rulează Apache sub propriul dumneavoastră cont de utilizator Windows, deci nu există probleme de permisiuni. PHP poate scrie automat în aceste directoare.
Pasul 4: Deschideți aplicația
- Deschideți browserul și accesați: http://localhost/emergency-prep-inventory/
- Veți vedea ecranul de configurare inițială — creați contul de admin și configurați gospodăria
- Aplicația rulează acum local pe calculatorul dumneavoastră
Opțional: Acces în rețeaua locală
Dacă doriți ca alte dispozitive din rețeaua de casă (telefon, tabletă, alt calculator) să acceseze inventarul:
- Găsiți adresa IP locală a PC-ului Windows: deschideți Command Prompt și rulați: ipconfig — căutați "IPv4 Address" (ex.: 192.168.1.100)
- Pe celălalt dispozitiv, deschideți un browser și accesați: http://192.168.1.100/emergency-prep-inventory/
- Asigurați-vă că Windows Firewall permite conexiuni primite pe portul 80 (XAMPP solicită de obicei acest lucru)
Fișierele .htaccess care protejează data/ și sessions/ de acces URL direct funcționează imediat cu XAMPP deoarece folosește Apache cu mod_rewrite activat implicit.
Depanare (Windows / XAMPP)
| Problem | Solution |
|---|---|
| Apache nu pornește | Un alt program (adesea Skype sau IIS) folosește portul 80. În Panoul de Control XAMPP, faceți clic pe "Config" lângă Apache → schimbați portul la 8080 → accesați via http://localhost:8080/... |
| Eroare "Acces interzis" | Asigurați-vă că numele folderului din htdocs corespunde URL-ului. Fără spații sau caractere speciale în numele folderului. |
| Pagină goală / PHP nu rulează | Deschideți Panoul de Control XAMPP → faceți clic pe "Config" lângă Apache → asigurați-vă că PHP este activat. Testați cu într-un fișier test.php. |
| data/ sau sessions/ nu sunt inscriptibile | Faceți clic dreapta pe folder → Proprietăți → Securitate → asigurați-vă că "Utilizatori" sau "Toți" au permisiunea de "Scriere". Rar necesar pe XAMPP. |
| .htaccess nu funcționează | Deschideți C:\xampp\apache\conf\httpd.conf, găsiți #LoadModule rewrite_module modules/mod_rewrite.so și eliminați # de la început. Reporniți Apache. |
Pe macOS aveți două opțiuni populare pentru un server PHP local: XAMPP (multiplatformă, la fel ca pe Windows) sau MAMP (focust pe macOS). Ambele funcționează bine.
XAMPP pe macOS
Pasul 1: Instalați XAMPP
- Descărcați XAMPP pentru macOS de pe apachefriends.org
- Deschideți fișierul .dmg și trageți XAMPP în folderul Aplicații
- Lansați XAMPP din Aplicații — poate cere parola macOS pentru a porni Apache
- În Panoul de Control XAMPP, faceți clic pe Start lângă Apache
Pasul 2: Copiați fișierele proiectului
Rădăcina web XAMPP pe macOS este: /Applications/XAMPP/xamppfiles/htdocs/
cp -r ./emergency-prep-inventory /Applications/XAMPP/xamppfiles/htdocs/emergency-prep-inventory
Pasul 3: Creați directoarele necesare
mkdir -p /Applications/XAMPP/xamppfiles/htdocs/emergency-prep-inventory/data mkdir -p /Applications/XAMPP/xamppfiles/htdocs/emergency-prep-inventory/sessions sudo chown -R daemon:daemon /Applications/XAMPP/.../data sudo chown -R daemon:daemon /Applications/XAMPP/.../sessions
Dacă primiți erori de permisiuni (XAMPP rulează ca utilizator 'daemon'): rulați sudo chown -R daemon:daemon /Applications/XAMPP/.../data și sessions
Pasul 4: Deschideți aplicația
Deschideți browserul și accesați: http://localhost/emergency-prep-inventory/
MAMP pe macOS
MAMP (Mac + Apache + MySQL + PHP) este o altă opțiune populară. Versiunea gratuită este suficientă — nu aveți nevoie de MySQL pentru acest proiect.
Pasul 1: Instalați MAMP
- Descărcați MAMP de pe mamp.info
- Instalați prin tragere în folderul Aplicații
- Lansați MAMP și faceți clic pe Pornește Serverele — Apache și MySQL vor porni (MySQL nu este folosit dar nu deranjează)
Pasul 2: Copiați fișierele proiectului
Rădăcina web MAMP este: /Applications/MAMP/htdocs/
cp -r ./emergency-prep-inventory /Applications/MAMP/htdocs/emergency-prep-inventory
Pasul 3: Creați directoarele necesare
mkdir -p /Applications/MAMP/htdocs/emergency-prep-inventory/data mkdir -p /Applications/MAMP/htdocs/emergency-prep-inventory/sessions chmod 777 /Applications/MAMP/htdocs/emergency-prep-inventory/data chmod 777 /Applications/MAMP/htdocs/emergency-prep-inventory/sessions
MAMP rulează Apache sub propriul cont de utilizator, deci permisiunile nu ar trebui să fie o problemă. Dacă sunt: chmod 777 data/ și sessions/
Pasul 4: Deschideți aplicația
Implicit, MAMP folosește portul 8888. Deschideți browserul și accesați: http://localhost:8888/emergency-prep-inventory/
Puteți schimba portul MAMP în MAMP → Preferințe → Porturi → "Setare la porturi standard Apache și MySQL". Apoi URL-ul devine simplu http://localhost/emergency-prep-inventory/.
Opțional: Acces în rețeaua locală (macOS)
- Găsiți adresa IP locală a Mac-ului: Setări de Sistem → Wi-Fi → faceți clic pe "Detalii" — sau în Terminal: ipconfig getifaddr en0
- Pe celălalt dispozitiv: XAMPP: http://192.168.1.50/emergency-prep-inventory/ — MAMP: http://192.168.1.50:8888/emergency-prep-inventory/
- Asigurați-vă că Firewall-ul macOS permite conexiuni primite: Setări de Sistem → Rețea → Firewall
Depanare (macOS / XAMPP / MAMP)
| Problem | Solution |
|---|---|
| Apache nu pornește | macOS are un Apache integrat care poate intra în conflict. Opriți-l: sudo apachectl stop. Verificați și dacă altă aplicație folosește portul 80. |
| "Acces interzis" | Verificați permisiunile folderului. Pentru XAMPP, utilizatorul daemon are nevoie de acces de citire. Pentru MAMP, propriul utilizator ar trebui să funcționeze. |
| data/ nu este inscriptibil | XAMPP rulează ca daemon — rulați sudo chown -R daemon:daemon /Applications/XAMPP/.../data. MAMP rulează ca utilizatorul dvs. — ar trebui să funcționeze fără modificări. |
| .htaccess nu funcționează (XAMPP) | Deschideți /Applications/XAMPP/xamppfiles/etc/httpd.conf, găsiți #LoadModule rewrite_module și eliminați #. Reporniți Apache. |
| .htaccess nu funcționează (MAMP) | MAMP are mod_rewrite activat implicit — ar trebui să funcționeze imediat. |
| Versiune PHP prea veche | XAMPP și MAMP vin cu versiuni recente de PHP. Dacă aveți nevoie de PHP 8.x, descărcați cea mai recentă versiune de pe site-ul lor. |
🔌 Referință API
API-ul de backend (api.php) folosește un model simplu de rutare bazată pe acțiuni. Toate cererile returnează răspunsuri JSON.
Endpoint-uri Publice (Fără Autentificare)
| Action | Method | Description |
|---|---|---|
check_setup | GET | setup complete? |
setup | POST | create admin (first-time) |
login | POST | authenticate admin |
logout | GET/POST | destroy session |
session_status | GET | auth state |
get_settings | GET | household config |
inventory | GET | all items |
check_permissions | GET | diagnostic |
Endpoint-uri Protejate (Autentificare Admin Necesară)
| Action | Method | Description |
|---|---|---|
save_inventory | POST | save full inventory |
save_settings | POST | update household config |
change_password | POST | change admin password |
Exemple Cerere/Răspuns
Autentificare:
{ "action": "login", "username": "admin", "password": "your-password" }Salvare inventar:
{ "action": "save_inventory", "data": [{ "itemName": "Rice", "category": "Grains", "currentQuantity": 5, "unit": "kg", "dailyConsumption": 0.1 }] }📖 Ghid de Utilizare
Prima Configurare
- Creați contul de admin — alegeți un nume de utilizator (minim 2 caractere) și o parolă (minim 6 caractere)
- Configurați gospodăria — setați numărul de bărbați adulți, femei adulte, copii și zilele țintă de pregătire
După configurare, veți fi automat autentificat ca admin.
Gestionarea Articolelor de Inventar
- Adăugați un articol nou — faceți clic pe butonul "Articol Nou" (doar admin)
- Editați un articol — faceți clic pe pictograma creion din coloana Acțiuni (doar admin)
- Ștergeți un articol — faceți clic pe pictograma coș de gunoi (doar admin)
- Adăugați categorii/unități noi — fiecare dropdown are un buton "+"
- Exportați backup — faceți clic pe "Export Backup" pentru a descărca inventarul ca fișier JSON
Vizualizare ca Invitat
Vizitatorii care nu se autentifică pot răsfoi inventarul în mod doar-citire. Pot:
- Vizualiza toate articolele de inventar și statusurile lor
- Filtra după categorie și căuta
- Schimba limbile
- Accesa pagina de rețete
Nu pot adăuga, edita sau șterge articole.
Rețete de Supraviețuire
Faceți clic pe butonul "Rețete" pentru a deschide pagina de rețete de supraviețuire. Fiecare rețetă include:
- Insignă de prioritate — când să folosiți această rețetă pe baza perisabilității ingredientelor
- Insignă de cost combustibil — cât combustibil de gătit este necesar
- Cost apă — consum estimat de apă pentru rețetă
- Lista de ingrediente — cu cantități potrivite inventarului dumneavoastră
- Instrucțiuni pas cu pas — pași de gătit numerotați
- Versiune pentru copii — instrucțiuni adaptate pentru hrănirea copiilor mici
- Sfat de supraviețuire — sfaturi practice pentru conservarea resurselor
Folosiți butonul "Printare / Salvare ca PDF" pentru a crea o copie fizică de rezervă a tuturor rețetelor.
🔧 Depanare
Erori de Permisiuni
Dacă vedeți erori despre accesul de scriere la fișiere:
- Rulați endpoint-ul de verificare a permisiunilor: api.php?action=check_permissions
- Acesta va afișa utilizatorul PHP, proprietarul fișierului și detaliile permisiunilor
- Rulați din nou scriptul de configurare: sudo bash setup-permissions.sh /calea/proiectului
- Dacă problema persistă, verificați manual proprietarul — fișierele ar trebui să fie deținute de www-data:www-data cu permisiuni 660 pentru fișierele JSON
Probleme de Sesiune
Dacă autentificarea nu persistă:
- Asigurați-vă că directorul sessions/ există și este inscriptibil de www-data
- Verificați că directorul are permisiuni 700 și este deținut de www-data
- Verificați că browserul acceptă cookie-uri de la domeniu
API Returnează 500 la Configurare
Aceasta înseamnă de obicei că directorul data/ sau fișierele JSON nu sunt inscriptibile. Răspunsul API va include informații de diagnostic:
- php_user — utilizatorul sub care rulează PHP
- file_perms — permisiunile curente ale fișierului
- file_owner — proprietarul curent al fișierului
- fix — comanda exactă de rulat pentru a rezolva problema
🛡 Considerații de Securitate
- Fișierele de date JSON sunt protejate de acces HTTP direct prin reguli .htaccess (Apache) sau blocuri de locație Nginx
- Credențialele de admin sunt stocate cu hashing BCrypt (cost 12) — parolele nu sunt niciodată stocate în text clar
- Fișierele de sesiune sunt stocate într-un director dedicat cu permisiuni restrictive (700), nu în directorul /tmp al sistemului
- Fișierele PHP au permisiuni 640 — citibile doar de utilizatorul și grupul serverului web, nu de toți
- Fără token-uri CSRF — această aplicație este concepută pentru utilizare de un singur admin într-o rețea de încredere. Dacă o expuneți la internetul public, luați în considerare adăugarea protecției CSRF
- Fără limitare de rată — protecția brute-force nu este implementată. Folosiți fail2ban sau instrumente similare dacă este expus public
⚙️ Stack Tehnologic
| Component | Technology |
|---|---|
| Backend | PHP 8.x |
| Frontend | HTML5 CSS3 JS ES6+ |
| Storage | JSON files |
| Auth | Sessions BCrypt |
| Languages | EN DE RO |
Suport Browser
- Chrome / Edge (ultimele 2 versiuni)
- Firefox (ultimele 2 versiuni)
- Safari (ultimele 2 versiuni)
- Browsere mobile (Chrome pentru Android, Safari pentru iOS)
📄 Licență
Acest proiect este furnizat ca atare pentru pregătirea de urgență personală a gospodăriei. Contact: marundaliliana@gmail.com pentru implementări personalizate sau întrebări.