Skip to content

Latest commit

 

History

History
298 lines (210 loc) · 8.84 KB

README_PL.md

File metadata and controls

298 lines (210 loc) · 8.84 KB

Język: Angielski, Polski


Bookshelf Logo

Budowanie doświadczenia z web aplikacją Bookshelf przy użyciu HTML, CSS, JavaScript, Axios, Firebase i nie tylko!

Odkrywaj, szukaj i wyświetlaj książki na intuicyjnej platformie Bookshelf.
Ddokumentacja »

Zobacz Demo · Zgłoś błąd · Zaproponuj ulepszenie

Spis Treści
  1. O Projekcie
  2. Zastosowane technologie
  3. Odwołania do API
  4. Rozpoczęcie
  5. Użycie
  6. Współtworzenie
  7. Zespół

O Projekcie

screenshot

Bookshelf to aplikacja internetowa do przeglądania książek, z dodatkowymi funkcjami takimi jak dodawanie książek do listy zakupów, przeglądanie kategorii, przeglądanie popularnych książek i wspieranie fundacji charytatywnych.

screenshot

Note

Projekt jest skonfigurowany do automatycznego wdrażania na GitHub Pages przy użyciu GitHub Actions autorstwa JamesIves (GitHub Pages Deployment Action). Akcja wdrażania jest skonfigurowana do przesyłania kodu gotowego do produkcji do gałęzi gh-pages.

Powrót do góry

Zastosowane technologie

Projekt "Bookshelf" wykorzystuje różnorodny zestaw technologii i narzędzi do stworzenia płynnego i interaktywnego doświadczenia użytkownika.

Frontend

  • HTML: Język znaczników do strukturyzacji treści.
  • CSS: Język stylizacji do prezentacji wizualnych aspektów projektu.
  • JavaScript: Język programowania do tworzenia dynamicznych i interaktywnych elementów.
  • Swiper: Wykorzystywany do tworzenia komponentu slidera dla fundacji charytatywnych.

Backend / Firebase

  • Firebase: Zintegrowany do uwierzytelniania użytkowników, zapewnia bezpieczny system logowania.

Komunikacja z serwerem/API

  • Axios: Klient HTTP używany do zarządzania operacjami asynchronicznymi i obsługiwnia żądań HTTP efektywnie.

Powiadomienia

  • Notiflix: Biblioteka powiadomień wdrożona w celu poprawy informacji zwrotnej dla użytkownika.

Dodatkowe Narzędzia

  • Node.js i npm: Używane do zarządzania zależnościami projektu.
  • Responsywność: Zaprojektowana w celu zapewnienia optymalnej wydajności na różnych urządzeniach.

Ten różnorodny stos technologiczny umożliwia projektowi "Bookshelf" dostarczenie platformy bogatej w funkcje dla miłośników książek, oferującej funkcje takie jak przeglądanie książek, wspieranie fundacji charytatywnych, zarządzanie listami zakupów i wiele więcej.

screenshot

Powrót do góry

Odwołania do API

Wszystkie kategorie

  GET /books/category-list

Zwraca listę kategorii.

Najlepsze książki w każdej kategorii

  GET /books/top-books

Pobiera pierwsze 5 książek z kolekcji w każdej kategorii.

Książki według kategorii

  GET /books/category
Parametr Typ Opis
category string Nazwa kategorii, dla której chcesz uzyskać listę książek

Otrzymuje kolekcję 20 książek z określonej kategorii.

Informacje o książce

  GET /books/{id}
Parametr Typ Opis
id string Wymagane. Id książki do pobrania

Otrzymuje pełne informacje o książce zidentyfikowanej przez {id}.

Rozpoczęcie

Ta sekcja zawiera informacje na temat wymagań wstępnych i kroków instalacyjnych do skonfigurowania projektu Bookshelf lokalnie.

Wymagania wstępne

Upewnij się, że masz zainstalowane:

Instalacja

  1. Sklonuj repozytorium
    git clone https://github.com/Valik3201/bookshelf.git
  2. Przejdź do katalogu projektu
     cd bookshelf
  3. Zainstaluj zależności
     npm ci
  4. Uruchom projekt w trybie deweloperskim
    npm run dev

Powrót do góry

Użycie

Użytkownicy mogą poruszać się po platformie, korzystając z następujących funkcji:

Autentykacja

  • Możliwość utworzenia konta i zalogowania się za pomocą Firebase.

Przeglądanie Książek

  • Strona główna wyświetla listę kategorii książek i najlepiej sprzedających się w każdej kategorii.
  • Umożliwia użytkownikom przeglądanie książek na podstawie kategorii.

Lista Zakupów

  • Użytkownicy mogą dodawać książki do listy zakupów.
  • Lista zakupów jest dostępna dla zalogowanych użytkowników.

Szczegółowe Informacje

  • Kliknięcie na książkę dostarcza użytkownikom szczegółowych informacji w oknie modalnym.

Fundacje Charytatywne

  • Użytkownicy mogą kliknąć na każdą fundację, otwierając nową stronę z odpowiednią witryną fundacji w celu uzyskania więcej informacji.

Motywy i Responsywność

  • Dostępne są dwa motywy: jasny i ciemny.
  • Responsywność zoptymalizowana dla różnych urządzeń.

Paginacja, Loader, Scroll Up

  • Paginacja na stronie listy zakupów.
  • Loader wskazuje trwające operacje asynchroniczne.
  • Przycisk Scroll Up do szybkiej nawigacji do góry strony.

Powrót do góry

Współtworzenie

Zapraszamy do współtworzenia! Jeśli masz sugestie lub ulepszenia, śmiało forkuj projekt, stwórz nową gałąź, wprowadź zmiany i prześlij pull request.

  1. Zforkuj projekt

  2. Stwórz swoją gałąź

    git checkout -b feature/NowaFunkcja
  3. Zacommituj zmiany

    git commit -m 'Dodaj NowaFunkcja'
  4. Wypchnij do gałęzi

    git push origin feature/NowaFunkcja
  5. Otwórz Pull Request

Powrót do góry

Zespół

  1. Valentyn Chernetskyi - Team Leader

    • Strona Główna
    • Loader
    • Autoryzacja
  2. Mateusz Firla - Scrum Master

    • Nagłówek
    • Tryb Ciemny
  3. Tomasz Stańczak

    • Nagłówek
    • Menu Mobilne
    • Autoryzacja
  4. Anna Sanetra

    • Strona Listy Zakupów
    • Książki w localStorage
    • Paginacja
  5. Aleksandra Jarzębska

    • Obrazy i Ikony
    • Okno Modalne
    • Książka według ID
  6. Ewa Górniak

    • Okno Modalne
    • Książka według ID
  7. Patryk Kuca

    • Fundacje Charytatywne
    • Przycisk Scroll Up

Powrót do góry