💼 JobOffers Project

$$\text{Status Projektu: In-Progress}$$

Prosty i funkcjonalny interfejs webowy do zarządzania ofertami pracy, zbudowany w oparciu o czysty HTML. Projekt skupia się na przejrzystości i intuicyjnej nawigacji pomiędzy różnymi stanami aplikacji.

---

🚀 Funkcjonalności projektu

Struktura logiczna aplikacji jest zdefiniowana jako zbiór trzech głównych modułów: $\text{Lista}, \text{Admin}, \text{Szczegóły}$

1. Lista Ofert Pracy (home.html)

Prezentacja zbioru ofert, gdzie każda oferta zawiera:

• Dane: $\text{tytuł}, \text{firma}, \text{wynagrodzenie}, \text{lokalizacja}, \text{data dodania}, \text{szczegółowy opis}$
• Akcja: Przycisk przekierowujący $\to$ details.html

2. Panel Administracyjny (admin.html)

Moduł operacyjny typu CRUD, obsługujący funkcje:

• Dodawanie
• Edycja
• Usuwanie

3. Szczegóły Oferty (details.html)

Szczegóły oferty oraz jej szczegółowy opis.

---

🛠️ Technologie

Wykorzystane narzędzia i standardy:

• HTML5 – $\text{Struktura}$
• CSS3 – $\text{Design}$
• JavaScript - $\text{Obsługa API, renderowanie danych}$

📂 Struktura plików

├── home.html          # Widok główny (lista)
├── admin.html         # Zarządzanie ofertami
├── details.html       # Widok pojedynczej oferty
├── css/style.css      # Style aplikacji
├── css/admin.css      # Style admina
├── css/details.css    # Style szczegółów
├── css/theme.css      # Styl przełącznika motywu
├── scripts/script.js  # Logika aplikacji
├── scripts/details.js # Logika szczegółów
├── scripts/admin.js   # Logika admina
├── scripts/theme.js   # Logika przełącznika motywu
└── README.md          # Dokumentacja projektu

Checklisty Projektowe - Status Realizacji

1. Wymagania Minimalne (MVP) – 50%

Kryterium	Opis	Status
3 Widoki	Lista danych ✅, szczegóły elementu ✅, formularz ✅.	✅
Komunikacja API	Wykorzystanie fetch do pobrania danych.	✅
Renderowanie	Dynamiczne wyświetlanie danych z API na stronie.	✅
Obsługa błędów	Reakcja na brak sieci lub błędy serwera.	✅
Walidacja	Sprawdzanie poprawności pól w formularzu.	✅
RWD	Responsywność zgodnie z zasadą Mobile-first.	✅
Poprawność kodu	Brak błędów w konsoli, czysta struktura.	✅
Dokumentacja	Przygotowanie opisu i gotowość do obrony.	✅

---

2. Rozszerzenia Funkcjonalności – 30%

Funkcjonalność	Opis	Wartość	Status
Sortowanie	Sortowanie wg wielu kryteriów.	5-10%	✅
Filtrowanie	Filtrowanie wg kilku parametrów.	5-10%	[ ]
Stronicowanie	Paginacja lub "Załaduj więcej".	5-10%	✅
LocalStorage	Zapisywanie danych w przeglądarce.	5-10%	✅
Edycja danych	Modyfikowanie danych lokalnie.	5-10%	✅
Przetwarzanie	Statystyki, agregacje, wyliczenia.	5-10%	[ ]
Złożone API	Obsługa wielu różnych zapytań.	5-10%	✅

---

3. Jakość Projektu – 10%

Kryterium	Opis	Status
Architektura	Przemyślana organizacja plików i folderów.	✅
Stan (State)	Poprawne zarządzanie przepływem danych.	✅
Sytuacje brzegowe	Zaawansowana obsługa nietypowych błędów.	✅
Walidacja PRO	Użycie Regex i czytelnych komunikatów.	✅
Wydajność	Optymalizacja kodu i bezpieczeństwo.	✅
Modularność	Podział na reużywalne moduły/funkcje.	✅

---

4. Jakość UX i Dopracowanie – 10%

Element	Opis	Status
Animacje	Przejścia CSS (transitions) i efekty.	✅
Komponenty	Modale, menu, akordeony lub karuzele.	✅
Feedback	Spinnery ładowania, komunikaty sukcesu/błędu.	✅
Dostępność	Kontrast, odpowiednie tagi ARIA.	[ ]