CookBook
A digital cookbook for sharing and discovering recipes
Unternehmen
Self Project
Jahr
2022
Categorie
Cooking
Rolle
Front End Developer
Überblick
CookBook ist eine digitale Rezeptplattform, die es Benutzern ermöglicht, Kochideen basierend auf verfügbaren Zutaten und Ernährungspräferenzen zu entdecken und zu teilen. Es wurde als eines meiner allerersten Projekte als Frontend-Entwickler entwickelt, mit dem Ziel, die API-Integration und das benutzerorientierte Interface-Design zu erlernen.
Die App integriert die Edamam-API, um Rezeptdaten abzurufen, und unterstützt Suchanfragen basierend auf Zutaten, diätetischen Einschränkungen (z. B. vegan, glutenfrei) und Ernährungsbedürfnissen. Die Benutzeroberfläche wurde mit React erstellt und mit reinem CSS und Utility-First-Tailwind-Klassen gestaltet, um Responsivität und Barrierefreiheit zu gewährleisten.
Dieses Projekt legte den Grundstein für meine Reise als Entwickler und half mir zu verstehen, wie man dynamische Benutzeroberflächen erstellt, mit Drittanbieter-APIs arbeitet und wartbare React-Anwendungen strukturiert.
Tech-Stack
Frontend: React, JavaScript, Tailwind CSS API-Integration: Edamam Recipe Search API
Ziele
- Design und Entwicklung einer benutzerfreundlichen Oberfläche zur Rezeptentdeckung mit React.
- Integration mit der Edamam-API zum Abrufen und Filtern von Rezepten basierend auf Benutzereingaben und Diätfiltern.
- Aktivierung der Suchfunktion nach Zutaten, um ein persönlicheres Kocherlebnis zu ermöglichen.
- Anwendung von Prinzipien für responsives Layout, um die Benutzerfreundlichkeit auf verschiedenen Bildschirmgrößen zu gewährleisten.
- Sammeln von grundlegenden Erfahrungen im Umgang mit APIs, der Komponentenstrukturierung und dem State-Management.
- Erstellung eines ansprechenden und visuell attraktiven Dashboards und einer Suchoberfläche zur Bereicherung der gesamten Benutzererfahrung.
Projekt-Galerie
Ein Einblick in das Projekt