S96: Your CryptoBank

S96: Your CryptoBank

Im Projekt „S96: Your CryptoBank“ habe ich Technologien wie ReactJS, TypeScript, JavaScript, PostgreSQL, CSS Modules und Styled Components eingesetzt. Das Hauptziel bestand darin, eine Kryptowährungs-Banking-Anwendung mit React und einer relationalen Datenbank zu entwickeln und Funktionen wie Benutzerauthentifizierung, kontrollierte Formulare sowie eine mit der Datenbank verbundene Terminverwaltung zu implementieren.

Dazu entwickelte ich eine dynamische Benutzeroberfläche mit ReactJS, verbesserte die Codesicherheit durch TypeScript, verwaltete die Kommunikation mit der PostgreSQL-Datenbank und verwendete CSS Modules zusammen mit Styled Components, um eine moderne, modulare und responsive Oberfläche zu erstellen.

Projektbeschreibung

„S96: Your CryptoBank“ ist eine auf Kryptowährungen basierende Banking-Anwendung, die es Benutzern ermöglicht, sich zu registrieren, sich anzumelden und eine personalisierte virtuelle Karte mit ihren persönlichen Daten zu erhalten. Die Plattform ermöglicht die Verwaltung von Benutzerinformationen sowie das Erstellen von Terminen über ein mit der Datenbank verbundenes System.

Das Projekt wurde entwickelt, um die Entwicklung von Fullstack-Anwendungen zu vertiefen, die Kommunikation zwischen Frontend, Backend und Datenbank umzusetzen und dabei bewährte Methoden für eine strukturierte und wartbare Codebasis anzuwenden.

Hauptfunktionen

• Benutzerregistrierung und Anmeldung: Benutzer können ein Konto erstellen und sich anmelden, um auf geschützte Funktionen der Anwendung zuzugreifen und ihre persönlichen Daten zu verwalten.

• Personalisierte virtuelle Karte: Nach der Anmeldung kann jeder Benutzer eine virtuelle Karte mit seinen persönlichen Informationen anzeigen lassen, wodurch eine digitale Banking-Erfahrung simuliert wird.

Darstellung der personalisierten virtuellen Karte, die registrierten Benutzern zur Verfügung steht.

• Terminverwaltung: Authentifizierte Benutzer können innerhalb der Plattform Termine erstellen und verwalten. Die verschiedenen Terminstatus werden visuell durch unterschiedliche Farben dargestellt, wodurch aktive oder stornierte Termine einfach erkannt werden können.

Visuelle Darstellung des Terminverwaltungssystems und seiner verschiedenen Status.

Verwendete Technologien und Werkzeuge

• ReactJS: Eingesetzt zur Entwicklung einer dynamischen, wiederverwendbaren und interaktiven Benutzeroberfläche.
• TypeScript: Implementiert, um die Codesicherheit durch statische Typisierung zu verbessern und die Wartbarkeit des Projekts zu erhöhen.
• JavaScript: Verwendet zur Entwicklung zentraler Funktionen und klientseitiger Interaktionen.
• PostgreSQL: Als Datenbanksystem eingesetzt, um Benutzer- und Termininformationen zu speichern und zu verwalten.
• CSS Modules: Verwendet zur Erstellung gekapselter Styles und zur Verbesserung der CSS-Code-Organisation.
• Styled Components: Eingesetzt zur Entwicklung moderner visueller Komponenten und einer flexiblen Strukturierung der Styles.

Herausforderungen und Lernerfahrungen

Während der Entwicklung dieses Projekts konnte ich meine Kenntnisse in folgenden Bereichen erweitern und vertiefen:

• Entwicklung von Fullstack-Anwendungen mit ReactJS.
• State-Management und wiederverwendbare Komponenten.
• Erstellung kontrollierter Formulare mit React.
• Integration von Frontend, Backend und Datenbank.
• Modernes Interface-Design mit Styled Components und CSS Modules.
• Verwendung von TypeScript zur Verbesserung der Codequalität und Wartbarkeit.
• Datenverwaltung mit PostgreSQL.

Spezialisierung

• Frontend-Entwicklung
• Backend-Entwicklung
• Fullstack-Entwicklung
• Datenbankintegration
• UI/UX-Design
• API-Integration