{"id":12459,"date":"2024-04-26T11:24:35","date_gmt":"2024-04-26T09:24:35","guid":{"rendered":"https:\/\/apriko.com\/de\/?post_type=detail-page&#038;p=12459"},"modified":"2025-01-06T10:57:37","modified_gmt":"2025-01-06T08:57:37","slug":"automatische-generierung-der-grafischen-benutzeroberflaeche-ui","status":"publish","type":"detail-page","link":"https:\/\/apriko.com\/de\/blog\/automatische-generierung-der-grafischen-benutzeroberflaeche-ui\/","title":{"rendered":"Automatische Generierung der grafischen Benutzeroberfl\u00e4che (UI)"},"content":{"rendered":"\n<section id=\"detail-main-block-66cc7fefc32a4\" class=\"section section-detail\">\n<style>\r\n    @media only screen and (min-width: 768px) {\r\n        #detail-main-block-66cc7fefc32a4{ padding-top:0px !important;padding-bottom:15px !important;}\r\n    }\r\n\r\n    @media only screen and (max-width: 767px) {\r\n        #detail-main-block-66cc7fefc32a4{ padding-top:0px !important;padding-bottom:15px !important;}\r\n    }\r\n<\/style>\n\t<div class=\"container\">\n        <ul class=\"breadcrumbs\"><li><a href=\"https:\/\/apriko.com\/de\/\">Apriko<\/a><\/li><\/ul>\n\t\t<div>\n\t\t\t<div class=\"detail-info__content\">\n                \n                \n\t\t\t\t\n\t\t\t\t<div class=\"detail-article__title\">\n                                        <h3 class=\"title-4\">Designprozess<\/h3>\n                    \n                    \t\t\t\t<\/div>\n\n                \t\t\t\t<div class=\"text-block\">\n                    <p>Als Beispiel: Im Designprozess wird eine Entit\u00e4t \u201ePerson\u201c definiert, die verschiedene Merkmale wie Vorname und Nachname enth\u00e4lt. Jedes dieser Merkmale kann auch Validierungsregeln unterliegen \u2013 so sind etwa Vor- und Nachname Pflichtfelder. Das \u201eWas\u201c bezieht sich auf die \u00e4ussere Perspektive der Applikation, also auf die Modellierung von Entit\u00e4ten und die Definition von Gesch\u00e4ftsregeln (Business Rules). Deklarative Ans\u00e4tze bieten viele Vorteile, insbesondere da sie die Komplexit\u00e4t verringern. Interne Mechanismen werden schneller umgesetzt und sind unmittelbar sichtbar, ohne dass grosse Mengen an Code zun\u00e4chst analysiert werden m\u00fcssen.<\/p>\n\t\t\t\t<\/div>\n                \n                \t\t\t<\/div>\n\t\t<\/div>\n        \n        \r\n\t<\/div>\n<\/section>\n\n\n<section id=\"detail-main-block-66cc7fefc33da\" class=\"section section-detail\">\n<style>\r\n    @media only screen and (min-width: 768px) {\r\n        #detail-main-block-66cc7fefc33da{ padding-top:0px !important;padding-bottom:15px !important;}\r\n    }\r\n\r\n    @media only screen and (max-width: 767px) {\r\n        #detail-main-block-66cc7fefc33da{ padding-top:0px !important;padding-bottom:15px !important;}\r\n    }\r\n<\/style>\n\t<div class=\"container\">\n        \n\t\t<div>\n\t\t\t<div class=\"detail-info__content\">\n                \n                \n\t\t\t\t\n\t\t\t\t<div class=\"detail-article__title\">\n                                        <h3 class=\"title-4\">Problematik des manuellen Boilerplate-Managements<\/h3>\n                    \n                    \t\t\t\t<\/div>\n\n                \t\t\t\t<div class=\"text-block\">\n                    <p>\u00dcblicherweise wird das \u201eWie\u201c manuell implementiert. Dies bietet zwar Flexibilit\u00e4t, f\u00fchrt jedoch schnell zu einer vertikalen Erweiterung \u00fcber alle Schichten der Software-Architektur. Das Hauptproblem besteht darin, die Koh\u00e4renz sicherzustellen. Es m\u00fcssen \u00e4hnliche Probleme mit \u00e4hnlichen L\u00f6sungsans\u00e4tzen behandelt werden, um stilistische und funktionale Vollst\u00e4ndigkeit und Konsistenz zu gew\u00e4hrleisten. Werden nachtr\u00e4glich \u00c4nderungen vorgenommen, besteht das Risiko, dass wichtige Anpassungen \u00fcbersehen werden, was zu Bugs und Software-Regressionen f\u00fchren kann.<\/p>\n\t\t\t\t<\/div>\n                \n                \t\t\t<\/div>\n\t\t<\/div>\n        \n        \r\n\t<\/div>\n<\/section>\n\n\n<section id=\"detail-main-block-66cc7fefc34b5\" class=\"section section-detail\">\n<style>\r\n    @media only screen and (min-width: 768px) {\r\n        #detail-main-block-66cc7fefc34b5{ padding-top:0px !important;padding-bottom:15px !important;}\r\n    }\r\n\r\n    @media only screen and (max-width: 767px) {\r\n        #detail-main-block-66cc7fefc34b5{ padding-top:0px !important;padding-bottom:15px !important;}\r\n    }\r\n<\/style>\n\t<div class=\"container\">\n        \n\t\t<div>\n\t\t\t<div class=\"detail-info__content\">\n                \n                \n\t\t\t\t\n\t\t\t\t<div class=\"detail-article__title\">\n                                        <h3 class=\"title-4\">Inferenz<\/h3>\n                    \n                    \t\t\t\t<\/div>\n\n                \t\t\t\t<div class=\"text-block\">\n                    <p>Aus den zentral definierten Entit\u00e4ten, Merkmalen, Aktionen und Gesch\u00e4ftsregeln wird automatisch weitergehende Logik abgeleitet. Zum einen r\u00fcckw\u00e4rts in tieferen Schichten, indem die Datenbankstruktur automatisch generiert und falls n\u00f6tig migriert wird. Zum anderen vorw\u00e4rts in h\u00f6heren Schichten, indem z.B. Infrastrukturkomponenten und Web-Service-Schnittstellen (API\/REST) generiert werden.<\/p>\n<p>Diese Deklarationen, sprich Layout-Definitionen, werden bis ins UI\/Frontend getragen. Eine eigens entwickelte UI-Engine verarbeitet diese, um die grafische Benutzeroberfl\u00e4che zu generieren.<\/p>\n<p>Da diese Architektur eine starke Standardisierung erfordert, m\u00fcssen viele Anforderungen vereinheitlicht werden, um das volle Potenzial auszusch\u00f6pfen. Die Robustheit der Architektur liegt jedoch darin, dass sie Abweichungen vom Standard zul\u00e4sst, um spezifische Gesch\u00e4ftslogik gezielt zu implementieren, ohne dass dabei Inkonsistenzen entstehen.<\/p>\n\t\t\t\t<\/div>\n                \n                \t\t\t<\/div>\n\t\t<\/div>\n        \n        \r\n\t<\/div>\n<\/section>\n\n\n<section id=\"detail-main-block-66cc7fefc3583\" class=\"section section-detail\">\n<style>\r\n    @media only screen and (min-width: 768px) {\r\n        #detail-main-block-66cc7fefc3583{ padding-top:0px !important;padding-bottom:15px !important;}\r\n    }\r\n\r\n    @media only screen and (max-width: 767px) {\r\n        #detail-main-block-66cc7fefc3583{ padding-top:0px !important;padding-bottom:15px !important;}\r\n    }\r\n<\/style>\n\t<div class=\"container\">\n        \n\t\t<div>\n\t\t\t<div class=\"detail-info__content\">\n                \n                \t\t\t\t<h2 class=\"title-3\">Frontend-Engine<\/h2>\n                \n\t\t\t\t\n\t\t\t\t<div class=\"detail-article__title\">\n                                        <h3 class=\"title-4\">Layout-Definitionen<\/h3>\n                    \n                    \t\t\t\t<\/div>\n\n                \t\t\t\t<div class=\"text-block\">\n                    <p>Jeder Service stellt seine Deklarationen in Form von JSON-Dateien als Layout-Definitionen f\u00fcr die Frontend-UI-Engine bereit. Diese Layout-Definitionen enthalten alle Entit\u00e4ten, Merkmale, Aktionen und Gesch\u00e4ftsregeln in strukturierter Form. Das Frontend kann auf dieser Grundlage den Grossteil der Anwendungsf\u00e4lle darstellen, ohne dass zus\u00e4tzliche Programmierung erforderlich ist. Dies erm\u00f6glicht ein weitgehend unabh\u00e4ngiges und autarkes Frontend, das nur lose mit dem Backend gekoppelt ist.<\/p>\n<picture><img decoding=\"async\" class=\"attachment-full size-full\" src=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/08\/UI-Gen-Fig1-1.png\" sizes=\"(max-width: 3840px) 100vw, 3840px\" alt=\"\" width=\"3840\" height=\"2160\" \/><\/picture>\n\t\t\t\t<\/div>\n                \n                \t\t\t<\/div>\n\t\t<\/div>\n        \n        \r\n\t<\/div>\n<\/section>\n\n\n<section id=\"detail-main-block-66cc7fefc364a\" class=\"section section-detail\">\n<style>\r\n    @media only screen and (min-width: 768px) {\r\n        #detail-main-block-66cc7fefc364a{ padding-top:15px !important;padding-bottom:30px !important;}\r\n    }\r\n\r\n    @media only screen and (max-width: 767px) {\r\n        #detail-main-block-66cc7fefc364a{ padding-top:15px !important;padding-bottom:30px !important;}\r\n    }\r\n<\/style>\n\t<div class=\"container\">\n        \n\t\t<div>\n\t\t\t<div class=\"detail-info__content\">\n                \n                \n\t\t\t\t\n\t\t\t\t<div class=\"detail-article__title\">\n                                        <h3 class=\"title-4\">Generierung von Ansichten<\/h3>\n                    \n                    \t\t\t\t<\/div>\n\n                \t\t\t\t<div class=\"text-block\">\n                    <p>Aus den Layout-Definitionen k\u00f6nnen unterschiedliche Ansichten (Views) dynamisch generiert werden. Die Grundstruktur einer View, z.B. eines Formulars, ist explizit implementiert. Der Inhalt \u2013 also die Art der Aktion, die Felder und die Entit\u00e4tstypen \u2013 wird hingegen dynamisch anhand des Kontexts ermittelt und aus den Layout-Definitionen konfiguriert. Beispielsweise erh\u00e4lt die Formular-View die Anweisung, &#8222;eine Person zu erstellen&#8220;, und generiert automatisch die daf\u00fcr notwendigen Felder inklusive Validierungsregeln und Gesch\u00e4ftslogik, um eine fertige Anfrage ans Backend senden zu k\u00f6nnen.<\/p>\n\t\t\t\t<\/div>\n                \n                \t\t\t<\/div>\n\t\t<\/div>\n        \n        \r\n\t<\/div>\n<\/section>\n\n\n<section id=\"detail-main-block-66cc7fefc370c\" class=\"section section-detail\">\n<style>\r\n    @media only screen and (min-width: 768px) {\r\n        #detail-main-block-66cc7fefc370c{ padding-top:0px !important;padding-bottom:15px !important;}\r\n    }\r\n\r\n    @media only screen and (max-width: 767px) {\r\n        #detail-main-block-66cc7fefc370c{ padding-top:0px !important;padding-bottom:15px !important;}\r\n    }\r\n<\/style>\n\t<div class=\"container\">\n        \n\t\t<div>\n\t\t\t<div class=\"detail-info__content\">\n                \n                \n\t\t\t\t\n\t\t\t\t<div class=\"detail-article__title\">\n                                        <h3 class=\"title-4\">Ereignisbasierter Ansatz<\/h3>\n                    \n                    \t\t\t\t<\/div>\n\n                \t\t\t\t<div class=\"text-block\">\n                    <p>Die einzelnen Views und deren Komponenten beziehen ihre Informationen nicht nur aus den Layout-Definitionen, sondern m\u00fcssen auch den aktuellen Datenstand ber\u00fccksichtigen. In einem dynamischen System m\u00fcssen Komponenten auf Ereignisse, wie z.B. die \u00c4nderung eines Feldwerts, reagieren und diese \u00c4nderungen in Echtzeit darstellen. Dies wird durch einen Mix aus Model\u2013view\u2013controller Pattern (MVC) und einer virtuellen Datenbank im Frontend umgesetzt. Diese virtuelle Datenbank fungiert als Model im Sinne des MVC-Prinzips und synchronisiert \u00c4nderungen und generiert entsprechende Ereignisse. Das Model entspricht hierbei auch einem Cache f\u00fcr Abfragen ans Backend.<\/p>\n\t\t\t\t<\/div>\n                \n                \t\t\t<\/div>\n\t\t<\/div>\n        \n        \r\n\t<\/div>\n<\/section>\n\n\n<section id=\"detail-main-block-66cc7fefc37f0\" class=\"section section-detail\">\n<style>\r\n    @media only screen and (min-width: 768px) {\r\n        #detail-main-block-66cc7fefc37f0{ padding-top:0px !important;padding-bottom:15px !important;}\r\n    }\r\n\r\n    @media only screen and (max-width: 767px) {\r\n        #detail-main-block-66cc7fefc37f0{ padding-top:0px !important;padding-bottom:15px !important;}\r\n    }\r\n<\/style>\n\t<div class=\"container\">\n        \n\t\t<div>\n\t\t\t<div class=\"detail-info__content\">\n                \n                \n\t\t\t\t\n\t\t\t\t<div class=\"detail-article__title\">\n                                        <h3 class=\"title-4\">Model Messages<\/h3>\n                    \n                    \t\t\t\t<\/div>\n\n                \t\t\t\t<div class=\"text-block\">\n                    <p>Der standardisierte Austausch von \u00c4nderungen (Create, Update, Delete) an Daten erfolgt \u00fcber sogenannte Model Messages. Diese werden sowohl zwischen den Systemeinheiten (Services) als auch mit dem Frontend ausgetauscht. Model Messages zeigen nicht nur \u00c4nderungen an Entit\u00e4ten an, sondern auch \u00c4nderungen an Beziehungen zwischen Entit\u00e4ten oder Daten, die zwischen Entit\u00e4ten geteilt werden. Dieses semantische Wissen, zusammen mit den Layout-Definitionen, erm\u00f6glicht die Dynamik des Frontends und tr\u00e4gt zur Entkopplung vom Backend bei.<\/p>\n\t\t\t\t<\/div>\n                \n                \t\t\t<\/div>\n\t\t<\/div>\n        \n        \r\n\t<\/div>\n<\/section>\n\n\n<section id=\"detail-main-block-66cc7fefc38af\" class=\"section section-detail\">\n<style>\r\n    @media only screen and (min-width: 768px) {\r\n        #detail-main-block-66cc7fefc38af{ padding-top:0px !important;padding-bottom:15px !important;}\r\n    }\r\n\r\n    @media only screen and (max-width: 767px) {\r\n        #detail-main-block-66cc7fefc38af{ padding-top:0px !important;padding-bottom:15px !important;}\r\n    }\r\n<\/style>\n\t<div class=\"container\">\n        \n\t\t<div>\n\t\t\t<div class=\"detail-info__content\">\n                \n                \n\t\t\t\t\n\t\t\t\t<div class=\"detail-article__title\">\n                                        <h3 class=\"title-4\">Model Service<\/h3>\n                    \n                    \t\t\t\t<\/div>\n\n                \t\t\t\t<div class=\"text-block\">\n                    <p>Aufgrund des verteilten Charakters der Applikation, bei der verschiedene Services unterschiedliche Daten verwalten, ist es einem einzelnen Service nicht m\u00f6glich, eine vollst\u00e4ndige Abfrage \u00fcber alle Daten durchzuf\u00fchren. Damit das Frontend dennoch effizient Daten von mehreren Services in einer einzigen Abfrage erhalten kann, wurde ein Model Service entwickelt. Dieser verarbeitet die Model Messages und erstellt eine aggregierte Sicht auf die Daten aller Services. Damit fungiert der Model Service als Vorstufe eines Data-Warehouses und erm\u00f6glicht umfassende &#8211; auch Graph basierte &#8211; Abfragen auf diese hierarchische Datenstruktur.<\/p>\n<picture><img decoding=\"async\" class=\"attachment-full size-full\" src=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/08\/UI-Gen-Fig1-1-1.png\" sizes=\"(max-width: 3840px) 100vw, 3840px\" alt=\"\" width=\"3840\" height=\"2160\" \/><\/picture>\n\t\t\t\t<\/div>\n                \n                \t\t\t<\/div>\n\t\t<\/div>\n        \n        \r\n\t<\/div>\n<\/section>\n\n\n<section id=\"detail-main-block-66cc7fefc396f\" class=\"section section-detail\">\n<style>\r\n    @media only screen and (min-width: 768px) {\r\n        #detail-main-block-66cc7fefc396f{ padding-top:15px !important;padding-bottom:30px !important;}\r\n    }\r\n\r\n    @media only screen and (max-width: 767px) {\r\n        #detail-main-block-66cc7fefc396f{ padding-top:15px !important;padding-bottom:30px !important;}\r\n    }\r\n<\/style>\n\t<div class=\"container\">\n        \n\t\t<div>\n\t\t\t<div class=\"detail-info__content\">\n                \n                \n\t\t\t\t\n\t\t\t\t<div class=\"detail-article__title\">\n                                        <h3 class=\"title-4\">Lokalisierung<\/h3>\n                    \n                    \t\t\t\t<\/div>\n\n                \t\t\t\t<div class=\"text-block\">\n                    <p>Ein weiterer zentraler Bestandteil der Frontend-Engine ist die Lokalisierung, welche die \u00dcbersetzung und Formatierung der Inhalte umfasst.<\/p>\n<p>Da Apriko mehrsprachig ist, m\u00fcssen Texte und Daten in einer generischen, un\u00fcbersetzten Form vorliegen, respektive vom Backend bereitgestellt werden. Die tats\u00e4chliche \u00dcbersetzung erfolgt erst im letzten Schritt bei der Generierung der Oberfl\u00e4che.<\/p>\n\t\t\t\t<\/div>\n                \n                \t\t\t<\/div>\n\t\t<\/div>\n        \n        \r\n\t<\/div>\n<\/section>\n\n\n<section id=\"detail-main-block-66cc7fefc3a2c\" class=\"section section-detail\">\n<style>\r\n    @media only screen and (min-width: 768px) {\r\n        #detail-main-block-66cc7fefc3a2c{ padding-top:0px !important;padding-bottom:15px !important;}\r\n    }\r\n\r\n    @media only screen and (max-width: 767px) {\r\n        #detail-main-block-66cc7fefc3a2c{ padding-top:0px !important;padding-bottom:15px !important;}\r\n    }\r\n<\/style>\n\t<div class=\"container\">\n        \n\t\t<div>\n\t\t\t<div class=\"detail-info__content\">\n                \n                \n\t\t\t\t\n\t\t\t\t<div class=\"detail-article__title\">\n                                        <h3 class=\"title-4\">Fazit<\/h3>\n                    \n                    \t\t\t\t<\/div>\n\n                \t\t\t\t<div class=\"text-block\">\n                    <p>Die Entkopplung von Backend und Frontend sowie der deklarative Ansatz in der Backend-Entwicklung erm\u00f6glichen eine bessere Fokussierung auf die Implementierung der Gesch\u00e4ftslogik. Gleichzeitig wird die Entstehung von unn\u00f6tigem Boilerplate-Code sowie dessen Erosion minimiert und die Konsistenz durch alle Schichten der Software-Architektur erh\u00f6ht.<\/p>\n\t\t\t\t<\/div>\n                \n                \t\t\t<\/div>\n\t\t<\/div>\n        \n        \r\n\t<\/div>\n<\/section>\n\n\n<section id=\"contact-66cc7fefc3dfb\" class=\"section\">\n<style>\r\n    @media only screen and (min-width: 768px) {\r\n        #contact-66cc7fefc3dfb{ padding-top:70px !important;padding-bottom:px !important;}\r\n    }\r\n\r\n    @media only screen and (max-width: 767px) {\r\n        #contact-66cc7fefc3dfb{ padding-top:70px !important;padding-bottom:px !important;}\r\n    }\r\n<\/style>\n\t<div class=\"container\">\n                \n\t\t<div class=\"contact-block\">\n\t\t\t<div class=\"contact-block__cont contact-info\">\n                \t\t\t\t<h3 class=\"contact-info__title\">Haben wir dein Interesse geweckt? Wir freuen uns auf deine Nachricht!<\/h3>\n                                \t\t\t\t<div class=\"contact-info__name\">Seth Zollinger<\/div>\n                                \t\t\t\t<div class=\"contact-info__sub-title\">Software Architect<\/div>\n                \n\t\t\t\t<div class=\"contact-info__links\">\n                    \t\t\t\t\t<a href=\"mailto:seth&#064;aprik&#111;&#046;c&#111;m\">seth&#64;aprik&#111;&#46;c&#111;m<\/a>\n                                        \t\t\t\t<\/div>\n\n                \t\t\t<\/div>\n\n\t\t\t<div class=\"contact-block__media\">\n                \n<div  class=\"contact-block__img\">\n\n<picture>\n    <img decoding=\"async\" width=\"1500\" height=\"1222\" src=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/04\/Seth-Zollinger-Contact.jpg\" class=\"attachment-full size-full\" alt=\"Seth Zollinger\" srcset=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/04\/Seth-Zollinger-Contact.jpg 1500w, https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/04\/Seth-Zollinger-Contact-768x626.jpg 768w\" sizes=\"(max-width: 1500px) 100vw, 1500px\" \/><\/picture>\n\n\n\n<\/div>\n\n\t\t\t\t<div class=\"contact-block__decore\">\n\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/themes\/general\/frontend\/assets\/img\/contacts-decore.svg\" alt=\"\">\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\t<\/div>\n<\/section>\n\n\n<section id=\"card-slider-66cc7fefc4322\" class=\"section section-full\">\n<style>\r\n    @media only screen and (min-width: 768px) {\r\n        #card-slider-66cc7fefc4322{ padding-top:100px !important;padding-bottom:100px !important;}\r\n    }\r\n\r\n    @media only screen and (max-width: 767px) {\r\n        #card-slider-66cc7fefc4322{ padding-top:px !important;padding-bottom:px !important;}\r\n    }\r\n<\/style>\n\t<div class=\"container\">\n\t\t\t\t\n\t\t<div class=\"cards-slider js-cards-slider\">\n\t\t\t<div class=\"cards-slider-head\">\n\t\t\t\t<div class=\"cards-slider-head__body\">\n                    \n                                        <h2 class=\"title-3\">Mehr gute Gr\u00fcnde f\u00fcr Apriko<\/h2>\n                    \t\t\t\t<\/div>\n\t\t\t\t<div class=\"arrows cards-slider-arrows\">\n\t\t\t\t\t<button type=\"button\" class=\"arrow-btn arrow-btn-prev\">\n\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/themes\/general\/frontend\/assets\/img\/arrow-left.svg\" alt=\"\">\n\t\t\t\t\t<\/button>\n\t\t\t\t\t<button type=\"button\" class=\"arrow-btn arrow-btn-next\">\n\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/themes\/general\/frontend\/assets\/img\/arrow-right.svg\" alt=\"\">\n\t\t\t\t\t<\/button>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\n            \t\t\t<div class=\"swiper\">\n\t\t\t\t<div class=\"swiper-wrapper\">\n                                    <div class=\"swiper-slide\">\n\t\t\t\t\t\t\t\t\t\t\n<div class=\"card-container \">\n    <div class=\"card card-glossar\">\n        <div class=\"card__top\">\n            \n                            \n<div  class=\"card__media\">\n\n<picture>\n    <img decoding=\"async\" width=\"3840\" height=\"2160\" src=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/08\/backend-code-gen-main-image.png\" class=\"attachment-full size-full\" alt=\"\" srcset=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/08\/backend-code-gen-main-image.png 3840w, https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/08\/backend-code-gen-main-image-768x432.png 768w, https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/08\/backend-code-gen-main-image-1536x864.png 1536w, https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/08\/backend-code-gen-main-image-2048x1152.png 2048w\" sizes=\"(max-width: 3840px) 100vw, 3840px\" \/><\/picture>\n\n\n\n<\/div>\n                    <\/div>\n        <div class=\"card__body\">\n            <div class=\"card__head\">\n                <div class=\"card__head-left\">\n                                            <div class=\"card__category\">Engineering<\/div>\n                    \n                                        <h3 class=\"card__title\">Schneller und besser zum Ziel: Mit automatisierter Codegenerierung<\/h3>\n                                    <\/div>\n                                    \r\n<div  class=\"icon icon-35\">\r\n    <img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/08\/Engineering-1.svg\" class=\"attachment-35x35 size-35x35\" alt=\"\" \/><\/div>                            <\/div>\n\n            <div class=\"card__ligt-text\">16. April 2024<\/div>\n\n            <div class=\"card__text\">\n                <p>In der modernen Softwareentwicklung, insbesondere in Microservices-Architekturen, ist die Komplexit\u00e4t hoch. Aber was tun, damit bei einfachen und repetitiven Aufgaben keine Fehler entstehen?<\/p>\n            <\/div>\n\n            <div class=\"card__footer\">\n                <div class=\"card__action\">\n                    <button type=\"button\" class=\"action-btn js-card-flip\">\n                        <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"13\" height=\"15\" viewBox=\"0 0 13 15\" fill=\"none\">\r\n    <path d=\"M10.8333 15C10.2315 15 9.71991 14.7813 9.29861 14.3438C8.87732 13.9063 8.66667 13.375 8.66667 12.75C8.66667 12.6625 8.67269 12.5719 8.68472 12.4781C8.69676 12.3844 8.71482 12.3 8.73889 12.225L3.64722 9.15C3.44259 9.3375 3.21389 9.48438 2.96111 9.59063C2.70833 9.69688 2.44352 9.75 2.16667 9.75C1.56481 9.75 1.05324 9.53125 0.631944 9.09375C0.210648 8.65625 0 8.125 0 7.5C0 6.875 0.210648 6.34375 0.631944 5.90625C1.05324 5.46875 1.56481 5.25 2.16667 5.25C2.44352 5.25 2.70833 5.30313 2.96111 5.40938C3.21389 5.51562 3.44259 5.6625 3.64722 5.85L8.73889 2.775C8.71482 2.7 8.69676 2.61563 8.68472 2.52188C8.67269 2.42813 8.66667 2.3375 8.66667 2.25C8.66667 1.625 8.87732 1.09375 9.29861 0.65625C9.71991 0.21875 10.2315 0 10.8333 0C11.4352 0 11.9468 0.21875 12.3681 0.65625C12.7894 1.09375 13 1.625 13 2.25C13 2.875 12.7894 3.40625 12.3681 3.84375C11.9468 4.28125 11.4352 4.5 10.8333 4.5C10.5565 4.5 10.2917 4.44688 10.0389 4.34063C9.78611 4.23438 9.55741 4.0875 9.35278 3.9L4.26111 6.975C4.28519 7.05 4.30324 7.13438 4.31528 7.22813C4.32731 7.32188 4.33333 7.4125 4.33333 7.5C4.33333 7.5875 4.32731 7.67813 4.31528 7.77188C4.30324 7.86563 4.28519 7.95 4.26111 8.025L9.35278 11.1C9.55741 10.9125 9.78611 10.7656 10.0389 10.6594C10.2917 10.5531 10.5565 10.5 10.8333 10.5C11.4352 10.5 11.9468 10.7188 12.3681 11.1562C12.7894 11.5938 13 12.125 13 12.75C13 13.375 12.7894 13.9063 12.3681 14.3438C11.9468 14.7813 11.4352 15 10.8333 15Z\" fill=\"none\"\/>\r\n<\/svg>                    <\/button>\n                                        <button type=\"button\" class=\"action-btn bookmark\" data-id=\"12435\">\n                        <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"13\" height=\"17\" viewBox=\"0 0 13 17\" fill=\"none\">\r\n    <path d=\"M0.5 17V1.88889C0.5 1.36944 0.667857 0.924769 1.00357 0.554861C1.33929 0.184954 1.74286 0 2.21429 0H10.7857C11.2571 0 11.6607 0.184954 11.9964 0.554861C12.3321 0.924769 12.5 1.36944 12.5 1.88889V17L6.5 13.4111L0.5 17ZM2.21429 14.1194L6.5 11.3333L10.7857 14.1194V1.88889H2.21429V14.1194Z\" fill=\"none\"\/>\r\n<\/svg>                    <\/button>\n                                    <\/div>\n                <a href=\"https:\/\/apriko.com\/de\/blog\/codegenerierung\/\" class=\"link-text\">Mehr erfahren<\/a>\n            <\/div>\n        <\/div>\n    <\/div>\n\n            \n<div class=\"card-back card-back--blue share-data\" data-id=\"12435\" data-url=\"https:\/\/apriko.com\/de\/blog\/codegenerierung\/\" >\n            <h3 class=\"card-back__title\">Artikel teilen<\/h3>\n    \n    <div class=\"share-container\">\n        <ul class=\"share-nav share-step active\">\n            <li>\n                <a href=\"#\" class=\"js-share-copy\">\n                                        <div class=\"icon icon-35\">\n                        <img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/06\/url-3.svg\" class=\"attachment-35x35 size-35x35\" alt=\"\" \/>                    <\/div>\n                                        Link kopieren                <\/a>\n            <\/li>\n            <li>\n                <a href=\"#\" class=\"js-share-next\" data-share=\"email\">\n                                        <div class=\"icon icon-35\">\n                        <img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/06\/mail-2.svg\" class=\"attachment-35x35 size-35x35\" alt=\"\" \/>                    <\/div>\n                                        Per E-Mail senden                <\/a>\n            <\/li>\n            <li>\n                <a class=\"js-share-linkedin\" href=\"#\" target=\"_blank\">\n                                        <div class=\"icon icon-35\">\n                        <img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/06\/logo-linkedin-2.svg\" class=\"attachment-35x35 size-35x35\" alt=\"\" \/>                    <\/div>\n                                        Auf LinkedIn teilen                <\/a>\n            <\/li>\n        <\/ul>\n\n        <div class=\"share-step share-step-email\" data-share-target=\"email\">\n            <form class=\"share-email\">\n                                <h3 class=\"title-sm\">Per E-Mail senden<\/h3>\n                                <div class=\"form-control\">\n                    <input type=\"email\" name=\"email\" class=\"form-control-input\" placeholder=\"E-Mail\">\n                <\/div>\n                <span class=\"valid-message\" style=\"display: none;\">Pflichtfeld<\/span>\n                <span class=\"valid-message invalid-email\" style=\"display: none;\">Bitte korrekte E-Mail angeben<\/span>\n                <div class=\"share-email__bottom\">\n                    <div>\n                        <label class=\"agree\">\n                            <input type=\"checkbox\" class=\"agree__input\">\n                            <span class=\"agree__box\">\n                                Ich akzeptiere die Datenschutzvereinbarung und AGB.                            <\/span>\n                        <\/label>\n                        <span class=\"valid-message\" style=\"display: none;\">Pflichtfeld<\/span>\n                    <\/div>\n                    <div>\n                        <button type=\"button\" class=\"btn btn-secondary js-share-email\"  data-share=\"subscribe\">Senden<\/button>\n                    <\/div>\n                    <span class=\"invalid-message\" style=\"display: none;\">Etwas ist schief gelaufen, versuche es erneut<\/span>\n                <\/div>\n            <\/form>\n        <\/div>\n\n        <div class=\"share-step share-step-subscribe\" data-share-target=\"subscribe\">\n                            <div class=\"share-modal__text\"><p>Der Artikel wurde erfolgreich versendet. M\u00f6chtest du in Zukunft keine Apriko-Inhalte verpassen? Dann melde dich f\u00fcr unseren Newsletter an. <\/p>\n<\/div>\n                                        <h3 class=\"title-sm\">Jetzt zum Newsletter anmelden<\/h3>\n            \n            <form class=\"subscribe\">\n    <div class=\"subscribe-step active\">\n        <div class=\"form-control form-control-w-btn\">\n            <button tupe=\"button\" class=\"form-control-submit apply-btn js-subscribe-step\">\n                <img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/themes\/general\/frontend\/assets\/img\/arrow-right.svg\" alt=\"applay\">\n            <\/button>\n            <input type=\"email\" name=\"email\" class=\"form-control-input required\" placeholder=\"e-mail\">\n        <\/div>\n        <label class=\"agree form-control\">\n            <input type=\"checkbox\" name=\"agree\" class=\"agree__input required\">\n            <span class=\"agree__box\">\n                Ich akzeptiere die Datenschutzbestimmungen.            <\/span>\n        <\/label>\n        <div class=\"step-errors\">\n            <span class=\"valid-message general\" style=\"display: none;\">Pflichtfeld<\/span>\n            <span class=\"valid-message invalid-email\" style=\"display: none;\">Bitte korrekte E-Mail angeben<\/span>\n        <\/div>\n    <\/div>\n\n    <div class=\"subscribe-step\">\n        <div class=\"form-control\">\n            <select class=\"js-select select\" name=\"gender\">\n                <option value=\"0\">Anrede<\/option>\n                <option value=\"Female\">Frau<\/option>\n                <option value=\"Male\">Herr<\/option>\n                <option value=\"Other\">Keine<\/option>\n            <\/select>\n        <\/div>\n        <span class=\"valid-message\" style=\"display: none;\">Pflichtfeld<\/span>\n        <div class=\"form-control\">\n            <input type=\"text\" name=\"name\" class=\"form-control-input\" placeholder=\"First name\">\n        <\/div>\n        <span class=\"valid-message\" style=\"display: none;\">Pflichtfeld<\/span>\n        <div class=\"form-control form-control-w-btn\">\n            <button tupe=\"button\" class=\"form-control-submit apply-btn js-subscribe-step form-mailchimp-subscribe\">\n                <img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/themes\/general\/frontend\/assets\/img\/arrow-right.svg\" alt=\"applay\">\n            <\/button>\n            <input type=\"text\" name=\"surname\" class=\"form-control-input\" placeholder=\"Last Name\">\n        <\/div>\n        <span class=\"valid-message\" style=\"display: none;\">Pflichtfeld<\/span>\n        <span class=\"invalid-message all\" style=\"display: none;\">Etwas ist schief gelaufen, versuche es erneut<\/span>\n        <span class=\"invalid-message pending\" style=\"display: none;\">Wir haben die Best\u00e4tigungs-E-Mail bereits verschickt &#8211; bitte best\u00e4tige deine Anmeldung<\/span>\n        <span class=\"invalid-message registered\" style=\"display: none;\">E-Mail ist bereits registriert, danke<\/span>\n    <\/div>\n\n    <div class=\"subscribe-step\">\n            <div class=\"subscribe__text\">\n            <h4>Herzlichen Dank<\/h4>\n<p>\u00dcberpr\u00fcfe dein E-Mail-Postfach und klicke auf den Best\u00e4tigungslink, den wir dir geschickt haben, um deine Anmeldung abzuschliessen.<\/p>\n        <\/div>\n        <\/div>\n<\/form>        <\/div>\n    <\/div>\n\n    <div class=\"card-back__bottom\">\n        <button class=\"btn btn-outline-w js-card-flip-back\">Schliessen<\/button>\n    <\/div>\n<\/div>    \n    \n    <\/div>\t\t\t\t\t                    <\/div>\n\t\t\t\t                    <div class=\"swiper-slide\">\n\t\t\t\t\t\t\t\t\t\t\n<div class=\"card-container \">\n    <div class=\"card \">\n        <div class=\"card__top\">\n            \n                            \n<div  class=\"card__media\">\n\n<picture>\n    <img decoding=\"async\" width=\"3840\" height=\"2160\" src=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/04\/software-artchitecture-main-image.png\" class=\"attachment-full size-full\" alt=\"\" srcset=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/04\/software-artchitecture-main-image.png 3840w, https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/04\/software-artchitecture-main-image-768x432.png 768w, https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/04\/software-artchitecture-main-image-1536x864.png 1536w, https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/04\/software-artchitecture-main-image-2048x1152.png 2048w\" sizes=\"(max-width: 3840px) 100vw, 3840px\" \/><\/picture>\n\n\n\n<\/div>\n                    <\/div>\n        <div class=\"card__body\">\n            <div class=\"card__head\">\n                <div class=\"card__head-left\">\n                                            <div class=\"card__category\">Engineering<\/div>\n                    \n                                        <h3 class=\"card__title\">Plattform f\u00fcr moderne Enterprise-Anwendungen<\/h3>\n                                    <\/div>\n                                    \r\n<div  class=\"icon icon-35\">\r\n    <img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/08\/Engineering-1.svg\" class=\"attachment-35x35 size-35x35\" alt=\"\" \/><\/div>                            <\/div>\n\n            <div class=\"card__ligt-text\">5. April 2024<\/div>\n\n            <div class=\"card__text\">\n                <p>Apriko wurde als Microservice-Applikation entwickelt, um den steigenden Anforderungen an moderne Enterprise-Anwendungen gerecht zu werden.<\/p>\n            <\/div>\n\n            <div class=\"card__footer\">\n                <div class=\"card__action\">\n                    <button type=\"button\" class=\"action-btn js-card-flip\">\n                        <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"13\" height=\"15\" viewBox=\"0 0 13 15\" fill=\"none\">\r\n    <path d=\"M10.8333 15C10.2315 15 9.71991 14.7813 9.29861 14.3438C8.87732 13.9063 8.66667 13.375 8.66667 12.75C8.66667 12.6625 8.67269 12.5719 8.68472 12.4781C8.69676 12.3844 8.71482 12.3 8.73889 12.225L3.64722 9.15C3.44259 9.3375 3.21389 9.48438 2.96111 9.59063C2.70833 9.69688 2.44352 9.75 2.16667 9.75C1.56481 9.75 1.05324 9.53125 0.631944 9.09375C0.210648 8.65625 0 8.125 0 7.5C0 6.875 0.210648 6.34375 0.631944 5.90625C1.05324 5.46875 1.56481 5.25 2.16667 5.25C2.44352 5.25 2.70833 5.30313 2.96111 5.40938C3.21389 5.51562 3.44259 5.6625 3.64722 5.85L8.73889 2.775C8.71482 2.7 8.69676 2.61563 8.68472 2.52188C8.67269 2.42813 8.66667 2.3375 8.66667 2.25C8.66667 1.625 8.87732 1.09375 9.29861 0.65625C9.71991 0.21875 10.2315 0 10.8333 0C11.4352 0 11.9468 0.21875 12.3681 0.65625C12.7894 1.09375 13 1.625 13 2.25C13 2.875 12.7894 3.40625 12.3681 3.84375C11.9468 4.28125 11.4352 4.5 10.8333 4.5C10.5565 4.5 10.2917 4.44688 10.0389 4.34063C9.78611 4.23438 9.55741 4.0875 9.35278 3.9L4.26111 6.975C4.28519 7.05 4.30324 7.13438 4.31528 7.22813C4.32731 7.32188 4.33333 7.4125 4.33333 7.5C4.33333 7.5875 4.32731 7.67813 4.31528 7.77188C4.30324 7.86563 4.28519 7.95 4.26111 8.025L9.35278 11.1C9.55741 10.9125 9.78611 10.7656 10.0389 10.6594C10.2917 10.5531 10.5565 10.5 10.8333 10.5C11.4352 10.5 11.9468 10.7188 12.3681 11.1562C12.7894 11.5938 13 12.125 13 12.75C13 13.375 12.7894 13.9063 12.3681 14.3438C11.9468 14.7813 11.4352 15 10.8333 15Z\" fill=\"none\"\/>\r\n<\/svg>                    <\/button>\n                                        <button type=\"button\" class=\"action-btn bookmark\" data-id=\"12353\">\n                        <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"13\" height=\"17\" viewBox=\"0 0 13 17\" fill=\"none\">\r\n    <path d=\"M0.5 17V1.88889C0.5 1.36944 0.667857 0.924769 1.00357 0.554861C1.33929 0.184954 1.74286 0 2.21429 0H10.7857C11.2571 0 11.6607 0.184954 11.9964 0.554861C12.3321 0.924769 12.5 1.36944 12.5 1.88889V17L6.5 13.4111L0.5 17ZM2.21429 14.1194L6.5 11.3333L10.7857 14.1194V1.88889H2.21429V14.1194Z\" fill=\"none\"\/>\r\n<\/svg>                    <\/button>\n                                    <\/div>\n                <a href=\"https:\/\/apriko.com\/de\/blog\/plattform-fuer-moderne-enterprise-anwendungen\/\" class=\"link-text\">Mehr erfahren<\/a>\n            <\/div>\n        <\/div>\n    <\/div>\n\n            \n<div class=\"card-back card-back--blue share-data\" data-id=\"12353\" data-url=\"https:\/\/apriko.com\/de\/blog\/plattform-fuer-moderne-enterprise-anwendungen\/\" >\n            <h3 class=\"card-back__title\">Artikel teilen<\/h3>\n    \n    <div class=\"share-container\">\n        <ul class=\"share-nav share-step active\">\n            <li>\n                <a href=\"#\" class=\"js-share-copy\">\n                                        <div class=\"icon icon-35\">\n                        <img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/06\/url-3.svg\" class=\"attachment-35x35 size-35x35\" alt=\"\" \/>                    <\/div>\n                                        Link kopieren                <\/a>\n            <\/li>\n            <li>\n                <a href=\"#\" class=\"js-share-next\" data-share=\"email\">\n                                        <div class=\"icon icon-35\">\n                        <img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/06\/mail-2.svg\" class=\"attachment-35x35 size-35x35\" alt=\"\" \/>                    <\/div>\n                                        Per E-Mail senden                <\/a>\n            <\/li>\n            <li>\n                <a class=\"js-share-linkedin\" href=\"#\" target=\"_blank\">\n                                        <div class=\"icon icon-35\">\n                        <img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/06\/logo-linkedin-2.svg\" class=\"attachment-35x35 size-35x35\" alt=\"\" \/>                    <\/div>\n                                        Auf LinkedIn teilen                <\/a>\n            <\/li>\n        <\/ul>\n\n        <div class=\"share-step share-step-email\" data-share-target=\"email\">\n            <form class=\"share-email\">\n                                <h3 class=\"title-sm\">Per E-Mail senden<\/h3>\n                                <div class=\"form-control\">\n                    <input type=\"email\" name=\"email\" class=\"form-control-input\" placeholder=\"E-Mail\">\n                <\/div>\n                <span class=\"valid-message\" style=\"display: none;\">Pflichtfeld<\/span>\n                <span class=\"valid-message invalid-email\" style=\"display: none;\">Bitte korrekte E-Mail angeben<\/span>\n                <div class=\"share-email__bottom\">\n                    <div>\n                        <label class=\"agree\">\n                            <input type=\"checkbox\" class=\"agree__input\">\n                            <span class=\"agree__box\">\n                                Ich akzeptiere die Datenschutzvereinbarung und AGB.                            <\/span>\n                        <\/label>\n                        <span class=\"valid-message\" style=\"display: none;\">Pflichtfeld<\/span>\n                    <\/div>\n                    <div>\n                        <button type=\"button\" class=\"btn btn-secondary js-share-email\"  data-share=\"subscribe\">Senden<\/button>\n                    <\/div>\n                    <span class=\"invalid-message\" style=\"display: none;\">Etwas ist schief gelaufen, versuche es erneut<\/span>\n                <\/div>\n            <\/form>\n        <\/div>\n\n        <div class=\"share-step share-step-subscribe\" data-share-target=\"subscribe\">\n                            <div class=\"share-modal__text\"><p>Der Artikel wurde erfolgreich versendet. M\u00f6chtest du in Zukunft keine Apriko-Inhalte verpassen? Dann melde dich f\u00fcr unseren Newsletter an. <\/p>\n<\/div>\n                                        <h3 class=\"title-sm\">Jetzt zum Newsletter anmelden<\/h3>\n            \n            <form class=\"subscribe\">\n    <div class=\"subscribe-step active\">\n        <div class=\"form-control form-control-w-btn\">\n            <button tupe=\"button\" class=\"form-control-submit apply-btn js-subscribe-step\">\n                <img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/themes\/general\/frontend\/assets\/img\/arrow-right.svg\" alt=\"applay\">\n            <\/button>\n            <input type=\"email\" name=\"email\" class=\"form-control-input required\" placeholder=\"e-mail\">\n        <\/div>\n        <label class=\"agree form-control\">\n            <input type=\"checkbox\" name=\"agree\" class=\"agree__input required\">\n            <span class=\"agree__box\">\n                Ich akzeptiere die Datenschutzbestimmungen.            <\/span>\n        <\/label>\n        <div class=\"step-errors\">\n            <span class=\"valid-message general\" style=\"display: none;\">Pflichtfeld<\/span>\n            <span class=\"valid-message invalid-email\" style=\"display: none;\">Bitte korrekte E-Mail angeben<\/span>\n        <\/div>\n    <\/div>\n\n    <div class=\"subscribe-step\">\n        <div class=\"form-control\">\n            <select class=\"js-select select\" name=\"gender\">\n                <option value=\"0\">Anrede<\/option>\n                <option value=\"Female\">Frau<\/option>\n                <option value=\"Male\">Herr<\/option>\n                <option value=\"Other\">Keine<\/option>\n            <\/select>\n        <\/div>\n        <span class=\"valid-message\" style=\"display: none;\">Pflichtfeld<\/span>\n        <div class=\"form-control\">\n            <input type=\"text\" name=\"name\" class=\"form-control-input\" placeholder=\"First name\">\n        <\/div>\n        <span class=\"valid-message\" style=\"display: none;\">Pflichtfeld<\/span>\n        <div class=\"form-control form-control-w-btn\">\n            <button tupe=\"button\" class=\"form-control-submit apply-btn js-subscribe-step form-mailchimp-subscribe\">\n                <img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/themes\/general\/frontend\/assets\/img\/arrow-right.svg\" alt=\"applay\">\n            <\/button>\n            <input type=\"text\" name=\"surname\" class=\"form-control-input\" placeholder=\"Last Name\">\n        <\/div>\n        <span class=\"valid-message\" style=\"display: none;\">Pflichtfeld<\/span>\n        <span class=\"invalid-message all\" style=\"display: none;\">Etwas ist schief gelaufen, versuche es erneut<\/span>\n        <span class=\"invalid-message pending\" style=\"display: none;\">Wir haben die Best\u00e4tigungs-E-Mail bereits verschickt &#8211; bitte best\u00e4tige deine Anmeldung<\/span>\n        <span class=\"invalid-message registered\" style=\"display: none;\">E-Mail ist bereits registriert, danke<\/span>\n    <\/div>\n\n    <div class=\"subscribe-step\">\n            <div class=\"subscribe__text\">\n            <h4>Herzlichen Dank<\/h4>\n<p>\u00dcberpr\u00fcfe dein E-Mail-Postfach und klicke auf den Best\u00e4tigungslink, den wir dir geschickt haben, um deine Anmeldung abzuschliessen.<\/p>\n        <\/div>\n        <\/div>\n<\/form>        <\/div>\n    <\/div>\n\n    <div class=\"card-back__bottom\">\n        <button class=\"btn btn-outline-w js-card-flip-back\">Schliessen<\/button>\n    <\/div>\n<\/div>    \n    \n    <\/div>\t\t\t\t\t                    <\/div>\n\t\t\t\t                    <div class=\"swiper-slide\">\n\t\t\t\t\t\t\t\t\t\t\n<div class=\"card-container \">\n    <div class=\"card \">\n        <div class=\"card__top\">\n            \n                            \n<div  class=\"card__media\">\n\n<picture>\n    <img decoding=\"async\" width=\"3840\" height=\"2160\" src=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/04\/bdd.png\" class=\"attachment-full size-full\" alt=\"\" srcset=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/04\/bdd.png 3840w, https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/04\/bdd-768x432.png 768w, https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/04\/bdd-1536x864.png 1536w, https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/04\/bdd-2048x1152.png 2048w\" sizes=\"(max-width: 3840px) 100vw, 3840px\" \/><\/picture>\n\n\n\n<\/div>\n                    <\/div>\n        <div class=\"card__body\">\n            <div class=\"card__head\">\n                <div class=\"card__head-left\">\n                                            <div class=\"card__category\">Engineering<\/div>\n                    \n                                        <h3 class=\"card__title\">Behavior Driven Development <\/h3>\n                                    <\/div>\n                                    \r\n<div  class=\"icon icon-35\">\r\n    <img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/08\/Engineering-1.svg\" class=\"attachment-35x35 size-35x35\" alt=\"\" \/><\/div>                            <\/div>\n\n            <div class=\"card__ligt-text\">15. April 2024<\/div>\n\n            <div class=\"card__text\">\n                <p>Bei Apriko streben wir nach einem hohen Automatisierungsgrad der Kundenprozesse, einer schnellen Markteinf\u00fchrung und einer kontinuierlichen Verbesserung unserer Software. Um dies in einer anspruchsvollen Dom\u00e4ne und komplexen Softwarearchitektur sicherzustellen, ist eine pr\u00e4zise Planung und konsequente Umsetzung von Anfang an unverzichtbar.<\/p>\n            <\/div>\n\n            <div class=\"card__footer\">\n                <div class=\"card__action\">\n                    <button type=\"button\" class=\"action-btn js-card-flip\">\n                        <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"13\" height=\"15\" viewBox=\"0 0 13 15\" fill=\"none\">\r\n    <path d=\"M10.8333 15C10.2315 15 9.71991 14.7813 9.29861 14.3438C8.87732 13.9063 8.66667 13.375 8.66667 12.75C8.66667 12.6625 8.67269 12.5719 8.68472 12.4781C8.69676 12.3844 8.71482 12.3 8.73889 12.225L3.64722 9.15C3.44259 9.3375 3.21389 9.48438 2.96111 9.59063C2.70833 9.69688 2.44352 9.75 2.16667 9.75C1.56481 9.75 1.05324 9.53125 0.631944 9.09375C0.210648 8.65625 0 8.125 0 7.5C0 6.875 0.210648 6.34375 0.631944 5.90625C1.05324 5.46875 1.56481 5.25 2.16667 5.25C2.44352 5.25 2.70833 5.30313 2.96111 5.40938C3.21389 5.51562 3.44259 5.6625 3.64722 5.85L8.73889 2.775C8.71482 2.7 8.69676 2.61563 8.68472 2.52188C8.67269 2.42813 8.66667 2.3375 8.66667 2.25C8.66667 1.625 8.87732 1.09375 9.29861 0.65625C9.71991 0.21875 10.2315 0 10.8333 0C11.4352 0 11.9468 0.21875 12.3681 0.65625C12.7894 1.09375 13 1.625 13 2.25C13 2.875 12.7894 3.40625 12.3681 3.84375C11.9468 4.28125 11.4352 4.5 10.8333 4.5C10.5565 4.5 10.2917 4.44688 10.0389 4.34063C9.78611 4.23438 9.55741 4.0875 9.35278 3.9L4.26111 6.975C4.28519 7.05 4.30324 7.13438 4.31528 7.22813C4.32731 7.32188 4.33333 7.4125 4.33333 7.5C4.33333 7.5875 4.32731 7.67813 4.31528 7.77188C4.30324 7.86563 4.28519 7.95 4.26111 8.025L9.35278 11.1C9.55741 10.9125 9.78611 10.7656 10.0389 10.6594C10.2917 10.5531 10.5565 10.5 10.8333 10.5C11.4352 10.5 11.9468 10.7188 12.3681 11.1562C12.7894 11.5938 13 12.125 13 12.75C13 13.375 12.7894 13.9063 12.3681 14.3438C11.9468 14.7813 11.4352 15 10.8333 15Z\" fill=\"none\"\/>\r\n<\/svg>                    <\/button>\n                                        <button type=\"button\" class=\"action-btn bookmark\" data-id=\"12515\">\n                        <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"13\" height=\"17\" viewBox=\"0 0 13 17\" fill=\"none\">\r\n    <path d=\"M0.5 17V1.88889C0.5 1.36944 0.667857 0.924769 1.00357 0.554861C1.33929 0.184954 1.74286 0 2.21429 0H10.7857C11.2571 0 11.6607 0.184954 11.9964 0.554861C12.3321 0.924769 12.5 1.36944 12.5 1.88889V17L6.5 13.4111L0.5 17ZM2.21429 14.1194L6.5 11.3333L10.7857 14.1194V1.88889H2.21429V14.1194Z\" fill=\"none\"\/>\r\n<\/svg>                    <\/button>\n                                    <\/div>\n                <a href=\"https:\/\/apriko.com\/de\/blog\/behavior-driven-development\/\" class=\"link-text\">Mehr erfahren<\/a>\n            <\/div>\n        <\/div>\n    <\/div>\n\n            \n<div class=\"card-back card-back--blue share-data\" data-id=\"12515\" data-url=\"https:\/\/apriko.com\/de\/blog\/behavior-driven-development\/\" >\n            <h3 class=\"card-back__title\">Artikel teilen<\/h3>\n    \n    <div class=\"share-container\">\n        <ul class=\"share-nav share-step active\">\n            <li>\n                <a href=\"#\" class=\"js-share-copy\">\n                                        <div class=\"icon icon-35\">\n                        <img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/06\/url-3.svg\" class=\"attachment-35x35 size-35x35\" alt=\"\" \/>                    <\/div>\n                                        Link kopieren                <\/a>\n            <\/li>\n            <li>\n                <a href=\"#\" class=\"js-share-next\" data-share=\"email\">\n                                        <div class=\"icon icon-35\">\n                        <img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/06\/mail-2.svg\" class=\"attachment-35x35 size-35x35\" alt=\"\" \/>                    <\/div>\n                                        Per E-Mail senden                <\/a>\n            <\/li>\n            <li>\n                <a class=\"js-share-linkedin\" href=\"#\" target=\"_blank\">\n                                        <div class=\"icon icon-35\">\n                        <img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/06\/logo-linkedin-2.svg\" class=\"attachment-35x35 size-35x35\" alt=\"\" \/>                    <\/div>\n                                        Auf LinkedIn teilen                <\/a>\n            <\/li>\n        <\/ul>\n\n        <div class=\"share-step share-step-email\" data-share-target=\"email\">\n            <form class=\"share-email\">\n                                <h3 class=\"title-sm\">Per E-Mail senden<\/h3>\n                                <div class=\"form-control\">\n                    <input type=\"email\" name=\"email\" class=\"form-control-input\" placeholder=\"E-Mail\">\n                <\/div>\n                <span class=\"valid-message\" style=\"display: none;\">Pflichtfeld<\/span>\n                <span class=\"valid-message invalid-email\" style=\"display: none;\">Bitte korrekte E-Mail angeben<\/span>\n                <div class=\"share-email__bottom\">\n                    <div>\n                        <label class=\"agree\">\n                            <input type=\"checkbox\" class=\"agree__input\">\n                            <span class=\"agree__box\">\n                                Ich akzeptiere die Datenschutzvereinbarung und AGB.                            <\/span>\n                        <\/label>\n                        <span class=\"valid-message\" style=\"display: none;\">Pflichtfeld<\/span>\n                    <\/div>\n                    <div>\n                        <button type=\"button\" class=\"btn btn-secondary js-share-email\"  data-share=\"subscribe\">Senden<\/button>\n                    <\/div>\n                    <span class=\"invalid-message\" style=\"display: none;\">Etwas ist schief gelaufen, versuche es erneut<\/span>\n                <\/div>\n            <\/form>\n        <\/div>\n\n        <div class=\"share-step share-step-subscribe\" data-share-target=\"subscribe\">\n                            <div class=\"share-modal__text\"><p>Der Artikel wurde erfolgreich versendet. M\u00f6chtest du in Zukunft keine Apriko-Inhalte verpassen? Dann melde dich f\u00fcr unseren Newsletter an. <\/p>\n<\/div>\n                                        <h3 class=\"title-sm\">Jetzt zum Newsletter anmelden<\/h3>\n            \n            <form class=\"subscribe\">\n    <div class=\"subscribe-step active\">\n        <div class=\"form-control form-control-w-btn\">\n            <button tupe=\"button\" class=\"form-control-submit apply-btn js-subscribe-step\">\n                <img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/themes\/general\/frontend\/assets\/img\/arrow-right.svg\" alt=\"applay\">\n            <\/button>\n            <input type=\"email\" name=\"email\" class=\"form-control-input required\" placeholder=\"e-mail\">\n        <\/div>\n        <label class=\"agree form-control\">\n            <input type=\"checkbox\" name=\"agree\" class=\"agree__input required\">\n            <span class=\"agree__box\">\n                Ich akzeptiere die Datenschutzbestimmungen.            <\/span>\n        <\/label>\n        <div class=\"step-errors\">\n            <span class=\"valid-message general\" style=\"display: none;\">Pflichtfeld<\/span>\n            <span class=\"valid-message invalid-email\" style=\"display: none;\">Bitte korrekte E-Mail angeben<\/span>\n        <\/div>\n    <\/div>\n\n    <div class=\"subscribe-step\">\n        <div class=\"form-control\">\n            <select class=\"js-select select\" name=\"gender\">\n                <option value=\"0\">Anrede<\/option>\n                <option value=\"Female\">Frau<\/option>\n                <option value=\"Male\">Herr<\/option>\n                <option value=\"Other\">Keine<\/option>\n            <\/select>\n        <\/div>\n        <span class=\"valid-message\" style=\"display: none;\">Pflichtfeld<\/span>\n        <div class=\"form-control\">\n            <input type=\"text\" name=\"name\" class=\"form-control-input\" placeholder=\"First name\">\n        <\/div>\n        <span class=\"valid-message\" style=\"display: none;\">Pflichtfeld<\/span>\n        <div class=\"form-control form-control-w-btn\">\n            <button tupe=\"button\" class=\"form-control-submit apply-btn js-subscribe-step form-mailchimp-subscribe\">\n                <img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/themes\/general\/frontend\/assets\/img\/arrow-right.svg\" alt=\"applay\">\n            <\/button>\n            <input type=\"text\" name=\"surname\" class=\"form-control-input\" placeholder=\"Last Name\">\n        <\/div>\n        <span class=\"valid-message\" style=\"display: none;\">Pflichtfeld<\/span>\n        <span class=\"invalid-message all\" style=\"display: none;\">Etwas ist schief gelaufen, versuche es erneut<\/span>\n        <span class=\"invalid-message pending\" style=\"display: none;\">Wir haben die Best\u00e4tigungs-E-Mail bereits verschickt &#8211; bitte best\u00e4tige deine Anmeldung<\/span>\n        <span class=\"invalid-message registered\" style=\"display: none;\">E-Mail ist bereits registriert, danke<\/span>\n    <\/div>\n\n    <div class=\"subscribe-step\">\n            <div class=\"subscribe__text\">\n            <h4>Herzlichen Dank<\/h4>\n<p>\u00dcberpr\u00fcfe dein E-Mail-Postfach und klicke auf den Best\u00e4tigungslink, den wir dir geschickt haben, um deine Anmeldung abzuschliessen.<\/p>\n        <\/div>\n        <\/div>\n<\/form>        <\/div>\n    <\/div>\n\n    <div class=\"card-back__bottom\">\n        <button class=\"btn btn-outline-w js-card-flip-back\">Schliessen<\/button>\n    <\/div>\n<\/div>    \n    \n    <\/div>\t\t\t\t\t                    <\/div>\n\t\t\t\t                    <div class=\"swiper-slide\">\n\t\t\t\t\t\t\t\t\t\t\n<div class=\"card-container \">\n    <div class=\"card \">\n        <div class=\"card__top\">\n            \n                            \n<div  class=\"card__media\">\n\n<picture>\n    <img decoding=\"async\" width=\"1920\" height=\"1080\" src=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/08\/software-engineer-job.png\" class=\"attachment-full size-full\" alt=\"\" srcset=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/08\/software-engineer-job.png 1920w, https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/08\/software-engineer-job-768x432.png 768w, https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/08\/software-engineer-job-1536x864.png 1536w\" sizes=\"(max-width: 1920px) 100vw, 1920px\" \/><\/picture>\n\n\n\n<\/div>\n                    <\/div>\n        <div class=\"card__body\">\n            <div class=\"card__head\">\n                <div class=\"card__head-left\">\n                                            <div class=\"card__category\">Job<\/div>\n                    \n                                        <h3 class=\"card__title\">Senior\u00a0Full Stack Engineer<\/h3>\n                                    <\/div>\n                                    \r\n<div  class=\"icon icon-35\">\r\n    <img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/04\/jobposting.svg\" class=\"attachment-35x35 size-35x35\" alt=\"\" \/><\/div>                            <\/div>\n\n            <div class=\"card__ligt-text\">12. August 2024<\/div>\n\n            <div class=\"card__text\">\n                <p>Als Mitglied eines agilen Kanban Teams treibst du die Dom\u00e4ne voran und pr\u00e4gst Vision, Roadmap und Features. Du implementierst Features vom Backend bis zum Frontend, gestaltest den Prozess aktiv mit und entwickelst Services, APIs und die Engine f\u00fcr Backend, API und Web UI Generierung weiter. Konzeption und Umsetzung von Software-Infrastruktur-Anforderungen mit Fokus auf Clean Code, gute Performance und hohe Testabdeckung.<\/p>\n            <\/div>\n\n            <div class=\"card__footer\">\n                <div class=\"card__action\">\n                    <button type=\"button\" class=\"action-btn js-card-flip\">\n                        <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"13\" height=\"15\" viewBox=\"0 0 13 15\" fill=\"none\">\r\n    <path d=\"M10.8333 15C10.2315 15 9.71991 14.7813 9.29861 14.3438C8.87732 13.9063 8.66667 13.375 8.66667 12.75C8.66667 12.6625 8.67269 12.5719 8.68472 12.4781C8.69676 12.3844 8.71482 12.3 8.73889 12.225L3.64722 9.15C3.44259 9.3375 3.21389 9.48438 2.96111 9.59063C2.70833 9.69688 2.44352 9.75 2.16667 9.75C1.56481 9.75 1.05324 9.53125 0.631944 9.09375C0.210648 8.65625 0 8.125 0 7.5C0 6.875 0.210648 6.34375 0.631944 5.90625C1.05324 5.46875 1.56481 5.25 2.16667 5.25C2.44352 5.25 2.70833 5.30313 2.96111 5.40938C3.21389 5.51562 3.44259 5.6625 3.64722 5.85L8.73889 2.775C8.71482 2.7 8.69676 2.61563 8.68472 2.52188C8.67269 2.42813 8.66667 2.3375 8.66667 2.25C8.66667 1.625 8.87732 1.09375 9.29861 0.65625C9.71991 0.21875 10.2315 0 10.8333 0C11.4352 0 11.9468 0.21875 12.3681 0.65625C12.7894 1.09375 13 1.625 13 2.25C13 2.875 12.7894 3.40625 12.3681 3.84375C11.9468 4.28125 11.4352 4.5 10.8333 4.5C10.5565 4.5 10.2917 4.44688 10.0389 4.34063C9.78611 4.23438 9.55741 4.0875 9.35278 3.9L4.26111 6.975C4.28519 7.05 4.30324 7.13438 4.31528 7.22813C4.32731 7.32188 4.33333 7.4125 4.33333 7.5C4.33333 7.5875 4.32731 7.67813 4.31528 7.77188C4.30324 7.86563 4.28519 7.95 4.26111 8.025L9.35278 11.1C9.55741 10.9125 9.78611 10.7656 10.0389 10.6594C10.2917 10.5531 10.5565 10.5 10.8333 10.5C11.4352 10.5 11.9468 10.7188 12.3681 11.1562C12.7894 11.5938 13 12.125 13 12.75C13 13.375 12.7894 13.9063 12.3681 14.3438C11.9468 14.7813 11.4352 15 10.8333 15Z\" fill=\"none\"\/>\r\n<\/svg>                    <\/button>\n                                        <button type=\"button\" class=\"action-btn bookmark\" data-id=\"12326\">\n                        <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"13\" height=\"17\" viewBox=\"0 0 13 17\" fill=\"none\">\r\n    <path d=\"M0.5 17V1.88889C0.5 1.36944 0.667857 0.924769 1.00357 0.554861C1.33929 0.184954 1.74286 0 2.21429 0H10.7857C11.2571 0 11.6607 0.184954 11.9964 0.554861C12.3321 0.924769 12.5 1.36944 12.5 1.88889V17L6.5 13.4111L0.5 17ZM2.21429 14.1194L6.5 11.3333L10.7857 14.1194V1.88889H2.21429V14.1194Z\" fill=\"none\"\/>\r\n<\/svg>                    <\/button>\n                                    <\/div>\n                <a href=\"https:\/\/apriko.com\/de\/blog\/senior-full-stack-engineer\/\" class=\"link-text\">Mehr erfahren<\/a>\n            <\/div>\n        <\/div>\n    <\/div>\n\n            \n<div class=\"card-back card-back--blue share-data\" data-id=\"12326\" data-url=\"https:\/\/apriko.com\/de\/blog\/senior-full-stack-engineer\/\" >\n            <h3 class=\"card-back__title\">Artikel teilen<\/h3>\n    \n    <div class=\"share-container\">\n        <ul class=\"share-nav share-step active\">\n            <li>\n                <a href=\"#\" class=\"js-share-copy\">\n                                        <div class=\"icon icon-35\">\n                        <img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/06\/url-3.svg\" class=\"attachment-35x35 size-35x35\" alt=\"\" \/>                    <\/div>\n                                        Link kopieren                <\/a>\n            <\/li>\n            <li>\n                <a href=\"#\" class=\"js-share-next\" data-share=\"email\">\n                                        <div class=\"icon icon-35\">\n                        <img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/06\/mail-2.svg\" class=\"attachment-35x35 size-35x35\" alt=\"\" \/>                    <\/div>\n                                        Per E-Mail senden                <\/a>\n            <\/li>\n            <li>\n                <a class=\"js-share-linkedin\" href=\"#\" target=\"_blank\">\n                                        <div class=\"icon icon-35\">\n                        <img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/uploads\/sites\/4\/2024\/06\/logo-linkedin-2.svg\" class=\"attachment-35x35 size-35x35\" alt=\"\" \/>                    <\/div>\n                                        Auf LinkedIn teilen                <\/a>\n            <\/li>\n        <\/ul>\n\n        <div class=\"share-step share-step-email\" data-share-target=\"email\">\n            <form class=\"share-email\">\n                                <h3 class=\"title-sm\">Per E-Mail senden<\/h3>\n                                <div class=\"form-control\">\n                    <input type=\"email\" name=\"email\" class=\"form-control-input\" placeholder=\"E-Mail\">\n                <\/div>\n                <span class=\"valid-message\" style=\"display: none;\">Pflichtfeld<\/span>\n                <span class=\"valid-message invalid-email\" style=\"display: none;\">Bitte korrekte E-Mail angeben<\/span>\n                <div class=\"share-email__bottom\">\n                    <div>\n                        <label class=\"agree\">\n                            <input type=\"checkbox\" class=\"agree__input\">\n                            <span class=\"agree__box\">\n                                Ich akzeptiere die Datenschutzvereinbarung und AGB.                            <\/span>\n                        <\/label>\n                        <span class=\"valid-message\" style=\"display: none;\">Pflichtfeld<\/span>\n                    <\/div>\n                    <div>\n                        <button type=\"button\" class=\"btn btn-secondary js-share-email\"  data-share=\"subscribe\">Senden<\/button>\n                    <\/div>\n                    <span class=\"invalid-message\" style=\"display: none;\">Etwas ist schief gelaufen, versuche es erneut<\/span>\n                <\/div>\n            <\/form>\n        <\/div>\n\n        <div class=\"share-step share-step-subscribe\" data-share-target=\"subscribe\">\n                            <div class=\"share-modal__text\"><p>Der Artikel wurde erfolgreich versendet. M\u00f6chtest du in Zukunft keine Apriko-Inhalte verpassen? Dann melde dich f\u00fcr unseren Newsletter an. <\/p>\n<\/div>\n                                        <h3 class=\"title-sm\">Jetzt zum Newsletter anmelden<\/h3>\n            \n            <form class=\"subscribe\">\n    <div class=\"subscribe-step active\">\n        <div class=\"form-control form-control-w-btn\">\n            <button tupe=\"button\" class=\"form-control-submit apply-btn js-subscribe-step\">\n                <img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/themes\/general\/frontend\/assets\/img\/arrow-right.svg\" alt=\"applay\">\n            <\/button>\n            <input type=\"email\" name=\"email\" class=\"form-control-input required\" placeholder=\"e-mail\">\n        <\/div>\n        <label class=\"agree form-control\">\n            <input type=\"checkbox\" name=\"agree\" class=\"agree__input required\">\n            <span class=\"agree__box\">\n                Ich akzeptiere die Datenschutzbestimmungen.            <\/span>\n        <\/label>\n        <div class=\"step-errors\">\n            <span class=\"valid-message general\" style=\"display: none;\">Pflichtfeld<\/span>\n            <span class=\"valid-message invalid-email\" style=\"display: none;\">Bitte korrekte E-Mail angeben<\/span>\n        <\/div>\n    <\/div>\n\n    <div class=\"subscribe-step\">\n        <div class=\"form-control\">\n            <select class=\"js-select select\" name=\"gender\">\n                <option value=\"0\">Anrede<\/option>\n                <option value=\"Female\">Frau<\/option>\n                <option value=\"Male\">Herr<\/option>\n                <option value=\"Other\">Keine<\/option>\n            <\/select>\n        <\/div>\n        <span class=\"valid-message\" style=\"display: none;\">Pflichtfeld<\/span>\n        <div class=\"form-control\">\n            <input type=\"text\" name=\"name\" class=\"form-control-input\" placeholder=\"First name\">\n        <\/div>\n        <span class=\"valid-message\" style=\"display: none;\">Pflichtfeld<\/span>\n        <div class=\"form-control form-control-w-btn\">\n            <button tupe=\"button\" class=\"form-control-submit apply-btn js-subscribe-step form-mailchimp-subscribe\">\n                <img decoding=\"async\" src=\"https:\/\/apriko.com\/de\/wp-content\/themes\/general\/frontend\/assets\/img\/arrow-right.svg\" alt=\"applay\">\n            <\/button>\n            <input type=\"text\" name=\"surname\" class=\"form-control-input\" placeholder=\"Last Name\">\n        <\/div>\n        <span class=\"valid-message\" style=\"display: none;\">Pflichtfeld<\/span>\n        <span class=\"invalid-message all\" style=\"display: none;\">Etwas ist schief gelaufen, versuche es erneut<\/span>\n        <span class=\"invalid-message pending\" style=\"display: none;\">Wir haben die Best\u00e4tigungs-E-Mail bereits verschickt &#8211; bitte best\u00e4tige deine Anmeldung<\/span>\n        <span class=\"invalid-message registered\" style=\"display: none;\">E-Mail ist bereits registriert, danke<\/span>\n    <\/div>\n\n    <div class=\"subscribe-step\">\n            <div class=\"subscribe__text\">\n            <h4>Herzlichen Dank<\/h4>\n<p>\u00dcberpr\u00fcfe dein E-Mail-Postfach und klicke auf den Best\u00e4tigungslink, den wir dir geschickt haben, um deine Anmeldung abzuschliessen.<\/p>\n        <\/div>\n        <\/div>\n<\/form>        <\/div>\n    <\/div>\n\n    <div class=\"card-back__bottom\">\n        <button class=\"btn btn-outline-w js-card-flip-back\">Schliessen<\/button>\n    <\/div>\n<\/div>    \n    \n    <\/div>\t\t\t\t\t                    <\/div>\n\t\t\t\t\n\t\t\t\t\t\t\t<\/div>\n            \t\t<\/div>\n\t<\/div>\n<\/section>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":5,"featured_media":0,"menu_order":0,"template":"","meta":{"_acf_changed":false,"footnotes":""},"categories":[79],"tags":[],"authors":[],"visual-tag":[],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v23.3 (Yoast SEO v23.3) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Automatische Generierung der grafischen Benutzeroberfl\u00e4che (UI) - Apriko<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/apriko.com\/de\/blog\/automatische-generierung-der-grafischen-benutzeroberflaeche-ui\/\" \/>\n<meta property=\"og:locale\" content=\"de_DE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Automatische Generierung der grafischen Benutzeroberfl\u00e4che (UI)\" \/>\n<meta property=\"og:url\" content=\"https:\/\/apriko.com\/de\/blog\/automatische-generierung-der-grafischen-benutzeroberflaeche-ui\/\" \/>\n<meta property=\"og:site_name\" content=\"Apriko\" \/>\n<meta property=\"article:modified_time\" content=\"2025-01-06T08:57:37+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Gesch\u00e4tzte Lesezeit\" \/>\n\t<meta name=\"twitter:data1\" content=\"6\u00a0Minuten\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/apriko.com\/de\/blog\/automatische-generierung-der-grafischen-benutzeroberflaeche-ui\/\",\"url\":\"https:\/\/apriko.com\/de\/blog\/automatische-generierung-der-grafischen-benutzeroberflaeche-ui\/\",\"name\":\"Automatische Generierung der grafischen Benutzeroberfl\u00e4che (UI) - Apriko\",\"isPartOf\":{\"@id\":\"https:\/\/apriko.com\/de\/#website\"},\"datePublished\":\"2024-04-26T09:24:35+00:00\",\"dateModified\":\"2025-01-06T08:57:37+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/apriko.com\/de\/blog\/automatische-generierung-der-grafischen-benutzeroberflaeche-ui\/#breadcrumb\"},\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/apriko.com\/de\/blog\/automatische-generierung-der-grafischen-benutzeroberflaeche-ui\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/apriko.com\/de\/blog\/automatische-generierung-der-grafischen-benutzeroberflaeche-ui\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Apriko\",\"item\":\"https:\/\/apriko.com\/de\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Automatische Generierung der grafischen Benutzeroberfl\u00e4che (UI)\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/apriko.com\/de\/#website\",\"url\":\"https:\/\/apriko.com\/de\/\",\"name\":\"Apriko\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/apriko.com\/de\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"de\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Automatische Generierung der grafischen Benutzeroberfl\u00e4che (UI) - Apriko","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/apriko.com\/de\/blog\/automatische-generierung-der-grafischen-benutzeroberflaeche-ui\/","og_locale":"de_DE","og_type":"article","og_title":"Automatische Generierung der grafischen Benutzeroberfl\u00e4che (UI)","og_url":"https:\/\/apriko.com\/de\/blog\/automatische-generierung-der-grafischen-benutzeroberflaeche-ui\/","og_site_name":"Apriko","article_modified_time":"2025-01-06T08:57:37+00:00","twitter_card":"summary_large_image","twitter_misc":{"Gesch\u00e4tzte Lesezeit":"6\u00a0Minuten"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/apriko.com\/de\/blog\/automatische-generierung-der-grafischen-benutzeroberflaeche-ui\/","url":"https:\/\/apriko.com\/de\/blog\/automatische-generierung-der-grafischen-benutzeroberflaeche-ui\/","name":"Automatische Generierung der grafischen Benutzeroberfl\u00e4che (UI) - Apriko","isPartOf":{"@id":"https:\/\/apriko.com\/de\/#website"},"datePublished":"2024-04-26T09:24:35+00:00","dateModified":"2025-01-06T08:57:37+00:00","breadcrumb":{"@id":"https:\/\/apriko.com\/de\/blog\/automatische-generierung-der-grafischen-benutzeroberflaeche-ui\/#breadcrumb"},"inLanguage":"de","potentialAction":[{"@type":"ReadAction","target":["https:\/\/apriko.com\/de\/blog\/automatische-generierung-der-grafischen-benutzeroberflaeche-ui\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/apriko.com\/de\/blog\/automatische-generierung-der-grafischen-benutzeroberflaeche-ui\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Apriko","item":"https:\/\/apriko.com\/de\/"},{"@type":"ListItem","position":2,"name":"Automatische Generierung der grafischen Benutzeroberfl\u00e4che (UI)"}]},{"@type":"WebSite","@id":"https:\/\/apriko.com\/de\/#website","url":"https:\/\/apriko.com\/de\/","name":"Apriko","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/apriko.com\/de\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"de"}]}},"_links":{"self":[{"href":"https:\/\/apriko.com\/de\/wp-json\/wp\/v2\/detail-page\/12459"}],"collection":[{"href":"https:\/\/apriko.com\/de\/wp-json\/wp\/v2\/detail-page"}],"about":[{"href":"https:\/\/apriko.com\/de\/wp-json\/wp\/v2\/types\/detail-page"}],"author":[{"embeddable":true,"href":"https:\/\/apriko.com\/de\/wp-json\/wp\/v2\/users\/5"}],"version-history":[{"count":29,"href":"https:\/\/apriko.com\/de\/wp-json\/wp\/v2\/detail-page\/12459\/revisions"}],"predecessor-version":[{"id":13520,"href":"https:\/\/apriko.com\/de\/wp-json\/wp\/v2\/detail-page\/12459\/revisions\/13520"}],"wp:attachment":[{"href":"https:\/\/apriko.com\/de\/wp-json\/wp\/v2\/media?parent=12459"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/apriko.com\/de\/wp-json\/wp\/v2\/categories?post=12459"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/apriko.com\/de\/wp-json\/wp\/v2\/tags?post=12459"},{"taxonomy":"authors","embeddable":true,"href":"https:\/\/apriko.com\/de\/wp-json\/wp\/v2\/authors?post=12459"},{"taxonomy":"visual-tag","embeddable":true,"href":"https:\/\/apriko.com\/de\/wp-json\/wp\/v2\/visual-tag?post=12459"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}