CodersCamp 2020 | Projekt Zespołowy | React.js

Internetowa platforma do handlu nieruchomościami.

Zespół projektowy

Zespół pracował w ramach kursu CodersCamp. Aplikację wykonali uczestnicy kursu przy pomocy mentora. Zachęcamy do odwiedzenia profili członków zespołu, w celu zapoznania się z ich portfolio.

Mentor: João Kiakumbo Sebastião

Uczestnicy:

Real-Estate

W ramach piątego projektu zadaniem naszego zespołu było opracowanie frontendu do internetowej platformy do handlu nieruchomościami. Jest to platforma, na której użytkownicy mogą wystawiać, sprzedawać, rezerwować oraz przeglądać nieruchomości. Językiem domyślnym platformy będzie język angielski.

Demo

Wersja demonstracyjna aplikacji jest dostępna TUTAJ

####Widok Home Ekran startowy

Ekran startowy

Ekran startowy

Cel projektu

Celem projektu było przygotowanie internetowej platformy do handlu nieruchomościami. Aplikacja została stworzona w React.js.

Lista funkcjonalności aplikacji

  1. Rejestracja oraz logowanie (weryfikacja uprawnień).
  2. Tworzenie trzech różnych typów kont: dla sprzedających, kupujących oraz pracowników.
  3. Dodawanie, edycja, usuwanie ogłoszeń jako zalogowany sprzedający.
  4. Przeglądanie istniejących ogłoszeń z możliwością filtrowania.
  5. Tworzenie rezerwacji przez użytkownika.
  6. Przeglądanie sieci biur w różnych miastach na całym świecie.
  7. Opłata rezerwacji online oraz informacja zwrotna w postaci maila.
  8. Zakup nieruchomości online razem z rejestracją jak i bez niej, po uprzednim podaniu wszystkich wymaganych danych.
  9. Możliwośc kontaktu

Wykorzystywane technologie

  • React.JS
  • TypeScript
  • scss

Działanie aplikacji

Odnośnik buy

Pokazuje wszystkie ogłoszenia

Buy

ogłoszenie

Wchodząc na ogłoszenie z listy ogłoszeń można zobaczyć dokładne informacje o ogłoszeniu.

Listing1

Listing2

Odnośnik office

Pokazuje listę dostępnych biur.

Offices

Po zalogowaniu przez sprzedawcę

Zmienia się pasek menu umożliwiając sprzedaż.

Logged

Dodanie ogłoszenia:

Sell

Widok własnych ogłoszeń na panelu użytkownika:

Account

W projekcie każdy z uczestników zaprezentował praktyczną znajomość poniższych zagadnień związanych z TypeScript oraz React.JS:

  • Tworzenie komponentów, formularzy z walidacją
  • Wykorzystanie endpointów z api stworzonego w poprzednim projekcie
  • Tworzenie stylów (scss)
  • Wykorzystanie danych w cookies
  • integracja z zewnętrznym systemem (np. wysyłanie e-maili)

Organizacja pracy

Praca zespołu była organizowana przy użyciu narzędzi dostarczanych przez GitHub. Zadania opisywaliśmy za pomocą GitHub Issues i dzieliśmy czas ich wykonania na tygodnie za pomocą GitHub Projects. Każde z zadań było estymowane przez mentora, dzięki czemu staraliśmy się, aby liczba punktów przypadająca w danym tygodniu na każdą osobę w zespole była podobna. Jeśli chcesz zaproponować, jakąś zmianę w aplikacji, utwórz nowy Issue, wzorując się na poprzednich.