Meine Projekte

Dieses Frontend-Projekt stellt eine persönliche Dokumentation für Blender dar, ein Open-Source-3D-Computergrafikprogramm. Diese Dokumentation bietet für mich wichtige Informationen über die Grundlagen von Blender, Materialien und obligatorische Hotkeys, die für eine effiziente Nutzung notwendig sind. Die Dokumentation ist auf die Funktionen zugeschnitten, die speziell für meine Projekte und Arbeitsabläufe entscheidend sind. Außerdem enthält sie eine Anleitung zur Integration von Blender-Dateien in React.js mit Three.js. Während des gesamten Projekts lag mein Fokus darauf, mich mit dem Svelte-Framework (SvelteKit), vertraut zu machen.

In diesem persönlichen Blog speichere ich Beiträge und Gedankengänge zu verschiedenen Themen, die ich in Zukunft potenziell wieder aufgreifen möchte. Allen voran nutze ich dieses Projekt, um Problemlösungsstrategien für verschiedene Coding-Aufgaben aufzubewahren. Ich kann mir auch vorstellen, weitere Themenbereiche hinzuzufügen, wie beispielsweise die Software Godot oder Unity. Der Zweck dieses Blogs ist es, als persönlicher Wissensspeicher herzuhalten. Er ermöglicht es mir, auf die hinterlegten Themen auf eine für mich verständliche Weise zurückzugreifen. Bei diesem Projekt ging es mir insbesondere darum, mein Wissen über das Angular-Framework zu erweitern.

Dieses Frontend-Projekt beinhaltet verschiedene Funktionen, die es Benutzern ermöglichen, bestimmte Arbeits-/Studienzeiten festzulegen, gefolgt von bestimmten Entspannungsintervallen, ähnlich wie bei einer Pomodoro-Uhr. Der Hauptfokus dieses Projekts liegt in der Anwendung meiner React.js-Kenntnisse und der Erforschung kreativer Frontend-Styling-Techniken. Im unteren Teil der Anwendung befindet sich ein Bereich zur Verwaltung von Aufgaben, in dem Benutzer neue Aufgaben mit Beschreibungen und vordefinierten Abzeichen hinzufügen können. Ein Zeitstempel zeigt an, wann die jeweilige Aufgabe hinzugefügt wurde. Die Benutzer haben auch die Möglichkeit, eine Aufgabe als erledigt zu markieren und sie damit in den Container für erledigte Aufgaben zu verschieben. Die erledigte Aufgabe erhält einen neuen Zeitstempel, der anzeigt, wann sie als erledigt markiert wurde.

Divid ist eine mit React Native entwickelte mobile Anwendung, die speziell für Android-Systeme optimiert wurde. Es stellt ein Fullstack-Lernprojekt ohne Veröffentlichung in einem App Store dar. Der derzeitig vorhandene Quellcode ist jedoch öffentlich auf GitHub zugänglich. Eines der Hauptmerkmale von Divid ist ein kleines Spiel, das sich um das Dividieren von Zahlen dreht, daher der Name „Divid“. Zusätzlich habe ich eine Art Shopsystem in die Anwendung implementiert, das es den Spielern ermöglicht, für das Absolvieren von Spielrunden Belohnungen zu erhalten. Was die Funktionalität betrifft, so beinhaltet Divid ein Firebase-Backend-System, das die Benutzerauthentifizierung mit Benutzerregistrierung und Login-Funktionen umfasst. Darüber hinaus nutzt die Anwendung Firebase, um die persönlichen Daten der Nutzer sicher zu erfassen und zu speichern.

Bei dieser Anwendung handelt es sich um eine Website, die einen Nährwertrechner für primäre Nährwerte anbietet. Sie bietet eine Möglichkeit, den Nährstoffgehalt von Mahlzeiten zu berechnen. Die Website enthält eine kleine Auswahl an Standard-Lebensmitteln, ermöglicht aber auch die manuelle Eingabe von Nährwerten für bestimmte Mahlzeiten. Diese Flexibilität gewährleistet, dass die Nährwertangaben für jede Art von Lebensmittel oder Rezept genau verfolgt werden können. Das Hauptziel dieses Frontend-Projekts war es, die Fähigkeiten des Vue.js-Frameworks zu erlernen und zu demonstrieren. Die Idee für den Nährwertrechner entstand jedoch aus dem persönlichen Wunsch, eine schnelle und einfache Methode zu haben, um die Nährwertzusammensetzung meiner Mahlzeiten zusammenzufassen. Indem ich einen klaren Überblick über die Mengen an Kohlenhydraten, Fett, Zucker und Proteinen habe, die ich täglich zu mir nehme, kann ich fundierte Entscheidungen über meine Ernährung treffen und einen gesünderen Lebensstil pflegen.

Bei diesem Projekt habe ich versucht, den damaligen Stand der Chess.com Landing Page im Sinne des Stylings nachzuahmen. Ich habe mich bewusst dafür entschieden, keine Form von Frameworks zu verwenden, da ich mich selbst mit einem rohen Ansatz herausfordern und mein Frontend-Wissen nutzen wollte, um passende und innovative Lösungen zu entdecken. Da ich keinen Code über die Konsole kopiert habe, stimmen einige Maße möglicherweise nicht genau mit denen der ursprünglichen Website überein. Ebenso handelt es sich bei den größeren Bildern lediglich um Screenshots, was zu leicht abweichenden Maßen führt. Das Hauptziel war jedoch nicht, eine exakte Kopie zu erstellen, sondern die Chess.com Landing Page als Design-Leitfaden zu verwenden und meine HTML- und CSS-Fähigkeiten einzusetzen, um eine visuell ähnliche Landing Page zu erstellen. Zusätzlich habe ich ebenfalls etwas JavaScript in das Hauptschachbrett im oberen Bereich eingebaut. Anstelle eines statischen Bildes habe ich ein dynamisches Raster mit möglichen Startzügen für die Bauern und Springer erstellt. Außerdem habe ich einen kleinen Zufallsgenerator für die Kategorien "Games Today" und "Playing Now" im oberen Teil der Landing Page implementiert.