In nur fünf Tagen vom Konzept bis zur Markteinführung einsatzbereit
Am 14. Oktober schickte Atanas Bruno eine E-Mail mit einer Idee für eine TMS WEB Core- betriebene Web-App, um unseren internen Partner-Halloween-Kostümwettbewerb durchzuführen. Das Ziel war eine einfache Webseite, auf der die Teammitglieder Bilder ihrer Halloween-Kostüme einreichen und dann alle über ihre Favoriten abstimmen konnten.
Oh, und wir brauchten es so schnell wie möglich, damit wir Zeit hatten, es zu benutzen.
Die Idee ist einfach, aber wie Ihnen jeder erfahrene Programmierer sagen kann, gibt es viele technische Fragen und Anforderungen zu erfüllen:
- Können Sie Bilder aus der Web-App aufnehmen oder einfach hochladen?
- Einrichten des Backends zum Speichern der Daten
- Kommunikation vom Frontend zum Backend
- Spam-Abstimmungen verhindern
- Eine administrative Schnittstelle für alles
Insbesondere in der Webentwicklung ist es üblich, Entwickler in zwei Kategorien einzuteilen: Frontend und Backend . Der Grund dafür ist, dass meist zwei völlig unterschiedliche Programmiersprachen benötigt werden. Das Frontend läuft auf JavaScript (wobei WebAssembly immer noch an Fahrt gewinnt), während das Backend auf verschiedenen Sprachen läuft: PHP, C#, Java, Python, Perl usw.
Der Running Gag in der Softwareentwicklung ist, dass das Frontend beeindruckend aussieht, aber das Backend gruselig ist. Aus konzeptioneller Sicht erstellt ein Front-End-Entwickler den Teil, den der Benutzer sieht, was die UI- und Designästhetik wichtig macht. Im Gegensatz dazu erstellt der Back-End-Entwickler nur den Teil, den andere Entwickler sehen. Im Idealfall sind beide Teile gut gestaltet, aber jetzt bin ich im Unkraut und habe den Sinn dieses Blogbeitrags vergessen.
Wenn Sie die gesamte Software und die Werkzeuge nehmen, die zum Erstellen einer Anwendung verwendet werden, wird dies als Stack bezeichnet. Der häufigste Web – Stack ist LAMP, ein Akronym , das ursprünglich für stand L inux, A pache, M ySQL, P HP, dies ist jedoch unvollständig , da sie annimmt JavaScript ist die einzige Lösung für den in-Browser ist.
Einer der Gründe, warum Node.js so beliebt war, ist, dass Entwickler JavaScript sowohl im Backend als auch im Frontend verwenden konnten. Dies machte das Konzept eines Full-Stack populärer: Es wären nicht mehr zwei verschiedene Fähigkeiten und Programmiersprachen erforderlich: Jeder kann einfach überall JavaScript verwenden!
Nun, JavaScript ist nicht die einzige Full-Stack-Programmiersprache. Meiner Meinung nach hat Delphi Full-Stack-Entwicklung mit seinen Client-Server-Architekturen konzipiert. Anstatt PHP oder Java (beide im selben Jahr wie Delphi veröffentlicht) für das Backend und dann etwas anderes für das Frontend zu verwenden, hat Delphi alles in derselben IDE mit derselben Programmiersprache gemacht.
1995 waren die meisten Webanwendungen nur statisches HTML (Cascading Style Sheets erschienen erst 1996, und es dauerte eine Weile, bis sie sich durchsetzten). Und obwohl JavaScript 1995 zusammen mit Delphi, PHP, Java und vielen anderen modernen Programmiersprachen geboren wurde, war es noch nicht weit verbreitet. Heutzutage verwenden die meisten Webseiten viel JavaScript. Manchmal gibt es mehr JavaScript-Code als der Rest von HTML, CSS und Bildern zusammen.
Okay, das war ein interessanter Einblick in Stacks, Frontends, Backends und die Geschichte der Webentwicklung, aber was hat das alles mit Halloween zu tun? Schön, dass Sie gefragt haben – Delphi ist dank der Leistungsfähigkeit des TMS WEB Core-Frontends und des TMS XData-Backends immer noch ein fabelhaft produktives Full-Stack-Entwicklungstool für die Entwicklung von Webanwendungen, und die RADoween-Webanwendung ist ein großartiges Beispiel.
In wahrscheinlich kürzerer Zeit als ich das oben geschrieben habe, hat das Team von TMS Software, das mit TMS WEB Core und TMS XData befasst ist, dh Bruno Fierens, Wagner Landgraf und Bradley Velghe, einen Machbarkeitsnachweis erstellt, der es den Benutzern ermöglicht, ein Bild hochzuladen, die Gerätekamera, geben Sie deren Details ein, sehen Sie sich die Liste der vorherigen Einsendungen an, teilen Sie eine Einsendung, stimmen Sie ab und sortieren Sie…
Screenshot der Einreichungsliste in der Proof-of-Concept-App. Die Abstimmung über einen Klick auf den Kürbis war bereits im Prototypen.
Das mag einfach aussehen, aber die Schönheit liegt in der verborgenen Komplexität. In nur fünf Arbeitstagen wurde eine Idee für eine Webanwendung vollständig umgesetzt und live bereitgestellt, alles mit einem einzigen Stack und ohne die Notwendigkeit, verschiedene Programmiersprachen oder Entwicklungsteams zu kombinieren.
Werfen wir einen Blick auf die verschiedenen Teile dieses Delphi-basierten Web-Stacks.
Delphi-IDE
Dies ist die IDE und die Sprache, die verwendet wird, um sowohl die Web-Client-Anwendung, dh das Frontend, als auch das Backend, den REST-API-Server, zu erstellen. Dazu wurden diese beiden Produkte in der Delphi IDE installiert:
TMS WEB Core : Komponentenframework für den Webclient + Object Pascal to JavaScript Compiler (Transpiler) und eine Object Pascal RTL für den Browser. Die verwendeten visuellen Komponenten sind überraschend einfach: TWebCamera, einige TWebEdit- und TWebComboBox-Komponenten, das TWebContinuousScrollControl zum inkrementellen Anzeigen der Liste der Einträge, die TWebShare-Komponente für den Zugriff auf das Gerätefreigabeblatt.
Das Look & Feel der RADoween App wird hauptsächlich über HTML5 und CSS3 erstellt. TMS WEB Core bietet einen einzigartigen Bindungsmechanismus, um die UI-Logik mit einer HTML-Vorlage zu verbinden. Alles zu TMS WEB Core finden Sie hier: https://www.tmssoftware.com/site/tmswebcoreintro.asp
TMS XData : nativer Delphi-Code-basierter REST-API-Server. Mit TMS XData können Sie auf einfache Weise robuste, schnelle REST-API-Endpunkte erstellen und dies auch für den Frontend-Entwickler über die Swagger UI dokumentieren. TMS XData kann optional das Aurelius ORM nutzen, das den REST-API-Server auch von der Datenbank abstrahiert. Dies bedeutet, dass Sie leicht auswählen können, mit welcher Datenbank der Back-End-Server gekoppelt werden soll.
Der TMS XData REST-Server wurde auf Amazon Web Services (AWS) bereitgestellt. Alles zu TMS XData finden Sie hier: https://www.tmssoftware.com/site/tmsbizintro.asp
Möchten Sie mehr darüber erfahren, wie Delphi und TMS die schnelle Anwendungsentwicklung mit vollem Stack ins Web bringen? Besuchen Sie Bruno bei seiner Sitzung auf der DelphiCon: Thriller: A Delphi Web App in 5 Work Days am Dienstag, den 16. November 2021, um 14:00 Uhr CST. Die Registrierung für DelphiCon ist kostenlos und Sie erhalten Zugang zu allen anderen fantastischen Sessions.
Der vollständige Quellcode ist auf GitHub verfügbar und wird während der DelphiCon-Sitzung geteilt. Wenn Sie die einzigartigen Komponenten von Delphi oder TMS Software noch nicht verwenden, können Sie jetzt eine kostenlose Testversion anfordern und Ihre Ideen schneller ins Internet stellen.
Sehen Sie sich den Blogbeitrag von TMS Software zum Projekt an, der ein Video enthält
