CodersCamp 2021 - Projekt React

CodersCamp (coderscamp.edu.pl) - Największy otwarty kurs programowania webowego

Zespół ✨

Michał Miszczyszyn 💻
Weroniika 💻	Mateusz Binięda 💻	Krystian Gaczyński 💻	Karol Wolski 💻

Bking - Your Vacation Rentals!

Planujesz wakacje, ale nie masz jeszcze noclegu? Słoneczne plaże i apartamenty, a może szybki nocleg pomiędzy podróżami? Nie ma problemu! Nasza aplikacja pomoże Ci znaleźć miejsce, którego szukasz. Bądź jak król podczas swojej wyprawy i rozkoszuj się przyjemnym wypoczynkiem!

DEMO

Repozytorium części I projektu, dotyczącej - Single Page Applications
Repozytorium części II projektu, dotyczącej - Server Side JavaScript

Wersja demonstracyjna aplikacji, jest dotępna pod tym linkiem -> DEMO

Założenia projektowe

Projekt dzieli się na dwa etapy. Pierwszy dotyczący modułu - Single Page Applications, oraz drugi - Server Side JavaScript. Założeniem zespołu, jest wykorzystanie zdobytej wiedzy, by zaimplementować ją w praktyce przy stworzeniu aplikacji zarówno od strony frontendowej, jak i zapleczu backendowym. Grupa projektowa pod okiem Michała, zdecydowała się na aplikacje dotyczącą rezerwacji noclegów. Poprzez doświadczenie nabyte z poprzedniego projektu, praca w grupie przebiega płynniej a umiejętności są stopniowo rozwijane.

Wykorzystane technologie i działanie aplikacji

• React
• React router
• React hook form
• React datepicker
• React icons
• React map gl
• Sass modules

Dodatkowo aplikacja została poparta odpowiednimi testami oraz fukcjonalnością autoryzacyjną. Projekt pozwala nam na określenie lokalizacji przy użyciu Mapbox API.
Aplikacja daje użytkownikowi szereg możliwości związanych z wyszukiwaniem ofert hoteli, apartamentów czy innych noclegów. Głównym ekranem, jest wyszukiwarka, która poprzez wybór odpowiedniego kryterium daje nam możliwość na wyszukiwanie ofert. Klasycznie istnieje rónież możliwość rejestracji, logowania czy przypominania hasła,aż po filtrowanie poszukiwanych miejsc ze względu na lokalizację, czy odpowiednią cenę. Dodatkowo zalogowany użytkownik uzyskuje możliwość zgłoszenia dodania własnego obiektu, wraz z szeregiem informacji.

Wygląd aplikacji

Logo

Ekran główny

Responsywność

Przykładowe screeny

Uruchomienie aplikacji

Aplikacje możesz uruchomić poprzez:

1. Stronę internetową: https://michal-team-projekt-2.netlify.app/

Lub:

1. Sklonować nasze repozytorium z części 1 projektu https://github.com/CodersCamp2021/michal-team-projekt-2/pull/151/files na swoją maszynę.
2. Zainstalować zależności za pomocą: npm install
3. Uzupełnienie wartości pliku .env, pamiętaj żeby w REACT_APP_API_URL=, dodać wartosć serwera postawionego w projekcie 3: bking-api.herokuapp.com/
4. Wystartować serwer deweloperski poprzez komendę: npm run dev