“Ist das Kunst oder kann das web?”

Eine online Kunstgalerie, eine Finanzplattform und eine Cocktail-Webseite - das sind die schicken Frontend-Projekte unserer Teilnehmenden aus dem aktuellen Full-Stack-Bootcamp, die sie am Freitag stolz präsentiert haben. Aber seht selbst!

Die online Kunstgalerie Artify

Wie kann man Kunst so präsentieren, dass sie auch online die Betrachter in ihren Bann zieht und gleichzeitig alle wichtigen Informationen liefert? Die Frage stellten sich die vier Mitglieder der erste Gruppe des Full- Stack-Kurses, die das Projekte eine Woche lang geplant und gecodet hatten.

Mit einem cleanen, eleganten Design in schwarz-weiß, zeigt die Webseite “Artify”, wie Kunst im 21. Jahrhundert funktionieren kann. Die Kunstgalerie zeigt übersichtlich Gemälde, die man mit einem Klick vergrößern kann und relevante Infos, wie Künstler:in, Maße oder Epoche bekommt. Neben dem Filtern von Kategorien und einer Sucheingabe gibt es noch eine originelle Besonderheit: Die Besucher:innen der Webseite können selbst entscheiden, ob sie sich lieber horizontal oder vertikal durch die Galerien scrollen möchten. Die Webseite zieht sich die Daten übrigens über eine externe Kunstquelle des Harvard Art Museums, die dann auf der Webseite verarbeitet werden. Die Gruppenmitglieder verwendeten neben HTML, CSS und Javascript das Framework React.js, verschiedene APIs und Flex-Box für das responsive Design. Alles klar? Wenn nicht, schau es dir einfach mal an: Artify

Die Finanz-Plattform Ex-Change

Die zweite Gruppe beschäftigte sich mit der Frage, wie man in solch unsicheren Zeiten sein Geld sinnvoll anlegen und investieren kann und dabei einen guten Überblick über Unternehmensaktien, Kryptowährungen und Umrechnungskurse behält.

Mit der Webseite Ex-Change gelingt es den Teilnehmenden eine optisch ansprechende und responsive Plattform über die Finanzwelt zu erschaffen, die auf einen Blick anzeigt, wo es sich lohnen könnte zu investieren, um sein Vermögen zu schützen. Neben einer Suchfunktion für alle gängigen Unternehmensaktien, gibt es eine intuitiv bedienbare Zoom-Funktion, um sich bestimmte Zeiträume als Detailansicht anzeigen zu lassen. Außerdem findet man gute Infos, was Bitcoin & Co eigentlich genau sind, was man damit machen kann und wie die Kurse gerade stehen. Sinnvoll ist auch die News-Kategorie, die wichtige Themen aus der Finanzwelt anzeigt. Für dieses anspruchsvolle Projekt mussten die Teilnehmende einige Daten-Schnittstellen (sogenannte APIs) anzapfen, haben fleißig mit HTML, CSS und Javascript gecodet und das Ergebnis kann sich coding-technisch und optisch absolut sehen lassen. Well done! Ex-Change

Home of fine drinking: Forty

If life gives you lemons...mach einfach eine Cocktail-Webseite draus! Noch besser: Gestalte sie so, dass sie besonders in der mobilen Ansicht großen Appetit auf selbstgemachte Cocktails macht! Das könnte das Motto der dritten Gruppe bei ihrem Projekt FORTY gewesen sein, denn sobald man auf der Startseite ist, überzeugt einen das Design und die ausgesuchten Bilder, sich der Kunst des Cocktail-Mixens zu widmen.

Die Cocktail-Seite ist in einem schönen schwarz gehalten und bietet neben einer Rubriksuche nach z.B. Rum, Gin oder Wodka, einen Button zur zufälligen Cocktail-Inspiration. Besonders die mobile Version bietet eine schicke Übersicht, die direkt Lust aufs Einkaufen der Zutaten macht und bei Bedarf die Zutaten sogar direkt online bestellt. Zugegriffen wird auf eine Cocktail-Datenschnittstelle (API), die die Daten für die Rezepte liefert. Programmiert ist die Seite mit HTML, CSS sowie Javascript mit React.js. Zukünftig soll es auch noch eine Suche geben, um bekannte Cocktails einzugeben und anschließend seine Favoriten zu speichern. Außerdem ist ein Bewertungssystem für die einzelnen Rezepte in Planung. Der Name der Seite erschließt sich übrigens aus den Haupt-Rubriken der Alkohol-Sorten, die fast alle über 40% Schuss haben.

Schau hier: FORTY

Wow! Und nun? Auch dieses mal zeigten unsere Teilnehmenden, was nach 3 Monaten intensiven Lernens im Bereich Webentwicklung möglich ist! Nun geht es weiter mit Modul 2 - dem Backend-Bereich und schon bald werden unsere IT-Talente der Zukunft den Arbeitsmarkt erobern. Wir sind sehr stolz auf euch und eure Projekte, die ihr komplett remote, fast ohne Hilfestellung und hoch motiviert umgesetzt habt!

Das willst du auch können? Dann meld dich schnell bei SuperCode und starte deine digitale Karriere als Webentwickler*in!

Bilder: SuperCode
Text: Natalie Streich