Brzytwa Barber
Strona barbershopu w stylistyce vintage: cennik, galeria i cztery kroki rezerwacji. Projekt demonstracyjny z fikcyjnymi danymi, bez połączenia z prawdziwym salonem.Otwórz działające demo
- Rodzaj
- Projekt demonstracyjny
- Typ
- Strona barbershopu i demonstracyjny system rezerwacji
- Platforma
- Web · komputer i telefon
Overview
Brzytwa Barber Club to demonstracyjna strona fikcyjnego barbershopu. Krem, granat i czerwień, ozdobna typografia oraz fotografie budują klimat klasycznego salonu. Nazwa, adres, osoby, ceny i opinie są przykładowe.
Cennik prowadzi do kreatora: wybór usługi, barbera, terminu i danych. Dostępne godziny uwzględniają czas usługi oraz godziny otwarcia. Rezerwacje pozostają w localStorage danej przeglądarki; nie trafiają do prawdziwego salonu ani wspólnej bazy.
Projekt zawiera też demonstracyjny panel listy rezerwacji, filtrowanie, zmianę statusu i eksport CSV. Podglądy pokazują działającą wersję lokalną, a zdjęcia pochodzą z Pexels.
Project Showcase
Zrzuty i nagrania z działającej wersji projektu, w jego własnej stylistyce. Projekt demonstracyjny z fikcyjnymi danymi.
Telefon
Pierwszy ekran na telefonie
Rezerwacja na telefonie
Funkcjonalności
Cennik z przejściem do rezerwacji
Usługa, cena i czas wizyty w jednym miejscu. Wybór przenosi usługę do kreatora.
Cztery kroki wizyty
Usługa, barber, termin i dane, z podsumowaniem wyboru.
Dostępne godziny
Terminy wyliczane z godzin otwarcia i czasu usługi, z pominięciem zajętych godzin w lokalnych danych demo.
Panel demonstracyjny
Lista rezerwacji, filtry dnia, barbera i statusu oraz eksport CSV. Bramka demo nie jest produkcyjnym logowaniem.
Galeria i FAQ
Zdjęcia z powiększeniem oraz rozwijane odpowiedzi na pytania o wizytę.
Wpis do kalendarza
Plik .ics generowany po demonstracyjnej rezerwacji, bez integracji z zewnętrznym kalendarzem.
Technologie
Tylko to, co jest używane, sprawdzone w zależnościach i importach kodu projektu.
- Astro 7 · TypeScript
- statyczne strony i logika kreatora w przeglądarce
- Tailwind CSS 4
- responsywny układ i stylistyka vintage
- localStorage
- lokalny zapis rezerwacji demonstracyjnych
- Fontsource
- fonty hostowane razem ze stroną
Podejście techniczne
Statyczna strona
Wynik budowania to pliki HTML, CSS i JavaScript, bez serwera rezerwacji.
Wspólne dane
Usługi, godziny otwarcia i barberzy pochodzą z jednego pliku treści.
Jasna granica demo
Zapis działa w jednej przeglądarce. Obsługa prawdziwego salonu wymaga wspólnej bazy i uwierzytelniania na serwerze.
UX/UI
Charakter marki
Krem, granat, czerwień i liternictwo nawiązujące do klasycznych szyldów barberskich.
Cena przed wyborem
Cena i długość usługi są widoczne przed przejściem do terminu.
Rezerwacja bez konta
Kreator prowadzi przez cztery krótkie kroki, także na telefonie.
