Stellenbeschreibung
.job-details-sectionheader { background-color: #fff; padding: 20px; margin-left: -32px; margin-right: 20px; margin-top: 20px; margin-bottom: 20px; border-radius: 10px; max-width: 800px; width: 95%; } .job-details-sectionheader h2 { font-size: 1.5em !important; font-weight: bold; color: #2c2c2c; margin-bottom: 2rem !important; line-height: 1.3; } /* - DETAILS GRID - */ .details-container { display: grid; font-size: 15pt !important; grid-template-columns: repeat(3, 1fr); /* now three columns on larger screens */ gap: 20px 40px; } .detail-pair { display: flex; flex-direction: column; min-width: 0; } .detail-value { color: #000; word-break: break-word; overflow-wrap: break-word; } .detail-label { font-weight: bold; color: #555; margin-bottom: -5px; } /* - MOBILE VIEW - */ @media (max-width: 600px) { .details-container { grid-template-columns: 1fr; /* single‑column stack on small screens */ gap: 0 0; } .job-details-section h2 { font-size: 1.5em !important; margin-bottom: 2.5rem !important; } .job-details-sectionheader { background-color: #fff; padding: 20px; margin-left: -10px; margin-right: 20px; margin-top: 20px; margin-bottom: 20px; border-radius: 10px; max-width: 800px; width: 95%; } }
Full Stack Developer (m|w|d)
Tätigkeitsfeld:
Datenmanagement
Bereich:
Business-Risk, B2C- und PM-Prozesse
Einsatzort:
Frankfurt am Main
Karrierelevel:
Berufserfahrene
Beschäftigung:
Vollzeit
Startzeitpunkt:
nächstmöglicher Zeitpunkt
Was Sie erwartet
Aufnahme, Analyse und Dokumentation fachlicher und technischer Anforderungen in enger Zusammenarbeit mit Fachbereichen und Stakeholdern
Übersetzung von Business-Anforderungen in technische Spezifikationen und User Stories
Erstellung von technischen Konzepten und Lösungsarchitekturen
Konzeption, Entwicklung und Pflege moderner, responsiver Webanwendungen mit React
Implementierung ansprechender und benutzerfreundlicher User Interfaces unter Berücksichtigung von UX/UI-Best-Practices
Entwicklung wiederverwendbarer Komponenten und Komponentenbibliotheken
Entwicklung und Wartung von RESTful APIs und Microservices (vorwiegend Python)
Anbindung und Integration von Datenbanken und externen Schnittstellen
Sicherstellung von Skalierbarkeit, Sicherheit und Performance der Backend-Systeme
Entwicklung automatisierter Tests (Unit-, Integrations- und End-to-End-Tests)
Code-Reviews und kontinuierliche Verbesserung der Softwarequalität
Weiterentwicklung der zentralen internen Datenplattform
Erstellung interaktiver Dashboards und Visualisierungen
Unterstützung bei der Implementierung von ML- und KI-Komponenten
Eigenverantwortliche Umsetzung von Features in agilen Entwicklungsteams
Mentoring von Junior-Entwicklern und Trainees
Was Sie mitbringen
Erfolgreich abgeschlossenes Studium der Informatik, Wirtschaftsinformatik oder eines vergleichbaren Studiengangs. Alternativ eine vergleichbare Qualifikation mit entsprechender Berufserfahrung.
Sehr gute Kenntnisse in JavaScript und TypeScript
Fundierte Erfahrung mit React und dem React-Ökosystem (React Router, Hooks, Context API)
Erfahrung mit State-Management-Bibliotheken (Redux, Zustand, MobX o. ä.)
Sicherer Umgang mit HTML5, CSS3/SCSS und modernen CSS-Frameworks (z. B. Tailwind CSS, Material UI, Styled Components)
Erfahrung mit Frontend-Testing (Jest, React Testing Library, Cypress)
Gute Kenntnisse in Python und gängigen Frameworks (z. B. FastAPI, Flask, Django)
Erfahrung mit RESTful API-Design und -Entwicklung
Sicherer Umgang mit relationalen Datenbanken (Oracle) und SQL
Erfahrung in der Aufnahme und Dokumentation von Anforderungen
Kenntnisse in der Erstellung von User Stories, Akzeptanzkriterien und technischen Spezifikationen
Fähigkeit, komplexe fachliche Anforderungen in technische Lösungen zu übersetzen
Erfahrung in der Zusammenarbeit mit Fachbereichen und interdisziplinären Teams
Sicherer Umgang mit Git und gängigen Git-Workflows
Vertrautheit mit agilen Entwicklungsmethoden und Tools (Jira, Confluence)
Selbstständige, lösungsorientierte und strukturierte Arbeitsweise
Hoher Qualitätsanspruch und Detailgenauigkeit
Spaß an der Arbeit im Team, Neugier und Kommunikationsstärke
Sehr gute Deutsch (C1/C2)- und Englischkenntnisse in Wort und Schrift
Was wir Ihnen bieten
Informationen auf einen Blick
Job Detail – Mobile Optimized (Fixed) /* ===================== Base & Reset ===================== */ * { box-sizing: border-box; font-family: custom3036a5533edf479c8387e; margin: 0; padding: 0; max-width: 100%; word-wrap: break-word; overflow-wrap: break-word; } html { overflow-x: hidden !important; max-width: 100vw !important; } body { font-family: custom3036a5533edf479c8387e !important; background-color: #f9f9fb; color: #2C2C2C; line-height: 1.6; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overflow-x: hidden !important; max-width: 100vw !important; width: 100% !important; } /* ===================== Job-Hauptbereich ===================== */ #jobColumnOneRegion { width: 100% !important; max-width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; box-sizing: border-box; } .jobColumnTwo { padding-left: 30px !important; } /* ===================== Images ===================== */ /* Nur Bilder im Jobbereich und in Karten stylen – globale Logos ausnehmen */ #jobColumnOneRegion img, .box img, .about-card img, .about-card-recruiter img, .contact-img, .contact-img-dzbank, .full-width-image { display: block; max-width: 100%; height: auto; border-radius: 10px; } .full-width-image { width: 100%; height: auto; object-fit: cover; border-radius: 10px; } /* ===================== DTM Header ===================== */ .customPlugin-697b9d670f8a122d.displayDTM .inner { padding: 0 !important; max-width: 100% !important; width: 100% !important; padding-top: 55px !important; } .customPlugin-697b9d670f8a122d.displayDTM.header-hero { position: static !important; overflow: visible !important; height: auto !important; min-height: auto !important; max-height: none !important; clip: none !important; clip-path: none !important; margin: 0 !important; padding: 0 !important; position: relative; z-index: 1; } .customPlugin-697b9d670f8a122d.displayDTM.header-hero img { position: static !important; top: auto !important; left: auto !important; right: auto !important; bottom: auto !important; transform: none !important; clip: none !important; clip-path: none !important; object-fit: contain !important; max-height: none !important; display: block; width: 100%; height: auto; } /* ===================== Box ===================== */ .box { font-family: custom3036a5533edf479c8387e !important; background-color: #ffffff !important; padding: 1.5rem; margin-bottom: 2rem; border-radius: 10px; box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.2); } .box h2 { font-size: 16pt !important; color: #2C2C2C; margin-bottom: 15pt; margin-top: 0; } .box ul { padding-left: 20px !important; } .box ul li { margin-bottom: 1.5rem; color: #2C2C2C; line-height: 1.5; } .box ul li::marker { color: #bda08f; font-size: 1.2em; } /* ===================== Benefits ===================== */ .benefits-image { width: 75%; border-radius: 10px; object-fit: cover; } /* ===================== About / Recruiter ===================== */ .about-card, .about-card-recruiter { max-width: 100%; width: 100%; margin: 2rem auto; background-color: #ffffff !important; border-radius: 10px; overflow: hidden; } /* Desktop: Über uns Block auf gleiche Höhe wie "Was Sie erwartet" */ @media (min-width: 769px) { .about-card { margin-top: 290px !important; } /* Header vollständig sichtbar machen */ .customPlugin-697b9d670f8a122d.displayDTM.header-hero { position: static !important; overflow: visible !important; height: auto !important; min-height: auto !important; clip: none !important; clip-path: none !important; } .customPlugin-697b9d670f8a122d.displayDTM.header-hero img { position: static !important; top: auto !important; left: auto !important; transform: none !important; clip: none !important; clip-path: none !important; } /* Header-Plugin sicherstellen */ .customPlugin-697b9d670f8a122d.displayDTM.header-hero { margin-bottom: 2rem !important; position: relative; z-index: 10; } } .about-card-recruiter { margin-top: 0 !important; } .about-header h2, .about-header h2contact { font-size: 16pt; margin-bottom: 10px; color: #2C2C2C !important; } .about-content { padding-left: 0 !important; } .about-text { font-size: 11pt; color: #2C2C2C; margin-bottom: 1rem; } /* ===================== Contact ===================== */ .contact-img { width: 100%; border-radius: 10px; object-fit: cover; } .contact-img-dzbank { border-radius: 0; width: 90%; object-fit: cover; } .contact-content { padding: 1.2rem; padding-left: 0 !important; padding-right: 0 !important; } .contact-name { font-size: 16pt; font-weight: normal; color: #2C2C2C; } .contact-title { font-size: 16pt; color: #0000FF !important; margin-bottom: 1rem; } .contact-message, .application-info, .application-title { font-size: 17px; color: #2C2C2C; } .application-title { margin-bottom: 0.3rem; } .application-info { font-size: 11pt; /* padding-top: 1rem; border-top: 1px solid #e0e0e0; margin-top: 1rem; */ } /* ===================== Job Details Header ===================== */ .job-details-sectionheader, .job-details-sectionhidden { background-color: #ffffff !important; margin: 0 0 20px -20px; border-radius: 10px; max-width: 800px; width: 105%; } .job-details-sectionhidden { opacity: 0 !important; visibility: hidden !important; display: none !important; } .job-details-sectionheader h2, .job-details-sectionhidden h2 { font-size: 18pt !important; font-weight: bold; color: #000; margin-bottom: 2rem; } /* ===================== Details Grid ===================== */ .details-container { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px 40px; font-size: 15pt !important; } .detail-pair { display: flex; flex-direction: column; } .detail-label { font-weight: bold; color: #2C2C2C; margin-bottom: -5px; } .detail-value { color: #2C2C2C; word-break: break-word; } /* ===================== RMK: Flush Layout (Shell/Content) ===================== */ .jobDisplayShell, .jobDisplayShell .content, .jobDisplayShell .content .job, .jobDisplay, .jobDisplay .content, .jobDisplay .content .job { padding-left: 0 !important; padding-right: 0 !important; margin-left: 0 !important; margin-right: 0 !important; } /* Bootstrap-Gutter im linken Contentblock neutralisieren */ #jobColumnOneRegion .col-xs-12, #jobColumnOneRegion .col-xs-12.fontalign-left { padding-left: 0 !important; padding-right: 0 !important; margin-left: 0 !important; margin-right: 0 !important; } /* Boxen bündig links/rechts (keine Begrenzung) */ #jobColumnOneRegion .col-xs-12 .box { width: 100% !important; max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; padding: 1.5rem; } /* Plugin unterhalb bündig ausrichten */ .jobDisplayShell .content .job .customPlugin { width: 100% !important; max-width: 100% !important; clear: both; margin: 0 !important; padding: 0 !important; } .jobDisplayShell .content .job .customPlugin .inner { max-width: 100% !important; margin: 0 !important; padding-left: 0 !important; padding-right: 0 !important; } /* Generische inner-Wrapper entgraten */ .jobDisplayShell .inner, .jobDisplay .inner { padding-left: 0 !important; padding-right: 0 !important; margin-left: 0 !important; margin-right: 0 !important; } /* ===================== Mobile Optimierungen ===================== */ @media (max-width: 768px) { .details-container { grid-template-columns: 1fr; gap: 15px; width: 100%; max-width: 100%; } .box { padding: 1.25rem; margin-bottom: 1.5rem; width: 100%; max-width: 100%; } .box h2 { font-size: 14pt !important; } /* Über uns & Recruiter-Karten sollen sich genau wie .box verhalten */ .about-card, .about-card-recruiter { width: 100%; max-width: 100%; margin: 0 0 1.5rem 0; padding: 1.25rem; overflow: hidden; border-radius: 10px; } /* Keine zusätzliche linke Einrückung – Text fluchtet mit .box */ .about-header h2, .about-header h2contact { font-size: 14pt; color: #2C2C2C !important; text-align: left; padding-left: 0; } .about-text { font-size: 10pt; text-align: left; padding-left: 0; } .about-card .contact-content, .about-card-recruiter .contact-content { text-align: left; padding: 0; display: block; } /* Bilder in den Cards zentrieren */ .contact-img { width: 70%; margin: 0 auto 1rem auto; margin-left: 0px; display: block; } .contact-img-dzbank { width: 60%; margin: 0 auto 1rem auto; display: block; } .contact-name { font-size: 14pt; text-align: left; } .contact-title { font-size: 13px; text-align: left; } .contact-message, .application-info { font-size: 13px; text-align: left; } .job-details-sectionheader { margin: 0 0 15px 0; width: 100%; max-width: 100%; } .job-details-sectionheader h2 { font-size: 16pt !important; } /* Zusätzliche Overflow-Kontrolle für mobile Geräte */ body, html { overflow-x: hidden; max-width: 100vw; } /* Alle Elemente im Jobbereich auf mobile Breite begrenzen */ #jobColumnOneRegion * { max-width: 100%; } .jobDisplayShell, .jobDisplayShell .content, .jobDisplayShell .content .job, .jobDisplay, .jobDisplay .content, .jobDisplay .content .job { width: 100% !important; max-width: 100% !important; overflow-x: hidden !important; } } @media (max-width: 480px) { .box { padding: 1rem; margin-bottom: 1.25rem; width: 100%; } .details-container { gap: 10px; width: 100%; } .about-card { width: 100%; margin: 1rem auto; } /* Noch strengere Overflow-Kontrolle für sehr kleine Bildschirme nur im Jobbereich */ #jobColumnOneRegion * { max-width: 100%; } .jobColumnTwo { padding-left: 0px !important; } }
Über uns
Die DZ PRIVATBANK ist das Kompetenzcenter Private Banking sowie bedeutender Akteur für Fondsdienstleistungen und Kredite in allen Währungen innerhalb der Genossenschaftlichen FinanzGruppe Volksbanken Raiffeisenbanken.
Die DZ PRIVATBANK ist spezialisiert auf anspruchsvolle, individuelle Lösungen für Private-Banking-Kunden mit einem Leistungsspektrum von der klassischen Vermögensverwaltung über die Vermögensstrukturierung, Vermögensberatung, Finanz- und Vorsorgeplanung bis hin zu Stiftungsberatungen.
Über uns
Die DZ PRIVATBANK ist das Kompetenzcenter Private Banking sowie bedeutender Akteur für Fondsdienstleistungen und Kredite in allen Währungen innerhalb der Genossenschaftlichen FinanzGruppe Volksbanken Raiffeisenbanken.
Die DZ PRIVATBANK ist spezialisiert auf anspruchsvolle, individuelle Lösungen für Private-Banking-Kunden mit einem Leistungsspektrum von der klassischen Vermögensverwaltung über die Vermögensstrukturierung, Vermögensberatung, Finanz- und Vorsorgeplanung bis hin zu Stiftungsberatungen.
Recruiter
Soraya Reindl
Mein Name ist Soraya Reindl und ich begleite Sie gerne auf Ihrem Weg zu uns!
Was mich an meinem Job begeistert? Auf viele unterschiedliche Menschen zu treffen und Potenzialträger für unsere Bank zu gewinnen, die etwas bewegen wollen. Wenn Sie Lust auf Verantwortung und Entwicklung haben, freue ich mich auf Ihre Bewerbung!
Recruiter
Soraya Reindl
Mein Name ist Soraya Reindl und ich begleite Sie gerne auf Ihrem Weg zu uns!
Was mich an meinem Job begeistert? Auf viele unterschiedliche Menschen zu treffen und Potenzialträger für unsere Bank zu gewinnen, die etwas bewegen wollen. Wenn Sie Lust auf Verantwortung und Entwicklung haben, freue ich mich auf Ihre Bewerbung!
#body.unify div.unify-button-container .unify-apply-now: focus, #body.unify div.unify-button-container .unify-apply-#body.unify div.unify-button-container .unify-apply-now: focus, #body.unify div.unify-button-container .unify-apply-
#body.unify div.unify-button-container .unify-apply-now: focus, #body.unify div.unify-button-container .unify-apply-#body.unify div.unify-button-container .unify-apply-now: focus, #body.unify div.unify-button-container .unify-apply-
