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
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.
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
.
Projekt "Bookshelf" wykorzystuje różnorodny zestaw technologii i narzędzi do stworzenia płynnego i interaktywnego doświadczenia użytkownika.
- 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.
- Firebase: Zintegrowany do uwierzytelniania użytkowników, zapewnia bezpieczny system logowania.
- Axios: Klient HTTP używany do zarządzania operacjami asynchronicznymi i obsługiwnia żądań HTTP efektywnie.
- Notiflix: Biblioteka powiadomień wdrożona w celu poprawy informacji zwrotnej dla użytkownika.
- 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.
GET /books/category-list
Zwraca listę kategorii.
GET /books/top-books
Pobiera pierwsze 5 książek z kolekcji w każdej 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.
GET /books/{id}
Parametr | Typ | Opis |
---|---|---|
id |
string |
Wymagane. Id książki do pobrania |
Otrzymuje pełne informacje o książce zidentyfikowanej przez {id}
.
Ta sekcja zawiera informacje na temat wymagań wstępnych i kroków instalacyjnych do skonfigurowania projektu Bookshelf lokalnie.
Upewnij się, że masz zainstalowane:
- Sklonuj repozytorium
git clone https://github.com/Valik3201/bookshelf.git
- Przejdź do katalogu projektu
cd bookshelf
- Zainstaluj zależności
npm ci
- Uruchom projekt w trybie deweloperskim
npm run dev
Użytkownicy mogą poruszać się po platformie, korzystając z następujących funkcji:
- Możliwość utworzenia konta i zalogowania się za pomocą Firebase.
- 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.
- Użytkownicy mogą dodawać książki do listy zakupów.
- Lista zakupów jest dostępna dla zalogowanych użytkowników.
- Kliknięcie na książkę dostarcza użytkownikom szczegółowych informacji w oknie modalnym.
- Użytkownicy mogą kliknąć na każdą fundację, otwierając nową stronę z odpowiednią witryną fundacji w celu uzyskania więcej informacji.
- Dostępne są dwa motywy: jasny i ciemny.
- Responsywność zoptymalizowana dla różnych urządzeń.
- Paginacja na stronie listy zakupów.
- Loader wskazuje trwające operacje asynchroniczne.
- Przycisk Scroll Up do szybkiej nawigacji do góry strony.
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.
-
Zforkuj projekt
-
Stwórz swoją gałąź
git checkout -b feature/NowaFunkcja
-
Zacommituj zmiany
git commit -m 'Dodaj NowaFunkcja'
-
Wypchnij do gałęzi
git push origin feature/NowaFunkcja
-
Otwórz Pull Request
-
Valentyn Chernetskyi - Team Leader
- Strona Główna
- Loader
- Autoryzacja
-
Mateusz Firla - Scrum Master
- Nagłówek
- Tryb Ciemny
-
- Nagłówek
- Menu Mobilne
- Autoryzacja
-
- Strona Listy Zakupów
- Książki w localStorage
- Paginacja
-
- Obrazy i Ikony
- Okno Modalne
- Książka według ID
-
- Okno Modalne
- Książka według ID
-
- Fundacje Charytatywne
- Przycisk Scroll Up