Skip to content
This repository has been archived by the owner on Nov 5, 2023. It is now read-only.

06 ‐ Software Design and Architecture

Jump to bottom
Leonard Huth edited this page Jul 19, 2023 · 2 revisions

Tech Stack

tech_stack_mmt

This document describes each component of our web app's architecture and their respective roles.

Frontend

  1. Nuxt3: Our application is built on Nuxt3, a Vue.js framework that we've leveraged to create a universal web application. It handles our requests, renders our pages, and manages our routes.

  2. Tailwind CSS: We're using Tailwind CSS to rapidly build our custom user interfaces. This utility-first CSS framework lets us create responsive designs directly in our markup.

  3. DaisyUI: DaisyUI, a plugin for Tailwind CSS, is employed in our app to provide pre-built components and simplify UI styling.

  4. MapTiler: Our mapping platform, MapTiler, powers our map interfaces and location-based data functionality.

Backend

  1. Node.js: Our web app's backend services run on Node.js. It's our chosen JavaScript runtime for building fast and scalable network applications.

  2. Express.js: We've built our web server on Express.js, a minimal and flexible Node.js web application framework that provides a robust set of features for our app.

  3. Mailtrap: For safe email testing in staging and development, we're using Mailtrap. It's a fake SMTP server where we can view and inspect outgoing emails without them reaching the intended recipients.

  4. Nodemailer: Our server uses the Node.js module, Nodemailer, to send transactional emails, such as password resets and email confirmations.

  5. Google Cloud Storage: We're storing images uploaded by users in Google Cloud Storage, a scalable, durable, and highly available object storage service. We then store links to these images in our database.

  6. Nominatim API: The Nominatim API, a search engine for the OpenStreetMap database, is what we use to convert address data into geographic coordinates for our mapping and location-based services.

Infrastructure and DevOps

  1. Digital Ocean App Platform: We host our application on the Digital Ocean App Platform, which allows for easy deployment, scaling, and management without manual server or infrastructure management.

  2. GitHub / GitHub Projects: Our application's source code resides in GitHub, which provides us with version control and source code management. We also use GitHub Projects for project management, tracking issues, and organizing tasks.

Architektur

container_diagramm something_diagramm_mmt

User Stories

Benutzer

  1. Als Benutzer möchte ich mich registrieren können, um ein persönliches Konto auf der Webseite zu erstellen.

  2. Als Benutzer möchte ich mich einloggen können, um auf mein persönliches Konto zuzugreifen.

  3. Als Benutzer möchte ich Tickets für Veranstaltungen in einen Warenkorb legen können, damit ich sie später kaufen kann.

  4. Als Benutzer möchte ich Tickets aus meinem Warenkorb kaufen können, um Zugang zu den Veranstaltungen zu erhalten, für die ich mich interessiere.

  5. Als Benutzer möchte ich verschiedene Zahlungsmöglichkeiten nutzen können, um für meine Tickets zu bezahlen.

  6. Als Benutzer möchte ich eine Bestätigung meiner Ticketkäufe erhalten, damit ich weiß, dass die Transaktion erfolgreich war.

  7. Als Benutzer möchte ich eine übersichtliche und ansprechende Webseite nutzen, damit ich leicht finden kann, was ich brauche und die Nutzung der Seite genießen kann.

Veranstalter

  1. Als Veranstalter möchte ich mich registrieren können, um ein Veranstalterkonto auf der Webseite zu erstellen.

  2. Als Veranstalter möchte ich mich einloggen können, um auf mein Veranstalterkonto zuzugreifen.

  3. Als Veranstalter möchte ich neue Veranstaltungen erstellen können, um Tickets auf der Webseite zu verkaufen.

  4. Als Veranstalter möchte ich Details zu meinen Veranstaltungen (Datum, Ort, Preis, Beschreibung etc.) hinzufügen und aktualisieren können, um potenzielle Ticketkäufer zu informieren.

  5. Als Veranstalter möchte ich die Anzahl der verkauften Tickets in Echtzeit einsehen können, um meine Veranstaltungen zu managen.

  6. Als Veranstalter möchte ich eine Übersicht über die Einnahmen meiner Veranstaltungen haben, um meine Finanzen zu verwalten.

  7. Als Veranstalter möchte ich eine Benachrichtigung erhalten, wenn Tickets für meine Veranstaltungen ausverkauft sind, um informiert zu bleiben und ggf. zusätzliche Tickets bereitstellen zu können

Unbenanntes_Diagramm drawio_1

Sequenzdiagramm

Unbenanntes_Diagramm drawio_3

Flowcharts

Chekout Prozess

flowchart_cart

You can find a PDF version of this wiki here

Clone this wiki locally