CodersCamp 2021 - Projekt Fullstack

🍲🍝🍜 JeszCoChcesz 🍲🍝🍜 catering skierowany do ludzi, którzy nie lubią, gdy narzuca im się wybory jedzeniowe, a jednocześnie dbają o zbilansowane odżywianie. Aplikacja wyliczy dla Ciebie wartości odżywcze Twoich posiłków, dzięki czemu będziesz mógł jeść ulubione dania przy jednoczesnym trzymaniu się wyznaczonej diety. Skomponuj swoje menu z dań z ulubionych restauracji, a my dostarczymy Ci zamówienie pod same drzwi. To także system partnerski zrzeszający najlepsze restauracje w Twoim mieście.

🖥️ Użyte technologie

Główne:

• React
• TypeScript
• Docker
• MongoDB
• Mongoose
• NestJS
• Express
• Nodemailer
• Swagger

Pomocnicze:

• Yarn

• Jest

• ESLint

• VS Code

• Git

• GitHub

• Figma

• PassportJWT

• REST Client

• Immer

• React Router

• MUI

• Vite

• Lodash

  
  
  

⚙️ Instalacja projektu

Do przygotowania środowiska dev użyliśmy m.in. Dockera, więc zakładamy, że jest on wcześniej zainstalowany i skonfigurowany.

Instalacja i uruchomienie projektu z wykorzystaniem yarn

yarn install
docker-compose up

Uruchomienie serwera developerskiego. Aplikacja będzie dostępna pod adresem lokalnym (front - http://localhost:3000 oraz API - http://localhost:4000/api):

yarn dev

Wygenerowanie plików produkcyjnych:

yarn build

Pozostałe komendy

Sprawdzenie projektu za pomocą ESLint:

yarn lint

Uruchomienie wszystkich testów:

yarn test

Korzystanie z aplikacji

Osoba niezalogowana ma dostęp do listy restauracji i dań. Ponadto dania i restauracje może filtrować na podstawie miasta, rodzaju kuchni, rodzaju posiłku i tagów. Aby w pełni korzystać z aplikacji, należy założyć konto i się zalogować. Istnieje możliwość rejestracji jako restauracja partnerska (Partner) i zwykły użytkownik (User).

Partner – restauracja partnerska

1. Rejestruje się podając email oraz NIP i ustawiając hasło.

2. Po rejestracji i zalogowaniu uzupełnia profil (nazwa restauracji, opis, logo, tagi, adres(y), telefon).

3. Po uzupełnieniu profilu partner może dodawać dania (nazwa, opis dania, tagi, lista składników, alergeny, kaloryczność, wartości odżywcze).

4. Partner może edytować i usuwać dania.

User - użytkownik

1. Rejestruje się podając email i ustawiając hasło. Uzupełnione dane są walidowane. Użytkownik otrzymuje wiadomość e-mail potwierdzającą rejestrację.

2. Po rejestracji i zalogowaniu może uzupełnić profil (imię, nazwisko, adres(y), nr telefonu, dane karty) lub zacząć kompletować zamówienie.

3. Użytkownik może dodawać dania i restauracje do ulubionych.

4. Zamawianie:

   4.1. Użytkownik ze strony głównej wybiera miasto, z którego chce zamówić dania. Złożenie zamówienia jest możliwe po uzupełnieniu danych na profilu.

   4.2. Użytkownik przechodzi do strony z widokiem wyszukiwania dań dostępnych dla wybranego miasta. Na tym etapie dokonuje przypisania dania/dań do konretnej daty dostawy.

   Widok wyszukiwania dań

   W tym widoku użytkownik może dokonać zwiększenie/zmniejszenie ilości oraz usunięcie dania z koszyka.

   Podczas dodawania dań użytkownik może spersonalizować posiłek poprzez usunięcie wybranych składników (wcześniej oznaczonych przez restaurację jako możliwe do usunięcia).

   Jednocześnie w "podsumowaniu dnia" dynamicznie przeliczane są wartości odżywcze, kalorie oraz cena. Z każdą zmianą widoczna jest także zmiana ilości dań w koszyku.

   Z bocznego panelu (po lewej stronie) użytkownik może wybrać filtrowanie wyników wyszukiwania ze względu na "Rodzaj dania" lub "Tagi".

   4.3. Po wyborze zamówienia użytkownik przechodzi do widoku "Podsumowanie" gdzie może zapoznać się z podziałem wybranych dań na dni. Na tym etapie może w dalszym ciągu modyfikować swoje zamówienie. Otrzymuje też informację o całościowej kwocie do zapłaty.

   Krok 1 - "Podsumowanie"

   4.4. W następnym kroku użytkownik przechodzi do "Uzupełnienia danych" gdzie wybiera godzinę dostawy, uzupełniadane personalne oraz adres dostawy.

   Krok 2 - "Uzupełnij dane"

   4.5. Ostatnim krokiem jest "Zapłać i zamów" gdzie użytkownik uzupełnia dane do płatności. Użytkownik otrzymuje wiadomość e-mail potwierdzającą złożenie zamówienia.

   Krok 3 - "Zapłać i zamów"

📢 Wykonywanie zapytań / testowanie endpointów 📣

Swagger

Zbiór wszystkich dostępnych zapytań widocznych z poziomu przeglądarki.

Przykładowy widok

REST Client

Rozszerzenie do VSCode, które pozwala na wykonywanie zapytań z poziomu edytora kodu.

Przykładowy widok

👨‍💻 Autorzy 👩‍💻

Mentor: @htk4

Tech Lead: @mmejer

Project Manager: @jskrajna

Scrum Master: @tchojnacki

@KamilDudek