Rezepte App
Applikation für die Entdeckung veganer Gerichte
Die Rezepte App ist ein Übungsprojekt, das eine interaktive und benutzerfreundliche Plattform zur Entdeckung veganer Gerichte bietet. Sie wurde mit JavaScript, React und Vite entwickelt, wodurch sie besonders performant und effizient ist. Dank der intuitiven Struktur können Nutzer schnell und einfach Rezepte finden sowie alle wichtigen Details entdecken.
Die App umfasst mehrere Seiten, darunter eine Home- und About-Seite sowie eigene Unterseiten für jedes Rezept. Die Daten stammen aus der Tasty API, wobei ausschließlich vegane Gerichte gefiltert wurden. Mithilfe der integrierten Suchfunktion lassen sich Rezepte gezielt nach Stichwörtern filtern, sodass jeder Nutzer genau das findet, wonach er sucht.
Das Design überzeugt mit erdigen Pastellfarben, die ein natürliches und gesundes Ambiente schaffen. Zusätzlich sorgen sanfte Animationen mit Framer Motion und stilvolle Icons von React-Icons für eine moderne sowie angenehme Benutzererfahrung.
GitHub: AlexaSta-hello/recipes-app
Website: https://recipes-app-947.pages.dev/
Website-Tour starten:
Funktionalitäten und Bibliotheken
Die App demonstriert den Einsatz moderner Technologien und bietet eine durchdachte Nutzererfahrung:
React und komponentenbasierte Architektur
- Die App verwendet React-Hooks wie useState, useEffect, useParams und useOutletContext, um Interaktivität und dynamische Datenintegration zu gewährleisten.
- Die Outlet-Komponente wird genutzt, um Zutaten (Ingredients) und Zubereitungsschritte (Instructions) effizient darzustellen.
Lade- und Fehler-Handling CSS
- Präzises Styling mit einer individuellen Farbpalette, responsiven Layouts und ansprechenden Hover-Effekten.
Framer Motion
- Animierte Elemente gestalten die Nutzererfahrung lebendiger.
React-Icons
- Integration von Icons, um die Darstellung ansprechender und intuitiver zu gestalten.
Erdige Pastellfarben und benutzerfreundliches Design
- Das minimalistische Design mit warmen, natürlichen Farben schafft eine einladende Atmosphäre und unterstreicht den Fokus auf gesunde Ernährung.
In einem kurzen Gespräch kannst du mir von deinem Projekt erzählen und deine Fragen loswerden.
