/project-phonebook

React > Projekt indywidualny

Primary LanguageJavaScript

☎ Książka Telefoniczna (Phonebook)

Projekt indywidualny GoIT fullstack developer course

Aplikacja Książka Telefoniczna (Phonebook) to interaktywne narzędzie do zarządzania kontaktami, stworzone przy użyciu React i Redux. Umożliwia użytkownikom tworzenie osobistej książki telefonicznej z funkcjami rejestracji, logowania oraz zarządzania kontaktami.

🌐 Demo

Zobacz stronę online: Książka Telefoniczna (Phonebook)

🛠 Użyte technologie

  • React (biblioteka JavaScript do budowania interfejsów użytkownika)
  • Redux Toolkit (zarządzanie stanem aplikacji i przepływem danych)
  • React Router DOM (nawigacja i routing w aplikacji)
  • Material-UI (biblioteka komponentów React zgodna z Material Design)
  • React Toastify (system powiadomień i komunikatów)
  • Redux Persist (trwałe przechowywanie stanu Redux)
  • Tailwind CSS (framework CSS do szybkiego stylowania)
  • Styled Components (stylowanie komponentów z użyciem CSS-in-JS)
  • JavaScript ES6+ (nowoczesna składnia JavaScript)
  • HTML5 (semantyczna struktura dokumentu)
  • CSS3 (zaawansowane style i animacje)
  • Git & GitHub (kontrola wersji i hosting kodu)
  • Axios (obsługa zapytań HTTP do API)
  • REST API (komunikacja z serwerem poprzez interfejs RESTful)

📂 Struktura aplikacji

src/
├── components/         # Komponenty React
│   ├── LoginForm/     # Formularz logowania
│   └── ...
├── redux/             # Logika Redux
│   ├── auth/          # Autentykacja
│   └── ...
├── pages/             # Strony aplikacji
└── styles/            # Style CSS

📋 Dostępne strony

  • / - Strona główna
  • /register - Rejestracja użytkownika
  • /login - Logowanie użytkownika
  • /contacts - Lista kontaktów (dostępna po zalogowaniu)

🚀 Jak uruchomić aplikację

Wymagania wstępne

  • Node.js (wersja LTS)
  • npm lub yarn

Instalacja i uruchomienie

  1. Sklonuj repozytorium:

    git clone https://github.com/brzozanet/project-phonebook.git
cd project-phonebook

  2. Zainstaluj zależności:

    npm install

  3. Uruchom aplikację w trybie deweloperskim:

    npm start

Aplikacja będzie dostępna pod adresem: http://localhost:3000

🌐 Wersja produkcyjna

Wersja produkcyjna aplikacji jest dostępna pod adresem: https://brzozanet.github.io/project-phonebook/

👤 Logowanie testowego użytkownika:

email:

user@testing.com

hasło:

testing

📝 Uwagi

  • Aplikacja wymaga połączenia z bazą danych do prawidłowego działania
  • Wszystkie dane są przechowywane w bezpieczny sposób
  • Interfejs jest w pełni responsywny i dostosowany do urządzeń mobilnych

Screenshot App