CarRental
Spring REST application. Graphical user interface was created using React. This application is used to service car rental companies. It allows registering and logging users (Spring Security), making car reservations, browsing reservations, managing rentings , users or vehicles by authorized persons.
Install / Use
/learn @kubabar1/CarRentalREADME
1. Opis ogólny
Dokładniejszy opis zawierający diagramy UML znajduje się w zakładce Wiki, znajdującej sią pod poniższym linkiem. https://github.com/kubabar1/CarRental/wiki
1.1 Nazwa programu
CarRental
1.2 Cel aplikacji
Głównym celem stworzenia tej aplikacji było wykorzystanie w praktyce dotychczas zgromadzonej przeze mnie wiedzy na temat tworzenia bazodanowych restowych aplikacji z wykorzystaniem Springa. </br></br> Celem programu CarRental jest obsługa firmy wypożyczającej auta. Głównym zadaniem aplikacji jest umożliwienie przejrzenia listy aut oraz ich szegółów przez klientów, a następnie rezerwacji wybranego auta. Aplikacja posiada również panel klienta umożliwiający przeglądanie zamówień oraz zmianę ustawień konta, oraz panel administratora umożliwiający m.in. administrowanie zamówieniami oraz użytkownikami, dodawanie i edycję aut, edycję wyposażenia aut. Aplikacja posiada również system logowania oraz rejestracji nowych klientów.
1.3 Krótkie wstępne podsumowanie aplikacji
<img src="https://github.com/kubabar1/readme_images_repository/blob/master/car_rental_images/home.png" width="800"/>Backend:
Restowe API napisane w Springu z wykorzystaniem następujących technologii:
<ul> <li>Spring MVC</li> <li>Spring Security</li> <li>Spring Data JPA</li> <li>Hibernate</li> </ul> W sumie projekt składa się z 8 pakietów, 83 klas które łącznie mają ok. 5000 linii kodu.Frontend:
Frontend został głównie napisany z wykorzystaniem Reacta. Technologię Thymeleaf wykorzystałem do stworzenia panelu logowania, rejestracji oraz jako podstawę do głównej strony projektu oraz panelu użytkownika. W sumie przy tworzeniu frontendu wykorzystałem następujące technologie:
<ul> <li>React, React Router</li> <li>Thymeleaf</li> <li>Bootstrap</li> <li>HTML, CSS</li> <li>npm, webpack</li> </ul>W sumie frontend składa się ze 101 plików, które w sumie liczą ok. 8000 linii kodu.
1.4 Docelowi użytkownicy
<img src="https://github.com/kubabar1/readme_images_repository/blob/master/car_rental_images/actors_diagram.png" width="600"/> <ul> <li><b>Admin</b> - osoba zarządzająca stroną posiadająca najwięcej uprawnień</li> <li><b>Customer</b> - klient, osoba korzystająca z naszej strony w celu rezerwacji auta, każdy użytkownik który zakłada konto posiada początkowo rolę klienta, pozostałe role są przypisywane przez admina </li> <li><b>Renting employee</b> - osoba wypożyczająca auta, ma m.in uprawnienia do zarządzania wszystkimi zamówieniami</li> <li><b>Office employee</b> - osoba pracująca na stanowisku biurowym</li> </ul>2. Opis funkcjonalności
2.1 Uruchomienie
Do uruchomienia potrzebne będą:
<ul> <li>serwer MySQL (można go pobrać poleceniem <i>sudo apt-get install mysql-server</i>),</li> <li>Maven (można go pobrać poleceniem <i>sudo apt-get install maven</i>),</li> <li>Tomcat (należy później skonfigurować użytkowników i nadać im odpowiednie prawa)</li> </ul> </br>W celu uruchomienia projektu należy wykonać następujące kroki:
- Sklonuj repozytorium: https://github.com/kubabar1/CarRental.git
git clone https://github.com/kubabar1/CarRental.git
- Używając skryptu bazy danych o nazwie carrental.sql znajdującego się <a href="https://github.com/kubabar1/CarRental/blob/master/carrental.sql">tutaj</a> utwórz bazę danych na serwerze MySQL. Aby zainstalować bazę danych należy wpisać poniższą komendę:
sudo mysql –u root < carrental.sql
Polecenie to spowoduje usunięcie istniejącej bazy danych o nazwie carrental (jeżeli istnieje) i utworzenie nowej wraz z tabelami i wpisanymi do nich wartościami. !!! bardzo istotne jest to, aby w naszej bazie danych znajdował się użytkownik root, nie posiadający hasła, jeżeli jednak jest ustawione hasło, należy je wpisać w pliku persistence-mysql.properties <a href="https://github.com/kubabar1/CarRental/blob/master/CarRental/src/main/java/persistence-mysql.properties">link</a>.
- Przejdż do katalogu w projekcie w którym znajduje się plik pom.xml i wykonaj następujące polecenie:
sudo mvn clean install
sudo jest konieczne ze względu na fakt, że Maven tworzy w folderze głównym systemu folder w którym wypakowuje część zdjęć wykorzystywanych w aplikacji oraz w którym są przechowywane m.in. zdjęcia dodanych przez nas aut.
-
Po zakończeniu działania programu Maven należy przejść do folderu CarRental/target i skopiować plik CarRental.war do folderu webapps naszego serwera Tomcat (np. dla serwera Tomcat 8 będzie to folder /var/lib/tomcat8/webapps).
-
Edytujemy konfigurację w pliku /etc/tomcat8/server.xml:
a) Dla systemu Windows
<Host name="localhost">
<Context docBase="C:\carrental\img\vehicles_img" path="/CarRental/vehicles-img"/>
<Context docBase="C:\carrental\img\etc_img" path="/CarRental/etc-img"/>
</Host>
b) Dla systemu Linux:
<Host name="localhost">
<Context docBase="/carrental/img/vehicles_img" path="/CarRental/vehicles-img"/>
<Context docBase="/carrental/img/etc_img" path="/CarRental/etc-img"/>
</Host>
Dzięki temu nasza aplikacja będzie mogła mieć dostęp do zdjęć przechowywanych na dysku.
- Uruchamiamy serwer poleceniem (dla wersji serwera Tomcat 8):
sudo service tomcat8 start
- Wpisujemy w przegladarce adres http://localhost:8080/CarRental
2.2 Możliwości programu i główne funkcjonalności
2.2.1 Wyświetlenie ekranu głównego
<img src="https://github.com/kubabar1/readme_images_repository/blob/master/car_rental_images/home.gif" width="600"/>Ekran główny wyświetla się po kliknięciu przycisku Home w menu lub kliknięciu w logo firmy. Przeglądanie listy pojazdów Listę pojazdów możemy wyświetlić po kliknięciu przycisku Car list w menu.
2.2.2 Wyszukiwanie pojazdów według podanych kryteriów
<img src="https://github.com/kubabar1/readme_images_repository/blob/master/car_rental_images/carsearch.gif" width="600"/>Aby wyszukać pojazdy według kryteriów należy przejść do listy pojazdów przez kliknięcie przycisku Car list w menu, a następnie wprowadzić pożądane kryteria w panelu filtrów i kliknąć przycisk Search. Spowoduje to wyświetlenie na ekranie pojazdów spełniających pożądane kryteria.
2.2.3 Przejrzenie szczegółów pojazdu
<img src="https://github.com/kubabar1/readme_images_repository/blob/master/car_rental_images/carprops.gif" width="600"/>Aby przejrzeć informacje szczegółowe na temat pojazdów należy przejść do listy pojazdów (po kliknięciu Car rental), a następnie przy wybranym pojeździe z listy kliknąć przycisk Properties.
2.2.4 Rezerwacja pojazdu
<img src="https://github.com/kubabar1/readme_images_repository/blob/master/car_rental_images/reserve1.gif" width="600"/> <img src="https://github.com/kubabar1/readme_images_repository/blob/master/car_rental_images/reserve2.gif" width="600"/>Zarezerwować pojazd może tylko zalogowany użytkownik. Aby zarezerwować pojazd należy wypełnić formularz znajdujący się na podstronie Home i kliknąć przycisk Reserve. Następnie należy wypełnić poszczególne podstrony formularza i na ostatniej wybrać Reserve. Pojazd można również zarezerwować poprzez kliknięcie przycisku Reserve, znajdującego się na podsterownie detali wybranego auta (użytkownik musi być zalogowany aby zobaczyć owy przycisk).
2.2.5 Dodanie komentarza na temat pojazdu.
<img src="https://github.com/kubabar1/readme_images_repository/blob/master/car_rental_images/comment.gif" width="600"/>Aby dodać komentarz należy być zalogowanym. Komentarz wraz z liczbą gwiazdek można dodać na podstronie szczegółów danego pojazdu.
2.2.6 Przejrzenie listy najlepszych ofert
<img src="https://github.com/kubabar1/readme_images_repository/blob/master/car_rental_images/bestoffers.gif" width="600"/>Listę najlepszych ofert możemy wyświetlić po kliknięciu przycisku Best offers w menu.
2.2.7 Przeczytanie informacji na temat firmy.
<img src="https://github.com/kubabar1/readme_images_repository/blob/master/car_rental_images/aboutus.gif" width="600"/>Informacje na temat firmy możemy przeczytać po kliknięciu przycisku About us.
2.2.8 Uzyskanie danych kontaktowych firmy.
<img src="https://github.com/kubabar1/readme_images_repository/blob/master/car_rental_images/contact.gif" width="600"/>Dane kontaktowe firmy możemy wyświetlić po kliknięciu przycisku Contact w menu.
2.2.9 Wysłanie e-maila do pracowników firmy.
<img src="https://github.com/kubabar1/readme_images_repository/blob/master/car_rental_images/contactemail.gif" width="600"/>Klient ma możliwość wysłania emaila do pracowników firmy poprzez formularz znajdujący się na podstronie Contacts.
2.2.10 Utworzenie nowego konta.
<img src="https://github.com/kubabar1/readme_images_repository/blob/master/car_rental_images/signup.gif" width="600"/>Nowe konto możemy utworzyć poprzez kliknięcie przycisku Sign up i prawidłowe wypełnienie formularza.
2.2.11 Zalogowanie się na istniejące konto.
<img src="https://github.com/kubabar1/readme_images_repository/blob/master/car_rental_images/login.gif" width="600"/>Aby zalogować się na istniejące konto należy kliknąć przycisk Log in, wpisać login i hasło, a następnie kliknąć przycisk Sign in.
2.2.12 Wylogowanie się z konta użytkownika.
<img src="https://github.com/kubabar1/readme_images_repository/blob/master/car_rental_images/logout1.gif" width="600"/> <img src="https://github.com/kubabar1/readme_images_repository/blob/master/car_rental_images/logout2.gif" width="600"/>Aby wylogować się z konta użytkownika należy kliknąć przycisk Log out, znajdujący się zarówno na głównej stronie internetowej jak i w panelu klienta.
PANEL ADMINA - BOOKING
<img src="https://github.com/kubabar1/readme_images_repository/blob/master/car_rental_images/bookings_admin.gif" width="600"
